@timlassiter11/yatl-ui 1.0.0 → 1.0.1

package/dist/index.d.mts

@@ -3,7 +3,7 @@ import * as lit from 'lit';
 import { LitElement, PropertyValues, nothing, ComplexAttributeConverter, ReactiveController, ReactiveControllerHost } from 'lit';
 export { html, noChange, nothing, svg } from 'lit';
 import * as _timlassiter11_yatl from '@timlassiter11/yatl';
-import { UnspecifiedRecord, YatlTable, YatlTableController, DisplayColumnOptions } from '@timlassiter11/yatl';
+import { UnspecifiedRecord, YatlTable, YatlTableController, DisplayColumnOptions, YatlEvent, NestedKeyOf } from '@timlassiter11/yatl';
 export { unsafeHTML } from 'lit/directives/unsafe-html.js';
 
 declare class YatlBase extends LitElement {
@@ -257,8 +257,8 @@ declare class YatlToolbar<T extends object = UnspecifiedRecord> extends YatlBase
     protected render(): lit_html.TemplateResult<1>;
     protected renderColumnPicker(): lit_html.TemplateResult<1>;
     protected renderColumnVisibilityToggle(column: DisplayColumnOptions<T>): lit_html.TemplateResult<1>;
-    private handleDropdownSelect;
     protected renderExportButton(): lit_html.TemplateResult<1>;
+    private handleDropdownSelect;
     private onSearchInput;
     private onSearchChange;
     private onExportClick;
@@ -710,6 +710,120 @@ declare global {
     }
 }
 
+declare const tableContext: {
+    __context__: YatlTableController<_timlassiter11_yatl.UnspecifiedRecord>;
+};
+
+declare class YatlDialogShowRequest extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-dialog-show-request";
+    constructor();
+    clone(): YatlDialogShowRequest;
+}
+declare class YatlDialogShowEvent extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-dialog-show";
+    constructor();
+    clone(): YatlDialogShowEvent;
+}
+declare class YatlDialogHideRequest extends YatlEvent {
+    readonly source: HTMLElement;
+    static readonly EVENT_NAME = "yatl-dialog-hide-request";
+    constructor(source: HTMLElement);
+    clone(): YatlDialogHideRequest;
+}
+declare class YatlDialogHideEvent extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-dialog-hide";
+    constructor();
+    clone(): YatlDialogHideEvent;
+}
+declare global {
+    interface HTMLElementEventMap {
+        [YatlDialogShowRequest.EVENT_NAME]: YatlDialogShowRequest;
+        [YatlDialogShowEvent.EVENT_NAME]: YatlDialogShowEvent;
+        [YatlDialogHideRequest.EVENT_NAME]: YatlDialogHideRequest;
+        [YatlDialogHideEvent.EVENT_NAME]: YatlDialogHideEvent;
+    }
+}
+
+declare class YatlDropdownOpenRequest extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-dropdown-open-request";
+    constructor();
+    clone(): YatlDropdownOpenRequest;
+}
+declare class YatlDropdownOpenEvent extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-dropdown-open";
+    constructor();
+    clone(): YatlDropdownOpenEvent;
+}
+declare class YatlDropdownCloseRequest extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-dropdown-close-request";
+    constructor();
+    clone(): YatlDropdownCloseRequest;
+}
+declare class YatlDropdownCloseEvent extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-dropdown-close";
+    constructor();
+    clone(): YatlDropdownCloseEvent;
+}
+declare class YatlDropdownSelectEvent extends YatlEvent {
+    readonly item: YatlOption;
+    static readonly EVENT_NAME = "yatl-dropdown-select";
+    constructor(item: YatlOption);
+    clone(): YatlDropdownSelectEvent;
+}
+declare global {
+    interface HTMLElementEventMap {
+        [YatlDropdownOpenRequest.EVENT_NAME]: YatlDropdownOpenRequest;
+        [YatlDropdownOpenEvent.EVENT_NAME]: YatlDropdownOpenEvent;
+        [YatlDropdownCloseRequest.EVENT_NAME]: YatlDropdownCloseEvent;
+        [YatlDropdownCloseEvent.EVENT_NAME]: YatlDropdownCloseEvent;
+        [YatlDropdownSelectEvent.EVENT_NAME]: YatlDropdownSelectEvent;
+    }
+}
+
+declare class YatlToolbarSearchInput extends YatlEvent {
+    readonly value: string;
+    static readonly EVENT_NAME = "yatl-toolbar-search-input";
+    constructor(value: string);
+    clone(): YatlToolbarSearchInput;
+}
+declare class YatlToolbarSearchChange extends YatlEvent {
+    readonly value: string;
+    static readonly EVENT_NAME = "yatl-toolbar-search-change";
+    constructor(value: string);
+    clone(): YatlToolbarSearchChange;
+}
+declare class YatlToolbarExportClick extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-toolbar-export-click";
+    constructor();
+    clone(): YatlToolbarExportClick;
+}
+declare class YatlColumnToggleRequest<T extends object = UnspecifiedRecord> extends YatlEvent {
+    readonly field: NestedKeyOf<T>;
+    readonly visibility: boolean;
+    static readonly EVENT_NAME = "yatl-column-toggle-request";
+    constructor(field: NestedKeyOf<T>, visibility: boolean);
+    clone(): YatlColumnToggleRequest<T>;
+}
+declare global {
+    interface HTMLElementEventMap {
+        [YatlToolbarSearchInput.EVENT_NAME]: YatlToolbarSearchInput;
+        [YatlToolbarSearchChange.EVENT_NAME]: YatlToolbarSearchChange;
+        [YatlToolbarExportClick.EVENT_NAME]: YatlToolbarExportClick;
+        [YatlColumnToggleRequest.EVENT_NAME]: YatlColumnToggleRequest;
+    }
+}
+
+declare class YatlTagDismissEvent extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-tag-dismiss";
+    constructor();
+    clone(): YatlTagDismissEvent;
+}
+declare global {
+    interface HTMLElementEventMap {
+        [YatlTagDismissEvent.EVENT_NAME]: YatlTagDismissEvent;
+    }
+}
+
 /**
  * Retrieves the flattened list of elements assigned to a slot.
  *
@@ -765,4 +879,4 @@ declare class HasSlotController implements ReactiveController {
  */
 declare function getInnerHTML(nodes: Iterable<Node>, callback?: (node: Node) => string | undefined): string;
 
