@foxy.io/elements 1.27.0-beta.5 → 1.27.0-beta.7

package/dist/elements/internal/InternalAsyncListControl/InternalAsyncListControl.d.ts

@@ -1,6 +1,8 @@
 import type { PropertyDeclarations, TemplateResult } from 'lit-element';
 import type { CollectionPage } from '../../public/index';
 import type { FormDialog } from '../../index';
+import type { Option } from '../../public/QueryBuilder/types';
+import type { Action } from './types';
 import { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';
 export declare class InternalAsyncListControl extends InternalEditableControl {
     static get properties(): PropertyDeclarations;
@@ -12,12 +14,18 @@ export declare class InternalAsyncListControl extends InternalEditableControl {
     createPageHref: string | null;
     /** Same as the `related` property of `NucleonElement`. */
     related: string[];
+    /** Swipe actions. */
+    actions: Action<import("../../public/NucleonElement/types").HALJSONResource>[];
+    /** Query parameters to apply to the `first` URL. */
+    filters: Option[];
     /** Limit query parameter to apply to the `first` URL. */
     limit: number;
     /** URI of the first page of the hAPI collection to display. */
     first: string | null;
     /** Same as the `form` property of `FormDialog`. If set, will open a dialog on item click. */
     form: FormDialog['form'];
+    /** Props to pass through to the form rendered by `FormDialog`. */
+    formProps: Record<string, unknown>;
     /** Same as the `item` property of `CollectionPage`. */
     item: CollectionPage<any>['item'];
     /** Props to pass through to the `CollectionPage` rendering items. */
@@ -34,7 +42,9 @@ export declare class InternalAsyncListControl extends InternalEditableControl {
     getPageHref: ((itemHref: string, item: unknown) => string | null) | null;
     private __deletionConfimationCallback;
     private __cachedCardRenderer;
+    private __isFilterVisible;
     private __itemRenderer;
+    private __filter;
     renderControl(): TemplateResult;
     private get __dialog();
     private get __cardRenderer();

package/dist/elements/internal/InternalAsyncListControl/InternalAsyncListControl.js

@@ -13,12 +13,18 @@ export class InternalAsyncListControl extends InternalEditableControl {
         this.createPageHref = null;
         /** Same as the `related` property of `NucleonElement`. */
         this.related = [];
+        /** Swipe actions. */
+        this.actions = [];
+        /** Query parameters to apply to the `first` URL. */
+        this.filters = [];
         /** Limit query parameter to apply to the `first` URL. */
         this.limit = 20;
         /** URI of the first page of the hAPI collection to display. */
         this.first = null;
         /** Same as the `form` property of `FormDialog`. If set, will open a dialog on item click. */
         this.form = null;
+        /** Props to pass through to the form rendered by `FormDialog`. */
+        this.formProps = {};
         /** Same as the `item` property of `CollectionPage`. */
         this.item = null;
         /** Props to pass through to the `CollectionPage` rendering items. */
@@ -35,6 +41,7 @@ export class InternalAsyncListControl extends InternalEditableControl {
         this.getPageHref = null;
         this.__deletionConfimationCallback = null;
         this.__cachedCardRenderer = null;
+        this.__isFilterVisible = false;
         this.__itemRenderer = ctx => {
             var _a;
             if (!ctx.data)
@@ -63,11 +70,19 @@ export class InternalAsyncListControl extends InternalEditableControl {
             }
             else {
                 const handleClick = (evt) => {
-                    const button = evt.currentTarget;
-                    const dialog = this.__dialog;
-                    dialog.header = 'header_update';
-                    dialog.href = ctx.href;
-                    dialog.show(button);
+                    const clickEvent = new CustomEvent('itemclick', {
+                        cancelable: true,
+                        composed: true,
+                        bubbles: true,
+                        detail: ctx.href,
+                    });
+                    if (this.dispatchEvent(clickEvent)) {
+                        const button = evt.currentTarget;
+                        const dialog = this.__dialog;
+                        dialog.header = 'header_update';
+                        dialog.href = ctx.href;
+                        dialog.show(button);
+                    }
                 };
                 clickableItem = html `
         <button ?disabled=${isDisabled} class=${wrapperClass} @click=${handleClick}>${card}</button>
@@ -78,17 +93,48 @@ export class InternalAsyncListControl extends InternalEditableControl {
             return html `
       <foxy-swipe-actions class="block">
         ${clickableItem}
+        ${this.actions.map(action => {
+                return html `
+            <vaadin-button
+              data-testclass="action"
+              theme=${action.theme}
+              class="h-full rounded-none relative"
+              slot="action"
+              ?disabled=${this.disabled}
+              @click=${() => action.onClick(ctx.data)}
+            >
+              <foxy-i18n
+                class=${classMap({
+                    'transition-opacity': true,
+                    'opacity-0': action.state !== 'idle',
+                })}
+                infer=""
+                key=${action.text}
+              >
+              </foxy-i18n>
+              <div
+                class=${classMap({
+                    'absolute inset-0 flex items-center justify-center transition-opacity': true,
+                    'opacity-0': action.state === 'idle',
+                })}
+              >
+                <foxy-spinner layout="no-label" infer="spinner" state=${action.state}>
+                </foxy-spinner>
+              </div>
+            </vaadin-button>
+          `;
+            })}
 
         <vaadin-button
           theme="primary error"
-          class="h-full"
+          class="h-full rounded-none"
           slot="action"
           @click=${(evt) => {
                 const button = evt.currentTarget;
                 const confirm = this.renderRoot.querySelector('#confirm');
                 confirm.show(button);
                 this.__deletionConfimationCallback = () => {
-                    const cardButton = button.previousElementSibling;
+                    const cardButton = button.parentElement.firstElementChild;
                     const card = cardButton.querySelector('[href]');
                     card === null || card === void 0 ? void 0 : card.delete();
                     this.__deletionConfimationCallback = null;
@@ -100,6 +146,7 @@ export class InternalAsyncListControl extends InternalEditableControl {
       </foxy-swipe-actions>
     `;
         };
+        this.__filter = '';
     }
     static get properties() {
         return {
@@ -114,10 +161,15 @@ export class InternalAsyncListControl extends InternalEditableControl {
             first: {},
             limit: { type: Number },
             form: {},
+            formProps: { type: Object, attribute: 'form-props' },
             item: {},
             itemProps: { type: Object, attribute: 'item-props' },
             wide: { type: Boolean },
             alert: { type: Boolean },
+            actions: { type: Array },
+            filters: { type: Array },
+            __filter: { attribute: false },
+            __isFilterVisible: { attribute: false },
         };
     }
     renderControl() {
@@ -125,7 +177,9 @@ export class InternalAsyncListControl extends InternalEditableControl {
         let first;
         try {
             const url = new URL((_a = this.first) !== null && _a !== void 0 ? _a : '');
+            const filter = new URLSearchParams(this.__filter);
             url.searchParams.set('limit', String(this.limit));
+            filter.forEach((value, key) => url.searchParams.set(key, value));
             first = url.toString();
         }
         catch (_c) {
@@ -143,6 +197,7 @@ export class InternalAsyncListControl extends InternalEditableControl {
               ?keep-open-on-post=${this.keepDialogOpenOnPost}
               ?keep-open-on-delete=${this.keepDialogOpenOnDelete}
               .related=${this.related}
+              .props=${this.formProps}
               .form=${this.form}
             >
             </foxy-form-dialog>
@@ -167,10 +222,42 @@ export class InternalAsyncListControl extends InternalEditableControl {
             >
             </foxy-internal-confirm-dialog>
           `}
-      <div class="flex items-center justify-between mb-xs text-s font-medium">
+      <div class="flex gap-m items-center justify-between mb-xs text-s font-medium">
         <span class="text-secondary">
           ${this.label && this.label !== 'label' ? this.label : ''}
         </span>
+
+        ${this.filters.length > 0
+            ? html `
+              <foxy-internal-async-list-control-filter-overlay
+                .noVerticalOverlap=${true}
+                .positionTarget=${this.renderRoot.querySelector('#filters')}
+                .model=${{
+                options: this.filters,
+                value: this.__filter,
+                lang: this.lang,
+                ns: this.ns,
+            }}
+                ?opened=${this.__isFilterVisible}
+                @vaadin-overlay-close=${() => (this.__isFilterVisible = false)}
+                @search=${(evt) => {
+                var _a;
+                this.__filter = (_a = evt.detail) !== null && _a !== void 0 ? _a : '';
+            }}
+              >
+              </foxy-internal-async-list-control-filter-overlay>
+
+              <vaadin-button
+                theme="tertiary-inline contrast"
+                class="ml-auto"
+                id="filters"
+                ?disabled=${this.disabled}
+                @click=${() => (this.__isFilterVisible = !this.__isFilterVisible)}
+              >
+                <foxy-i18n infer="pagination" key="search_button_text"></foxy-i18n>
+              </vaadin-button>
+            `
+            : ''}
         ${(!this.form && !this.createPageHref) || this.readonly || this.hideCreateButton
             ? ''
             : this.createPageHref && !this.disabled

package/dist/elements/internal/InternalAsyncListControl/InternalAsyncListControl.js.map

@@ -1 +1 @@
-{"version":3,"file":"InternalAsyncListControl.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalAsyncListControl/InternalAsyncListControl.ts"],"names":[],"mappings":"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","sourcesContent":["import type { PropertyDeclarations, TemplateResult } from 'lit-element';\nimport type { CollectionPage, NucleonElement } from '../../public/index';\nimport type { InternalConfirmDialog } from '../InternalConfirmDialog';\nimport type { DialogHideEvent } from '../../private/Dialog/DialogHideEvent';\nimport type { ItemRenderer } from '../../public/CollectionPage/types';\nimport type { FormDialog } from '../../index';\n\nimport { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { classMap } from '../../../utils/class-map';\nimport { html } from 'lit-element';\n\nexport class InternalAsyncListControl extends InternalEditableControl {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      keepDialogOpenOnDelete: { type: Boolean, attribute: 'keep-dialog-open-on-delete' },\n      keepDialogOpenOnPost: { type: Boolean, attribute: 'keep-dialog-open-on-post' },\n      hideDeleteButton: { type: Boolean, attribute: 'hide-delete-button' },\n      hideCreateButton: { type: Boolean, attribute: 'hide-create-button' },\n      createPageHref: { attribute: 'create-page-href' },\n      getPageHref: { attribute: false },\n      related: { type: Array },\n      first: {},\n      limit: { type: Number },\n      form: {},\n      item: {},\n      itemProps: { type: Object, attribute: 'item-props' },\n      wide: { type: Boolean },\n      alert: { type: Boolean },\n    };\n  }\n\n  /** If true, FormDialog won't automatically close after the associated form deletes the resource. */\n  keepDialogOpenOnDelete = false;\n\n  /** If true, FormDialog won't automatically close after the associated form creates a resource. */\n  keepDialogOpenOnPost = false;\n\n  /** If provided, renders Create button as a link to this page. */\n  createPageHref: string | null = null;\n\n  /** Same as the `related` property of `NucleonElement`. */\n  related = [] as string[];\n\n  /** Limit query parameter to apply to the `first` URL. */\n  limit = 20;\n\n  /** URI of the first page of the hAPI collection to display. */\n  first: string | null = null;\n\n  /** Same as the `form` property of `FormDialog`. If set, will open a dialog on item click. */\n  form: FormDialog['form'] = null;\n\n  /** Same as the `item` property of `CollectionPage`. */\n  item: CollectionPage<any>['item'] = null;\n\n  /** Props to pass through to the `CollectionPage` rendering items. */\n  itemProps: Record<string, unknown> = {};\n\n  /** Same as the `wide` property of `FormDialog`. */\n  wide = false;\n\n  /** Same as the `alert` property of `FormDialog`. */\n  alert = false;\n\n  /** Hides Delete Swipe Action if true. */\n  hideDeleteButton = false;\n\n  /** Hides Create button if true. */\n  hideCreateButton = false;\n\n  /** If set, renders list items as <a> tags. */\n  getPageHref: ((itemHref: string, item: unknown) => string | null) | null = null;\n\n  private __deletionConfimationCallback: (() => void) | null = null;\n\n  private __cachedCardRenderer: {\n    item: InternalAsyncListControl['item'];\n    render: ItemRenderer;\n  } | null = null;\n\n  private __itemRenderer: ItemRenderer = ctx => {\n    if (!ctx.data) return this.__cardRenderer(ctx);\n\n    const href = this.getPageHref?.(ctx.href, ctx.data);\n    if (typeof href !== 'string' && !this.form) return this.__cardRenderer(ctx);\n\n    const isDisabled = this.disabledSelector.matches('card', true);\n    const card = this.__cardRenderer(ctx);\n    let clickableItem: TemplateResult;\n\n    const wrapperClass = classMap({\n      'rounded-t': !ctx.previous,\n      'rounded-b': !ctx.next,\n      'focus-outline-none focus-ring-2 focus-ring-inset focus-ring-primary-50': true,\n      'text-left w-full block transition-colors': true,\n      'hover-bg-contrast-5': !isDisabled,\n    });\n\n    if (this.getPageHref) {\n      if (isDisabled) {\n        clickableItem = html`<div class=${wrapperClass}>${card}</div>`;\n      } else {\n        const href = this.getPageHref(ctx.href, ctx.data);\n        clickableItem = html`<a class=${wrapperClass} href=${href}>${card}</a>`;\n      }\n    } else {\n      const handleClick = (evt: Event) => {\n        const button = evt.currentTarget as HTMLButtonElement;\n        const dialog = this.__dialog;\n\n        dialog.header = 'header_update';\n        dialog.href = ctx.href;\n        dialog.show(button);\n      };\n\n      clickableItem = html`\n        <button ?disabled=${isDisabled} class=${wrapperClass} @click=${handleClick}>${card}</button>\n      `;\n    }\n\n    if (this.hideDeleteButton || this.readonly) return clickableItem;\n\n    return html`\n      <foxy-swipe-actions class=\"block\">\n        ${clickableItem}\n\n        <vaadin-button\n          theme=\"primary error\"\n          class=\"h-full\"\n          slot=\"action\"\n          @click=${(evt: CustomEvent) => {\n            const button = evt.currentTarget as HTMLElement;\n            const confirm = this.renderRoot.querySelector('#confirm') as InternalConfirmDialog;\n\n            confirm.show(button);\n\n            this.__deletionConfimationCallback = () => {\n              const cardButton = button.previousElementSibling!;\n              const card = cardButton.querySelector<NucleonElement<any>>('[href]');\n\n              card?.delete();\n              this.__deletionConfimationCallback = null;\n            };\n          }}\n        >\n          <foxy-i18n infer=\"\" key=\"delete_button_text\"></foxy-i18n>\n        </vaadin-button>\n      </foxy-swipe-actions>\n    `;\n  };\n\n  renderControl(): TemplateResult {\n    let first: string | undefined;\n\n    try {\n      const url = new URL(this.first ?? '');\n      url.searchParams.set('limit', String(this.limit));\n      first = url.toString();\n    } catch {\n      first = undefined;\n    }\n\n    return html`\n      ${this.form\n        ? html`\n            <foxy-form-dialog\n              parent=${ifDefined(this.first ?? void 0)}\n              infer=\"dialog\"\n              id=\"form\"\n              ?wide=${this.wide}\n              ?alert=${this.alert}\n              ?keep-open-on-post=${this.keepDialogOpenOnPost}\n              ?keep-open-on-delete=${this.keepDialogOpenOnDelete}\n              .related=${this.related}\n              .form=${this.form as any}\n            >\n            </foxy-form-dialog>\n          `\n        : ''}\n      ${this.hideDeleteButton || this.readonly\n        ? ''\n        : html`\n            <foxy-internal-confirm-dialog\n              message=\"delete_message\"\n              confirm=\"delete_confirm\"\n              cancel=\"delete_cancel\"\n              header=\"delete_header\"\n              theme=\"error\"\n              infer=\"\"\n              id=\"confirm\"\n              @hide=${(evt: DialogHideEvent) => {\n                if (!evt.detail.cancelled) this.__deletionConfimationCallback?.();\n              }}\n            >\n            </foxy-internal-confirm-dialog>\n          `}\n      <div class=\"flex items-center justify-between mb-xs text-s font-medium\">\n        <span class=\"text-secondary\">\n          ${this.label && this.label !== 'label' ? this.label : ''}\n        </span>\n        ${(!this.form && !this.createPageHref) || this.readonly || this.hideCreateButton\n          ? ''\n          : this.createPageHref && !this.disabled\n          ? html`\n              <a\n                class=\"rounded-s text-primary group focus-outline-none focus-ring-2 focus-ring-primary-50\"\n                href=${this.createPageHref}\n              >\n                <foxy-i18n\n                  class=\"transition-opacity group-hover-opacity-80\"\n                  infer=\"\"\n                  key=\"create_button_text\"\n                >\n                </foxy-i18n>\n              </a>\n            `\n          : html`\n              <vaadin-button\n                theme=\"tertiary-inline\"\n                ?disabled=${this.disabled}\n                @click=${(evt: Event) => {\n                  evt.preventDefault();\n                  evt.stopPropagation();\n\n                  const dialog = this.__dialog;\n                  const button = evt.currentTarget as HTMLButtonElement;\n\n                  dialog.header = 'header_create';\n                  dialog.href = '';\n                  dialog.show(button);\n                }}\n              >\n                <foxy-i18n infer=\"pagination\" key=\"create_button_text\"></foxy-i18n>\n              </vaadin-button>\n            `}\n      </div>\n\n      <foxy-pagination first=${ifDefined(first)} infer=\"pagination\">\n        <foxy-collection-page\n          class=${classMap({\n            'block divide-y divide-contrast-5 rounded overflow-hidden': true,\n            'ring-1 ring-inset ring-contrast-10': !this.form && !this.getPageHref,\n            'bg-contrast-5': !!this.form || !!this.getPageHref,\n          })}\n          infer=\"card\"\n          .related=${this.related}\n          .props=${this.itemProps}\n          .item=${this.__itemRenderer as any}\n        >\n        </foxy-collection-page>\n      </foxy-pagination>\n\n      <div\n        class=${classMap({\n          'transition-colors mt-xs text-xs': true,\n          'text-secondary group-hover-text-body': !this.disabled && !this.readonly,\n          'text-disabled': this.disabled,\n        })}\n        ?hidden=${!this.helperText || this.helperText === 'helper_text'}\n      >\n        ${this.helperText}\n      </div>\n\n      <div\n        class=\"mt-xs text-xs leading-xs text-error\"\n        ?hidden=${!this._errorMessage || this.disabled || this.readonly}\n      >\n        ${this._errorMessage}\n      </div>\n    `;\n  }\n\n  private get __dialog() {\n    return this.renderRoot.querySelector('#form') as FormDialog;\n  }\n\n  private get __cardRenderer() {\n    const item = this.item;\n\n    if (this.__cachedCardRenderer?.item !== item) {\n      this.__cachedCardRenderer = {\n        item: item,\n        render:\n          typeof item === 'string'\n            ? (new Function(\n                'ctx',\n                `return ctx.html\\`\n                  <${item}\n                    related=\\${JSON.stringify(ctx.related)}\n                    parent=\\${ctx.parent}\n                    style=\"padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n                    infer=\"\"\n                    href=\\${ctx.href}\n                    ...=\\${ctx.spread(ctx.props)}\n                  >\n                  </${item}>\\``\n              ) as ItemRenderer)\n            : ctx => html`\n                <div style=\"padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\">\n                  ${item?.(ctx)}\n                </div>\n              `,\n      };\n    }\n\n    return this.__cachedCardRenderer.render;\n  }\n}\n"]}
+{"version":3,"file":"InternalAsyncListControl.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalAsyncListControl/InternalAsyncListControl.ts"],"names":[],"mappings":"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","sourcesContent":["import type { PropertyDeclarations, TemplateResult } from 'lit-element';\nimport type { CollectionPage, NucleonElement } from '../../public/index';\nimport type { InternalConfirmDialog } from '../InternalConfirmDialog';\nimport type { DialogHideEvent } from '../../private/Dialog/DialogHideEvent';\nimport type { ItemRenderer } from '../../public/CollectionPage/types';\nimport type { FormDialog } from '../../index';\nimport type { Option } from '../../public/QueryBuilder/types';\nimport type { Action } from './types';\n\nimport { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport { classMap } from '../../../utils/class-map';\nimport { html } from 'lit-element';\n\nexport class InternalAsyncListControl extends InternalEditableControl {\n  static get properties(): PropertyDeclarations {\n    return {\n      ...super.properties,\n      keepDialogOpenOnDelete: { type: Boolean, attribute: 'keep-dialog-open-on-delete' },\n      keepDialogOpenOnPost: { type: Boolean, attribute: 'keep-dialog-open-on-post' },\n      hideDeleteButton: { type: Boolean, attribute: 'hide-delete-button' },\n      hideCreateButton: { type: Boolean, attribute: 'hide-create-button' },\n      createPageHref: { attribute: 'create-page-href' },\n      getPageHref: { attribute: false },\n      related: { type: Array },\n      first: {},\n      limit: { type: Number },\n      form: {},\n      formProps: { type: Object, attribute: 'form-props' },\n      item: {},\n      itemProps: { type: Object, attribute: 'item-props' },\n      wide: { type: Boolean },\n      alert: { type: Boolean },\n      actions: { type: Array },\n      filters: { type: Array },\n      __filter: { attribute: false },\n      __isFilterVisible: { attribute: false },\n    };\n  }\n\n  /** If true, FormDialog won't automatically close after the associated form deletes the resource. */\n  keepDialogOpenOnDelete = false;\n\n  /** If true, FormDialog won't automatically close after the associated form creates a resource. */\n  keepDialogOpenOnPost = false;\n\n  /** If provided, renders Create button as a link to this page. */\n  createPageHref: string | null = null;\n\n  /** Same as the `related` property of `NucleonElement`. */\n  related = [] as string[];\n\n  /** Swipe actions. */\n  actions = [] as Action[];\n\n  /** Query parameters to apply to the `first` URL. */\n  filters = [] as Option[];\n\n  /** Limit query parameter to apply to the `first` URL. */\n  limit = 20;\n\n  /** URI of the first page of the hAPI collection to display. */\n  first: string | null = null;\n\n  /** Same as the `form` property of `FormDialog`. If set, will open a dialog on item click. */\n  form: FormDialog['form'] = null;\n\n  /** Props to pass through to the form rendered by `FormDialog`. */\n  formProps: Record<string, unknown> = {};\n\n  /** Same as the `item` property of `CollectionPage`. */\n  item: CollectionPage<any>['item'] = null;\n\n  /** Props to pass through to the `CollectionPage` rendering items. */\n  itemProps: Record<string, unknown> = {};\n\n  /** Same as the `wide` property of `FormDialog`. */\n  wide = false;\n\n  /** Same as the `alert` property of `FormDialog`. */\n  alert = false;\n\n  /** Hides Delete Swipe Action if true. */\n  hideDeleteButton = false;\n\n  /** Hides Create button if true. */\n  hideCreateButton = false;\n\n  /** If set, renders list items as <a> tags. */\n  getPageHref: ((itemHref: string, item: unknown) => string | null) | null = null;\n\n  private __deletionConfimationCallback: (() => void) | null = null;\n\n  private __cachedCardRenderer: {\n    item: InternalAsyncListControl['item'];\n    render: ItemRenderer;\n  } | null = null;\n\n  private __isFilterVisible = false;\n\n  private __itemRenderer: ItemRenderer = ctx => {\n    if (!ctx.data) return this.__cardRenderer(ctx);\n\n    const href = this.getPageHref?.(ctx.href, ctx.data);\n    if (typeof href !== 'string' && !this.form) return this.__cardRenderer(ctx);\n\n    const isDisabled = this.disabledSelector.matches('card', true);\n    const card = this.__cardRenderer(ctx);\n    let clickableItem: TemplateResult;\n\n    const wrapperClass = classMap({\n      'rounded-t': !ctx.previous,\n      'rounded-b': !ctx.next,\n      'focus-outline-none focus-ring-2 focus-ring-inset focus-ring-primary-50': true,\n      'text-left w-full block transition-colors': true,\n      'hover-bg-contrast-5': !isDisabled,\n    });\n\n    if (this.getPageHref) {\n      if (isDisabled) {\n        clickableItem = html`<div class=${wrapperClass}>${card}</div>`;\n      } else {\n        const href = this.getPageHref(ctx.href, ctx.data);\n        clickableItem = html`<a class=${wrapperClass} href=${href}>${card}</a>`;\n      }\n    } else {\n      const handleClick = (evt: Event) => {\n        const clickEvent = new CustomEvent<string>('itemclick', {\n          cancelable: true,\n          composed: true,\n          bubbles: true,\n          detail: ctx.href,\n        });\n\n        if (this.dispatchEvent(clickEvent)) {\n          const button = evt.currentTarget as HTMLButtonElement;\n          const dialog = this.__dialog;\n\n          dialog.header = 'header_update';\n          dialog.href = ctx.href;\n          dialog.show(button);\n        }\n      };\n\n      clickableItem = html`\n        <button ?disabled=${isDisabled} class=${wrapperClass} @click=${handleClick}>${card}</button>\n      `;\n    }\n\n    if (this.hideDeleteButton || this.readonly) return clickableItem;\n\n    return html`\n      <foxy-swipe-actions class=\"block\">\n        ${clickableItem}\n        ${this.actions.map(action => {\n          return html`\n            <vaadin-button\n              data-testclass=\"action\"\n              theme=${action.theme}\n              class=\"h-full rounded-none relative\"\n              slot=\"action\"\n              ?disabled=${this.disabled}\n              @click=${() => action.onClick(ctx.data!)}\n            >\n              <foxy-i18n\n                class=${classMap({\n                  'transition-opacity': true,\n                  'opacity-0': action.state !== 'idle',\n                })}\n                infer=\"\"\n                key=${action.text}\n              >\n              </foxy-i18n>\n              <div\n                class=${classMap({\n                  'absolute inset-0 flex items-center justify-center transition-opacity': true,\n                  'opacity-0': action.state === 'idle',\n                })}\n              >\n                <foxy-spinner layout=\"no-label\" infer=\"spinner\" state=${action.state}>\n                </foxy-spinner>\n              </div>\n            </vaadin-button>\n          `;\n        })}\n\n        <vaadin-button\n          theme=\"primary error\"\n          class=\"h-full rounded-none\"\n          slot=\"action\"\n          @click=${(evt: CustomEvent) => {\n            const button = evt.currentTarget as HTMLElement;\n            const confirm = this.renderRoot.querySelector('#confirm') as InternalConfirmDialog;\n\n            confirm.show(button);\n\n            this.__deletionConfimationCallback = () => {\n              const cardButton = button.parentElement!.firstElementChild!;\n              const card = cardButton.querySelector<NucleonElement<any>>('[href]');\n\n              card?.delete();\n              this.__deletionConfimationCallback = null;\n            };\n          }}\n        >\n          <foxy-i18n infer=\"\" key=\"delete_button_text\"></foxy-i18n>\n        </vaadin-button>\n      </foxy-swipe-actions>\n    `;\n  };\n\n  private __filter = '';\n\n  renderControl(): TemplateResult {\n    let first: string | undefined;\n\n    try {\n      const url = new URL(this.first ?? '');\n      const filter = new URLSearchParams(this.__filter);\n\n      url.searchParams.set('limit', String(this.limit));\n      filter.forEach((value, key) => url.searchParams.set(key, value));\n      first = url.toString();\n    } catch {\n      first = undefined;\n    }\n\n    return html`\n      ${this.form\n        ? html`\n            <foxy-form-dialog\n              parent=${ifDefined(this.first ?? void 0)}\n              infer=\"dialog\"\n              id=\"form\"\n              ?wide=${this.wide}\n              ?alert=${this.alert}\n              ?keep-open-on-post=${this.keepDialogOpenOnPost}\n              ?keep-open-on-delete=${this.keepDialogOpenOnDelete}\n              .related=${this.related}\n              .props=${this.formProps}\n              .form=${this.form as any}\n            >\n            </foxy-form-dialog>\n          `\n        : ''}\n      ${this.hideDeleteButton || this.readonly\n        ? ''\n        : html`\n            <foxy-internal-confirm-dialog\n              message=\"delete_message\"\n              confirm=\"delete_confirm\"\n              cancel=\"delete_cancel\"\n              header=\"delete_header\"\n              theme=\"error\"\n              infer=\"\"\n              id=\"confirm\"\n              @hide=${(evt: DialogHideEvent) => {\n                if (!evt.detail.cancelled) this.__deletionConfimationCallback?.();\n              }}\n            >\n            </foxy-internal-confirm-dialog>\n          `}\n      <div class=\"flex gap-m items-center justify-between mb-xs text-s font-medium\">\n        <span class=\"text-secondary\">\n          ${this.label && this.label !== 'label' ? this.label : ''}\n        </span>\n\n        ${this.filters.length > 0\n          ? html`\n              <foxy-internal-async-list-control-filter-overlay\n                .noVerticalOverlap=${true}\n                .positionTarget=${this.renderRoot.querySelector('#filters')}\n                .model=${{\n                  options: this.filters,\n                  value: this.__filter,\n                  lang: this.lang,\n                  ns: this.ns,\n                }}\n                ?opened=${this.__isFilterVisible}\n                @vaadin-overlay-close=${() => (this.__isFilterVisible = false)}\n                @search=${(evt: CustomEvent<string | undefined>) => {\n                  this.__filter = evt.detail ?? '';\n                }}\n              >\n              </foxy-internal-async-list-control-filter-overlay>\n\n              <vaadin-button\n                theme=\"tertiary-inline contrast\"\n                class=\"ml-auto\"\n                id=\"filters\"\n                ?disabled=${this.disabled}\n                @click=${() => (this.__isFilterVisible = !this.__isFilterVisible)}\n              >\n                <foxy-i18n infer=\"pagination\" key=\"search_button_text\"></foxy-i18n>\n              </vaadin-button>\n            `\n          : ''}\n        ${(!this.form && !this.createPageHref) || this.readonly || this.hideCreateButton\n          ? ''\n          : this.createPageHref && !this.disabled\n          ? html`\n              <a\n                class=\"rounded-s text-primary group focus-outline-none focus-ring-2 focus-ring-primary-50\"\n                href=${this.createPageHref}\n              >\n                <foxy-i18n\n                  class=\"transition-opacity group-hover-opacity-80\"\n                  infer=\"\"\n                  key=\"create_button_text\"\n                >\n                </foxy-i18n>\n              </a>\n            `\n          : html`\n              <vaadin-button\n                theme=\"tertiary-inline\"\n                ?disabled=${this.disabled}\n                @click=${(evt: Event) => {\n                  evt.preventDefault();\n                  evt.stopPropagation();\n\n                  const dialog = this.__dialog;\n                  const button = evt.currentTarget as HTMLButtonElement;\n\n                  dialog.header = 'header_create';\n                  dialog.href = '';\n                  dialog.show(button);\n                }}\n              >\n                <foxy-i18n infer=\"pagination\" key=\"create_button_text\"></foxy-i18n>\n              </vaadin-button>\n            `}\n      </div>\n\n      <foxy-pagination first=${ifDefined(first)} infer=\"pagination\">\n        <foxy-collection-page\n          class=${classMap({\n            'block divide-y divide-contrast-5 rounded overflow-hidden': true,\n            'ring-1 ring-inset ring-contrast-10': !this.form && !this.getPageHref,\n            'bg-contrast-5': !!this.form || !!this.getPageHref,\n          })}\n          infer=\"card\"\n          .related=${this.related}\n          .props=${this.itemProps}\n          .item=${this.__itemRenderer as any}\n        >\n        </foxy-collection-page>\n      </foxy-pagination>\n\n      <div\n        class=${classMap({\n          'transition-colors mt-xs text-xs': true,\n          'text-secondary group-hover-text-body': !this.disabled && !this.readonly,\n          'text-disabled': this.disabled,\n        })}\n        ?hidden=${!this.helperText || this.helperText === 'helper_text'}\n      >\n        ${this.helperText}\n      </div>\n\n      <div\n        class=\"mt-xs text-xs leading-xs text-error\"\n        ?hidden=${!this._errorMessage || this.disabled || this.readonly}\n      >\n        ${this._errorMessage}\n      </div>\n    `;\n  }\n\n  private get __dialog() {\n    return this.renderRoot.querySelector('#form') as FormDialog;\n  }\n\n  private get __cardRenderer() {\n    const item = this.item;\n\n    if (this.__cachedCardRenderer?.item !== item) {\n      this.__cachedCardRenderer = {\n        item: item,\n        render:\n          typeof item === 'string'\n            ? (new Function(\n                'ctx',\n                `return ctx.html\\`\n                  <${item}\n                    related=\\${JSON.stringify(ctx.related)}\n                    parent=\\${ctx.parent}\n                    style=\"padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\"\n                    infer=\"\"\n                    href=\\${ctx.href}\n                    ...=\\${ctx.spread(ctx.props)}\n                  >\n                  </${item}>\\``\n              ) as ItemRenderer)\n            : ctx => html`\n                <div style=\"padding: calc(0.625em + (var(--lumo-border-radius) / 4) - 1px)\">\n                  ${item?.(ctx)}\n                </div>\n              `,\n      };\n    }\n\n    return this.__cachedCardRenderer.render;\n  }\n}\n"]}

package/dist/elements/internal/InternalAsyncListControl/InternalAsyncListControlFilterOverlay.d.ts

@@ -0,0 +1,11 @@
+import type { Constructor } from 'lit-element';
+import { OverlayElement } from '@vaadin/vaadin-overlay/src/vaadin-overlay';
+declare class PositionMixinHost {
+    positionTarget: HTMLElement | null;
+}
+declare const InternalAsyncListControlFilterOverlay_base: Constructor<OverlayElement> & Constructor<PositionMixinHost>;
+export declare class InternalAsyncListControlFilterOverlay extends InternalAsyncListControlFilterOverlay_base {
+    static get is(): string;
+    renderer: (root: HTMLElement, _: unknown, model: unknown) => void;
+}
+export {};

package/dist/elements/internal/InternalAsyncListControl/InternalAsyncListControlFilterOverlay.js

@@ -0,0 +1,57 @@
+import { _PositionMixin } from '@vaadin/vaadin-overlay/src/vaadin-overlay-position-mixin';
+import { OverlayElement } from '@vaadin/vaadin-overlay/src/vaadin-overlay';
+import { html, render } from 'lit-html';
+const PositionMixin = _PositionMixin;
+export class InternalAsyncListControlFilterOverlay extends PositionMixin(OverlayElement) {
+    constructor() {
+        super(...arguments);
+        this.renderer = (root, _, model) => {
+            var _a;
+            const litRoot = (_a = root.firstElementChild) !== null && _a !== void 0 ? _a : document.createElement('div');
+            if (!root.firstElementChild)
+                root.appendChild(litRoot);
+            const m = model;
+            const result = html `
+      <div
+        style="display: grid; gap: var(--lumo-space-m); padding: var(--lumo-space-s); width: 22rem"
+      >
+        <foxy-query-builder
+          lang=${m.lang}
+          ns=${`${m.ns} query-builder`.trim()}
+          .options=${m.options}
+          .value=${m.value}
+        >
+        </foxy-query-builder>
+
+        <div style="display: flex; justify-content: space-between">
+          <vaadin-button
+            theme="primary"
+            style="margin: 0"
+            @click=${() => {
+                var _a;
+                const queryBuilder = litRoot.querySelector('foxy-query-builder');
+                const detail = (_a = queryBuilder.value) !== null && _a !== void 0 ? _a : '';
+                this.dispatchEvent(new CustomEvent('search', { detail }));
+            }}
+          >
+            <foxy-i18n lang=${m.lang} ns=${m.ns} key="search"></foxy-i18n>
+          </vaadin-button>
+
+          <vaadin-button
+            theme="secondary contrast"
+            style="margin: 0"
+            @click=${() => this.dispatchEvent(new CustomEvent('search'))}
+          >
+            <foxy-i18n lang=${m.lang} ns=${m.ns} key="clear"></foxy-i18n>
+          </vaadin-button>
+        </div>
+      </div>
+    `;
+            render(result, litRoot);
+        };
+    }
+    static get is() {
+        return 'foxy-internal-async-list-control-filter-overlay';
+    }
+}
+//# sourceMappingURL=InternalAsyncListControlFilterOverlay.js.map

package/dist/elements/internal/InternalAsyncListControl/InternalAsyncListControlFilterOverlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InternalAsyncListControlFilterOverlay.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalAsyncListControl/InternalAsyncListControlFilterOverlay.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAE,MAAM,0DAA0D,CAAC;AAC1F,OAAO,EAAE,cAAc,EAAE,MAAM,2CAA2C,CAAC;AAC3E,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAOxC,MAAM,aAAa,GAAG,cAE2C,CAAC;AAElE,MAAM,OAAO,qCAAsC,SAAQ,aAAa,CAAC,cAAc,CAAC;IAAxF;;QAKE,aAAQ,GAAG,CAAC,IAAiB,EAAE,CAAU,EAAE,KAAc,EAAQ,EAAE;;YACjE,MAAM,OAAO,SAAG,IAAI,CAAC,iBAAiB,mCAAI,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;YACxE,IAAI,CAAC,IAAI,CAAC,iBAAiB;gBAAE,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;YAEvD,MAAM,CAAC,GAAG,KAAuE,CAAC;YAElF,MAAM,MAAM,GAAG,IAAI,CAAA;;;;;iBAKN,CAAC,CAAC,IAAI;eACR,GAAG,CAAC,CAAC,EAAE,gBAAgB,CAAC,IAAI,EAAE;qBACxB,CAAC,CAAC,OAAO;mBACX,CAAC,CAAC,KAAK;;;;;;;;qBAQL,GAAG,EAAE;;gBACZ,MAAM,YAAY,GAAG,OAAO,CAAC,aAAa,CAAC,oBAAoB,CAAiB,CAAC;gBACjF,MAAM,MAAM,SAAG,YAAY,CAAC,KAAK,mCAAI,EAAE,CAAC;gBACxC,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,QAAQ,EAAE,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC;YAC5D,CAAC;;8BAEiB,CAAC,CAAC,IAAI,OAAO,CAAC,CAAC,EAAE;;;;;;qBAM1B,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,QAAQ,CAAC,CAAC;;8BAE1C,CAAC,CAAC,IAAI,OAAO,CAAC,CAAC,EAAE;;;;KAI1C,CAAC;YAEF,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QAC1B,CAAC,CAAC;IACJ,CAAC;IAhDC,MAAM,KAAK,EAAE;QACX,OAAO,iDAAiD,CAAC;IAC3D,CAAC;CA8CF","sourcesContent":["import type { Constructor } from 'lit-element';\nimport type { Option } from '../../public/QueryBuilder/types';\n\nimport { _PositionMixin } from '@vaadin/vaadin-overlay/src/vaadin-overlay-position-mixin';\nimport { OverlayElement } from '@vaadin/vaadin-overlay/src/vaadin-overlay';\nimport { html, render } from 'lit-html';\nimport { QueryBuilder } from '../../public';\n\ndeclare class PositionMixinHost {\n  positionTarget: HTMLElement | null;\n}\n\nconst PositionMixin = _PositionMixin as (\n  superClass: Constructor<OverlayElement>\n) => Constructor<OverlayElement> & Constructor<PositionMixinHost>;\n\nexport class InternalAsyncListControlFilterOverlay extends PositionMixin(OverlayElement) {\n  static get is(): string {\n    return 'foxy-internal-async-list-control-filter-overlay';\n  }\n\n  renderer = (root: HTMLElement, _: unknown, model: unknown): void => {\n    const litRoot = root.firstElementChild ?? document.createElement('div');\n    if (!root.firstElementChild) root.appendChild(litRoot);\n\n    const m = model as { options: Option[]; value: string; lang: string; ns: string };\n\n    const result = html`\n      <div\n        style=\"display: grid; gap: var(--lumo-space-m); padding: var(--lumo-space-s); width: 22rem\"\n      >\n        <foxy-query-builder\n          lang=${m.lang}\n          ns=${`${m.ns} query-builder`.trim()}\n          .options=${m.options}\n          .value=${m.value}\n        >\n        </foxy-query-builder>\n\n        <div style=\"display: flex; justify-content: space-between\">\n          <vaadin-button\n            theme=\"primary\"\n            style=\"margin: 0\"\n            @click=${() => {\n              const queryBuilder = litRoot.querySelector('foxy-query-builder') as QueryBuilder;\n              const detail = queryBuilder.value ?? '';\n              this.dispatchEvent(new CustomEvent('search', { detail }));\n            }}\n          >\n            <foxy-i18n lang=${m.lang} ns=${m.ns} key=\"search\"></foxy-i18n>\n          </vaadin-button>\n\n          <vaadin-button\n            theme=\"secondary contrast\"\n            style=\"margin: 0\"\n            @click=${() => this.dispatchEvent(new CustomEvent('search'))}\n          >\n            <foxy-i18n lang=${m.lang} ns=${m.ns} key=\"clear\"></foxy-i18n>\n          </vaadin-button>\n        </div>\n      </div>\n    `;\n\n    render(result, litRoot);\n  };\n}\n"]}

package/dist/elements/internal/InternalAsyncListControl/index.d.ts

@@ -1,3 +1,4 @@
+import '@vaadin/vaadin-overlay';
 import '@vaadin/vaadin-button';
 import '../../public/CollectionPage/index';
 import '../../public/SwipeActions/index';

package/dist/elements/internal/InternalAsyncListControl/index.js

@@ -1,3 +1,4 @@
+import '@vaadin/vaadin-overlay';
 import '@vaadin/vaadin-button';
 import "../../public/CollectionPage/index.js";
 import "../../public/SwipeActions/index.js";
@@ -6,7 +7,9 @@ import "../../public/Pagination/index.js";
 import "../../public/I18n/index.js";
 import "../InternalEditableControl/index.js";
 import "../InternalConfirmDialog/index.js";
+import { InternalAsyncListControlFilterOverlay as Overlay } from "./InternalAsyncListControlFilterOverlay.js";
 import { InternalAsyncListControl as Control } from "./InternalAsyncListControl.js";
 customElements.define('foxy-internal-async-list-control', Control);
+customElements.define(Overlay.is, Overlay);
 export { Control as InternalAsyncListControl };
 //# sourceMappingURL=index.js.map

package/dist/elements/internal/InternalAsyncListControl/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalAsyncListControl/index.ts"],"names":[],"mappings":"AAAA,OAAO,uBAAuB,CAAC;AAE/B,8CAA2C;AAC3C,4CAAyC;AACzC,0CAAuC;AACvC,0CAAuC;AACvC,oCAAiC;AAEjC,6CAA0C;AAC1C,2CAAwC;AAExC,OAAO,EAAE,wBAAwB,IAAI,OAAO,EAAE,sCAAmC;AAEjF,cAAc,CAAC,MAAM,CAAC,kCAAkC,EAAE,OAAO,CAAC,CAAC;AAEnE,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,CAAC","sourcesContent":["import '@vaadin/vaadin-button';\n\nimport '../../public/CollectionPage/index';\nimport '../../public/SwipeActions/index';\nimport '../../public/FormDialog/index';\nimport '../../public/Pagination/index';\nimport '../../public/I18n/index';\n\nimport '../InternalEditableControl/index';\nimport '../InternalConfirmDialog/index';\n\nimport { InternalAsyncListControl as Control } from './InternalAsyncListControl';\n\ncustomElements.define('foxy-internal-async-list-control', Control);\n\nexport { Control as InternalAsyncListControl };\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalAsyncListControl/index.ts"],"names":[],"mappings":"AAAA,OAAO,wBAAwB,CAAC;AAChC,OAAO,uBAAuB,CAAC;AAE/B,8CAA2C;AAC3C,4CAAyC;AACzC,0CAAuC;AACvC,0CAAuC;AACvC,oCAAiC;AAEjC,6CAA0C;AAC1C,2CAAwC;AAExC,OAAO,EAAE,qCAAqC,IAAI,OAAO,EAAE,mDAAgD;AAC3G,OAAO,EAAE,wBAAwB,IAAI,OAAO,EAAE,sCAAmC;AAEjF,cAAc,CAAC,MAAM,CAAC,kCAAkC,EAAE,OAAO,CAAC,CAAC;AACnE,cAAc,CAAC,MAAM,CAAC,OAAO,CAAC,EAAE,EAAE,OAAO,CAAC,CAAC;AAE3C,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,CAAC","sourcesContent":["import '@vaadin/vaadin-overlay';\nimport '@vaadin/vaadin-button';\n\nimport '../../public/CollectionPage/index';\nimport '../../public/SwipeActions/index';\nimport '../../public/FormDialog/index';\nimport '../../public/Pagination/index';\nimport '../../public/I18n/index';\n\nimport '../InternalEditableControl/index';\nimport '../InternalConfirmDialog/index';\n\nimport { InternalAsyncListControlFilterOverlay as Overlay } from './InternalAsyncListControlFilterOverlay';\nimport { InternalAsyncListControl as Control } from './InternalAsyncListControl';\n\ncustomElements.define('foxy-internal-async-list-control', Control);\ncustomElements.define(Overlay.is, Overlay);\n\nexport { Control as InternalAsyncListControl };\n"]}

package/dist/elements/internal/InternalAsyncListControl/types.d.ts

@@ -0,0 +1,8 @@
+import type { HALJSONResource } from '../../public/NucleonElement/types';
+import type { SpinnerState } from '../../public/Spinner/Spinner';
+export declare type Action<TData = HALJSONResource> = {
+    theme: string;
+    state: 'idle' | SpinnerState;
+    text: string;
+    onClick: (data: TData) => unknown;
+};

package/dist/elements/internal/InternalAsyncListControl/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/elements/internal/InternalAsyncListControl/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/elements/internal/InternalAsyncListControl/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { HALJSONResource } from '../../public/NucleonElement/types';\nimport type { SpinnerState } from '../../public/Spinner/Spinner';\n\nexport type Action<TData = HALJSONResource> = {\n  theme: string;\n  state: 'idle' | SpinnerState;\n  text: string;\n  onClick: (data: TData) => unknown;\n};\n"]}

package/dist/elements/internal/InternalAsyncResourceLinkListControl/InternalAsyncResourceLinkListControl.d.ts

@@ -0,0 +1,23 @@
+import type { CSSResultArray, PropertyDeclarations } from 'lit-element';
+import type { TemplateResult } from 'lit-html';
+import { InternalEditableControl } from '../InternalEditableControl/InternalEditableControl';
+export declare class InternalAsyncResourceLinkListControl extends InternalEditableControl {
+    static get properties(): PropertyDeclarations;
+    static get styles(): CSSResultArray;
+    foreignKeyForUri: string | null;
+    foreignKeyForId: string | null;
+    ownKeyForUri: string | null;
+    optionsHref: string | null;
+    linksHref: string | null;
+    embedKey: string | null;
+    ownUri: string | null;
+    limit: number;
+    item: string | null;
+    private readonly __getItemRenderer;
+    private readonly __renderItem;
+    private __isFetching;
+    renderControl(): TemplateResult;
+    updated(changes: Map<keyof this, unknown>): void;
+    private __insertLink;
+    private __deleteLink;
+}