All files / app/mods lens.ts

100% Statements 4/4
100% Branches 0/0
100% Functions 0/0
100% Lines 4/4

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130117x         117x                                                                               117x                                                                                                                                                       117x                
import { DateTime } from 'luxon';
import { Plugin } from '../model/plugin';
import { Mod } from '../model/tag';
import { Template } from '../model/template';
 
export const lensPlugin: Plugin = {
  tag: 'plugin/lens',
  name: $localize`🪞 Lens`,
  config: {
    mod: $localize`🪞 Lenses`,
    version: 1,
    type: 'plugin',
    default: true,
    add: true,
    embeddable: true,
    generated: $localize`Generated by jasper-ui ${DateTime.now().toISO()}`,
    description: $localize`Embed a Lens in a Ref`,
    aiInstructions: `# plugin/lens
    The lens plugin allows embedding a query in a Ref or markdown.
    To create a Ref lens imply have the Ref url (or plugin url {"plugins": { "plugin/lens": { "url": "urlOverride" }}})
    set to a url with an absolute url to a tag page. If the tag query has a default lens, that will
    automatically be shown, otherwise the lens type can be overridden by adding ?view=lens to the URL.
    For markdown, any relative or absolute links to a query will automatically display the default lens.
    If no lens can be found, the list lens is used.
    Use [query](/tag/lens) to display an link with an embed toggle.
    Use ![](/tag/lens) or [embed](/tag/lens) embed the lens directly.`,
    icons: [{ label: $localize`🪞`, order: 1 }],
    filters: [
      { query: 'plugin/lens', label: $localize`🪞 lens`, title: $localize`Lens`, group: $localize`Plugins 🧰️` },
    ],
    advancedForm: [{
      key: 'url',
      type: 'url',
      props: {
        label: $localize`URL: `,
      },
    }],
  },
  schema: {
    optionalProperties: {
      url: { type: 'string' },
    },
  },
};
 
export const lensTemplate: Template = {
  tag: 'plugin/lens',
  name: $localize`🪞 Lenses`,
  config: {
    mod: $localize`🪞 Lenses`,
    version: 1,
    type: 'plugin',
    default: true,
    generated: $localize`Generated by jasper-ui ${DateTime.now().toISO()}`,
    view: $localize`🪞`,
    description: $localize`Activates built-in Lens viewer mode for viewing Refs.`,
    // language=CSS
    css: `
      app-ref-list.plugin_lens {
        .list-container {
          grid-auto-flow: row dense;
          padding: 4px;
          gap: 8px;
          grid-template-columns:  1fr;
          @media (min-width: 1500px) {
            grid-template-columns: 1fr 1fr;
          }
          @media (min-width: 3000px) {
            grid-template-columns: 1fr 1fr 1fr 1fr;
          }
          .list-number {
            display: none;
          }
          .ref {
            margin: 0;
            padding: 0;
            .image-expand {
              position: relative;
              min-width: 100%;
              min-height: 100%;
              border-radius: 7px;
              overflow: hidden;
              margin: 0;
              padding: 0;
            }
            .toggle,
            .thumbnail {
              display: none;
            }
            @media (max-width: 740px) {
              .actions, .info {
                height: 28px;
              }
            }
          }
        }
      }
    `,
    advancedForm: [{
      key: 'defaultExpanded',
      type: 'boolean',
      defaultValue: true,
      props: {
        label: $localize`Default Expanded:`,
      },
    }, {
      key: 'hideEdit',
      type: 'boolean',
      defaultValue: true,
      props: {
        label: $localize`Hide Edit:`,
      },
    }],
  },
  defaults: {
    defaultExpanded: true,
    hideEdit: true,
    defaultCols: 2,
  }
};
 
export const lensMod: Mod = {
  plugin: [
    lensPlugin,
  ],
   template: [
    lensTemplate,
  ],
};