-export { type FormControl, HasSlotController, YatlBaseFilter, YatlButton, type YatlButtonColor, YatlButtonGroup, type YatlButtonVariant, YatlCard, YatlCheckbox, YatlConfirmationDialog, YatlDateFilter, YatlDateInput, YatlDialog, YatlDropdown, YatlFormControl, YatlIcon, YatlInput, type YatlInputType, YatlNumberInput, YatlOption, YatlRadio, YatlRadioGroup, YatlSearchFilter, YatlSearchSelect, YatlSelect, YatlSelectFilter, YatlSwitch, YatlTableUi, YatlTableView, YatlTag, YatlToolbar, YatlTypeahead, activeElements, animateWithClass, dateConverter, getEffectiveChildren, getInnerHTML };
+export { type FormControl, HasSlotController, YatlBaseFilter, YatlButton, type YatlButtonColor, YatlButtonGroup, type YatlButtonVariant, YatlCard, YatlCheckbox, YatlColumnToggleRequest, YatlConfirmationDialog, YatlDateFilter, YatlDateInput, YatlDialog, YatlDialogHideEvent, YatlDialogHideRequest, YatlDialogShowEvent, YatlDialogShowRequest, YatlDropdown, YatlDropdownCloseEvent, YatlDropdownCloseRequest, YatlDropdownOpenEvent, YatlDropdownOpenRequest, YatlDropdownSelectEvent, YatlFormControl, YatlIcon, YatlInput, type YatlInputType, YatlNumberInput, YatlOption, YatlRadio, YatlRadioGroup, YatlSearchFilter, YatlSearchSelect, YatlSelect, YatlSelectFilter, YatlSwitch, YatlTableUi, YatlTableView, YatlTag, YatlTagDismissEvent, YatlToolbar, YatlToolbarExportClick, YatlToolbarSearchChange, YatlToolbarSearchInput, YatlTypeahead, activeElements, animateWithClass, dateConverter, getEffectiveChildren, getInnerHTML, tableContext };

package/dist/index.d.ts

@@ -3,7 +3,7 @@ import * as lit from 'lit';
 import { LitElement, PropertyValues, nothing, ComplexAttributeConverter, ReactiveController, ReactiveControllerHost } from 'lit';
 export { html, noChange, nothing, svg } from 'lit';
 import * as _timlassiter11_yatl from '@timlassiter11/yatl';
-import { UnspecifiedRecord, YatlTable, YatlTableController, DisplayColumnOptions } from '@timlassiter11/yatl';
+import { UnspecifiedRecord, YatlTable, YatlTableController, DisplayColumnOptions, YatlEvent, NestedKeyOf } from '@timlassiter11/yatl';
 export { unsafeHTML } from 'lit/directives/unsafe-html.js';
 
 declare class YatlBase extends LitElement {
@@ -257,8 +257,8 @@ declare class YatlToolbar<T extends object = UnspecifiedRecord> extends YatlBase
     protected render(): lit_html.TemplateResult<1>;
     protected renderColumnPicker(): lit_html.TemplateResult<1>;
     protected renderColumnVisibilityToggle(column: DisplayColumnOptions<T>): lit_html.TemplateResult<1>;
-    private handleDropdownSelect;
     protected renderExportButton(): lit_html.TemplateResult<1>;
+    private handleDropdownSelect;
     private onSearchInput;
     private onSearchChange;
     private onExportClick;
@@ -710,6 +710,120 @@ declare global {
     }
 }
 
+declare const tableContext: {
+    __context__: YatlTableController<_timlassiter11_yatl.UnspecifiedRecord>;
+};
+
+declare class YatlDialogShowRequest extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-dialog-show-request";
+    constructor();
+    clone(): YatlDialogShowRequest;
+}
+declare class YatlDialogShowEvent extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-dialog-show";
+    constructor();
+    clone(): YatlDialogShowEvent;
+}
+declare class YatlDialogHideRequest extends YatlEvent {
+    readonly source: HTMLElement;
+    static readonly EVENT_NAME = "yatl-dialog-hide-request";
+    constructor(source: HTMLElement);
+    clone(): YatlDialogHideRequest;
+}
+declare class YatlDialogHideEvent extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-dialog-hide";
+    constructor();
+    clone(): YatlDialogHideEvent;
+}
+declare global {
+    interface HTMLElementEventMap {
+        [YatlDialogShowRequest.EVENT_NAME]: YatlDialogShowRequest;
+        [YatlDialogShowEvent.EVENT_NAME]: YatlDialogShowEvent;
+        [YatlDialogHideRequest.EVENT_NAME]: YatlDialogHideRequest;
+        [YatlDialogHideEvent.EVENT_NAME]: YatlDialogHideEvent;
+    }
+}
+
+declare class YatlDropdownOpenRequest extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-dropdown-open-request";
+    constructor();
+    clone(): YatlDropdownOpenRequest;
+}
+declare class YatlDropdownOpenEvent extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-dropdown-open";
+    constructor();
+    clone(): YatlDropdownOpenEvent;
+}
+declare class YatlDropdownCloseRequest extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-dropdown-close-request";
+    constructor();
+    clone(): YatlDropdownCloseRequest;
+}
+declare class YatlDropdownCloseEvent extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-dropdown-close";
+    constructor();
+    clone(): YatlDropdownCloseEvent;
+}
+declare class YatlDropdownSelectEvent extends YatlEvent {
+    readonly item: YatlOption;
+    static readonly EVENT_NAME = "yatl-dropdown-select";
+    constructor(item: YatlOption);
+    clone(): YatlDropdownSelectEvent;
+}
+declare global {
+    interface HTMLElementEventMap {
+        [YatlDropdownOpenRequest.EVENT_NAME]: YatlDropdownOpenRequest;
+        [YatlDropdownOpenEvent.EVENT_NAME]: YatlDropdownOpenEvent;
+        [YatlDropdownCloseRequest.EVENT_NAME]: YatlDropdownCloseEvent;
+        [YatlDropdownCloseEvent.EVENT_NAME]: YatlDropdownCloseEvent;
+        [YatlDropdownSelectEvent.EVENT_NAME]: YatlDropdownSelectEvent;
+    }
+}
+
+declare class YatlToolbarSearchInput extends YatlEvent {
+    readonly value: string;
+    static readonly EVENT_NAME = "yatl-toolbar-search-input";
+    constructor(value: string);
+    clone(): YatlToolbarSearchInput;
+}
+declare class YatlToolbarSearchChange extends YatlEvent {
+    readonly value: string;
+    static readonly EVENT_NAME = "yatl-toolbar-search-change";
+    constructor(value: string);
+    clone(): YatlToolbarSearchChange;
+}
+declare class YatlToolbarExportClick extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-toolbar-export-click";
+    constructor();
+    clone(): YatlToolbarExportClick;
+}
+declare class YatlColumnToggleRequest<T extends object = UnspecifiedRecord> extends YatlEvent {
+    readonly field: NestedKeyOf<T>;
+    readonly visibility: boolean;
+    static readonly EVENT_NAME = "yatl-column-toggle-request";
+    constructor(field: NestedKeyOf<T>, visibility: boolean);
+    clone(): YatlColumnToggleRequest<T>;
+}
+declare global {
+    interface HTMLElementEventMap {
+        [YatlToolbarSearchInput.EVENT_NAME]: YatlToolbarSearchInput;
+        [YatlToolbarSearchChange.EVENT_NAME]: YatlToolbarSearchChange;
+        [YatlToolbarExportClick.EVENT_NAME]: YatlToolbarExportClick;
+        [YatlColumnToggleRequest.EVENT_NAME]: YatlColumnToggleRequest;
+    }
+}
+
+declare class YatlTagDismissEvent extends YatlEvent {
+    static readonly EVENT_NAME = "yatl-tag-dismiss";
+    constructor();
+    clone(): YatlTagDismissEvent;
+}
+declare global {
+    interface HTMLElementEventMap {
+        [YatlTagDismissEvent.EVENT_NAME]: YatlTagDismissEvent;
+    }
+}
+
 /**
  * Retrieves the flattened list of elements assigned to a slot.
  *
@@ -765,4 +879,4 @@ declare class HasSlotController implements ReactiveController {
  */
 declare function getInnerHTML(nodes: Iterable<Node>, callback?: (node: Node) => string | undefined): string;
 
-export { type FormControl, HasSlotController, YatlBaseFilter, YatlButton, type YatlButtonColor, YatlButtonGroup, type YatlButtonVariant, YatlCard, YatlCheckbox, YatlConfirmationDialog, YatlDateFilter, YatlDateInput, YatlDialog, YatlDropdown, YatlFormControl, YatlIcon, YatlInput, type YatlInputType, YatlNumberInput, YatlOption, YatlRadio, YatlRadioGroup, YatlSearchFilter, YatlSearchSelect, YatlSelect, YatlSelectFilter, YatlSwitch, YatlTableUi, YatlTableView, YatlTag, YatlToolbar, YatlTypeahead, activeElements, animateWithClass, dateConverter, getEffectiveChildren, getInnerHTML };
+export { type FormControl, HasSlotController, YatlBaseFilter, YatlButton, type YatlButtonColor, YatlButtonGroup, type YatlButtonVariant, YatlCard, YatlCheckbox, YatlColumnToggleRequest, YatlConfirmationDialog, YatlDateFilter, YatlDateInput, YatlDialog, YatlDialogHideEvent, YatlDialogHideRequest, YatlDialogShowEvent, YatlDialogShowRequest, YatlDropdown, YatlDropdownCloseEvent, YatlDropdownCloseRequest, YatlDropdownOpenEvent, YatlDropdownOpenRequest, YatlDropdownSelectEvent, YatlFormControl, YatlIcon, YatlInput, type YatlInputType, YatlNumberInput, YatlOption, YatlRadio, YatlRadioGroup, YatlSearchFilter, YatlSearchSelect, YatlSelect, YatlSelectFilter, YatlSwitch, YatlTableUi, YatlTableView, YatlTag, YatlTagDismissEvent, YatlToolbar, YatlToolbarExportClick, YatlToolbarSearchChange, YatlToolbarSearchInput, YatlTypeahead, activeElements, animateWithClass, dateConverter, getEffectiveChildren, getInnerHTML, tableContext };

package/dist/index.js

@@ -37,11 +37,21 @@ __export(src_exports, {
   YatlButtonGroup: () => YatlButtonGroup,
   YatlCard: () => YatlCard,
   YatlCheckbox: () => YatlCheckbox,
+  YatlColumnToggleRequest: () => YatlColumnToggleRequest,
   YatlConfirmationDialog: () => YatlConfirmationDialog,
   YatlDateFilter: () => YatlDateFilter,
   YatlDateInput: () => YatlDateInput,
   YatlDialog: () => YatlDialog,
+  YatlDialogHideEvent: () => YatlDialogHideEvent,
+  YatlDialogHideRequest: () => YatlDialogHideRequest,
+  YatlDialogShowEvent: () => YatlDialogShowEvent,
+  YatlDialogShowRequest: () => YatlDialogShowRequest,
   YatlDropdown: () => YatlDropdown,
+  YatlDropdownCloseEvent: () => YatlDropdownCloseEvent,
+  YatlDropdownCloseRequest: () => YatlDropdownCloseRequest,
+  YatlDropdownOpenEvent: () => YatlDropdownOpenEvent,
+  YatlDropdownOpenRequest: () => YatlDropdownOpenRequest,
+  YatlDropdownSelectEvent: () => YatlDropdownSelectEvent,
   YatlFormControl: () => YatlFormControl,
   YatlIcon: () => YatlIcon,
   YatlInput: () => YatlInput,
@@ -57,7 +67,11 @@ __export(src_exports, {
   YatlTableUi: () => YatlTableUi,
   YatlTableView: () => YatlTableView,
   YatlTag: () => YatlTag,
+  YatlTagDismissEvent: () => YatlTagDismissEvent,
   YatlToolbar: () => YatlToolbar,
+  YatlToolbarExportClick: () => YatlToolbarExportClick,
+  YatlToolbarSearchChange: () => YatlToolbarSearchChange,
+  YatlToolbarSearchInput: () => YatlToolbarSearchInput,
   YatlTypeahead: () => YatlTypeahead,
   activeElements: () => activeElements,
   animateWithClass: () => animateWithClass,
@@ -68,6 +82,7 @@ __export(src_exports, {
   noChange: () => import_lit56.noChange,
   nothing: () => import_lit56.nothing,
   svg: () => import_lit56.svg,
+  tableContext: () => tableContext,
   unsafeHTML: () => import_unsafe_html.unsafeHTML
 });
 module.exports = __toCommonJS(src_exports);
@@ -530,6 +545,19 @@ var YatlToolbarExportClick = class _YatlToolbarExportClick extends import_yatl3.
     return new _YatlToolbarExportClick();
   }
 };
+var YatlColumnToggleRequest = class _YatlColumnToggleRequest extends import_yatl3.YatlEvent {
+  constructor(field, visibility) {
+    super(_YatlColumnToggleRequest.EVENT_NAME, { cancelable: true });
+    this.field = field;
+    this.visibility = visibility;
+  }
+  static {
+    this.EVENT_NAME = "yatl-column-toggle-request";
+  }
+  clone() {
+    return new _YatlColumnToggleRequest(this.field, this.visibility);
+  }
+};
 
 // src/events/tag.ts
 var import_yatl4 = require("@timlassiter11/yatl");
@@ -1970,10 +1998,14 @@ var YatlToolbar = class extends YatlBase {
     this.showExportButton = true;
     this.handleDropdownSelect = (event) => {
       event.preventDefault();
-      this.controller?.toggleColumnVisibility(
-        event.item.value,
-        event.item.checked
-      );
+      const field = event.item.value;
+      const visible = event.item.checked;
+      const requestEvent = new YatlColumnToggleRequest(field, visible);
+      this.dispatchEvent(requestEvent);
+      if (requestEvent.defaultPrevented) {
+        return;
+      }
+      this.controller?.toggleColumnVisibility(field, visible);
     };
     this.onSearchInput = (event) => {
       const input = event.currentTarget;
@@ -4614,11 +4646,21 @@ var import_unsafe_html = require("lit/directives/unsafe-html.js");
   YatlButtonGroup,
   YatlCard,
   YatlCheckbox,
+  YatlColumnToggleRequest,
   YatlConfirmationDialog,
   YatlDateFilter,
   YatlDateInput,
   YatlDialog,
+  YatlDialogHideEvent,
+  YatlDialogHideRequest,
+  YatlDialogShowEvent,
+  YatlDialogShowRequest,
   YatlDropdown,
+  YatlDropdownCloseEvent,
+  YatlDropdownCloseRequest,
+  YatlDropdownOpenEvent,
+  YatlDropdownOpenRequest,
+  YatlDropdownSelectEvent,
   YatlFormControl,
   YatlIcon,
   YatlInput,
@@ -4634,7 +4676,11 @@ var import_unsafe_html = require("lit/directives/unsafe-html.js");
   YatlTableUi,
   YatlTableView,
   YatlTag,
+  YatlTagDismissEvent,
   YatlToolbar,
+  YatlToolbarExportClick,
+  YatlToolbarSearchChange,
+  YatlToolbarSearchInput,
   YatlTypeahead,
   activeElements,
   animateWithClass,
@@ -4645,6 +4691,7 @@ var import_unsafe_html = require("lit/directives/unsafe-html.js");
   noChange,
   nothing,
   svg,
+  tableContext,
   unsafeHTML
 });
 //# sourceMappingURL=index.js.map