@odx/foundation 1.0.0-alpha.4 → 1.0.0-alpha.40

package/dist/elements/table/table.element.d.ts

@@ -1,20 +0,0 @@
-import { CustomElement } from '@odx/foundation';
-import { TemplateResult } from 'lit';
-import { OdxTableHeaderElement } from './elements/table-header';
-import { OdxTableRowElement } from './elements/table-row';
-declare global {
-    interface HTMLElementTagNameMap {
-        'odx-table': OdxTableElement;
-    }
-}
-export declare class OdxTableElement extends CustomElement {
-    #private;
-    protected get headerElements(): OdxTableHeaderElement[];
-    protected get rowElements(): OdxTableRowElement[];
-    mode: string;
-    selected: string[];
-    items: Record<string, unknown>[];
-    connectedCallback(): void;
-    protected render(): TemplateResult;
-}
-//# sourceMappingURL=table.element.d.ts.map

package/dist/elements/table/table.element.js

@@ -1,97 +0,0 @@
-import { CustomElement, customElement } from '@odx/foundation';
-import { html } from 'lit';
-import { property } from 'lit/decorators.js';
-import styles from './table.element.css.js';
-import { OdxTableHeaderElement } from './elements/table-header/table-header.element.js';
-import { OdxTableRowElement } from './elements/table-row/table-row.element.js';
-import { OdxTableCheckboxCellElement } from './elements/table-checkbox-cell/table-checkbox-cell.element.js';
-
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __typeError = (msg) => {
-  throw TypeError(msg);
-};
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
-var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
-var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
-var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _selectedSet, _OdxTableElement_instances, selectAllRows_fn, deselectAllRows_fn, _handleChange;
-let OdxTableElement = class extends CustomElement {
-  constructor() {
-    super(...arguments);
-    __privateAdd(this, _OdxTableElement_instances);
-    __privateAdd(this, _selectedSet, /* @__PURE__ */ new Set());
-    this.mode = "selection";
-    this.selected = [];
-    this.items = [];
-    __privateAdd(this, _handleChange, (event) => {
-      if (event.target.localName !== OdxTableCheckboxCellElement.selector) return;
-      event.stopPropagation();
-      const rowElement = event.target.parentElement;
-      if (!rowElement) return;
-      const isSelected = event.target.checked;
-      if (rowElement.localName === OdxTableHeaderElement.selector) {
-        if (event.target.checked) {
-          __privateMethod(this, _OdxTableElement_instances, selectAllRows_fn).call(this);
-        } else {
-          __privateMethod(this, _OdxTableElement_instances, deselectAllRows_fn).call(this);
-        }
-      } else if (isSelected) {
-        __privateGet(this, _selectedSet).add(rowElement.value);
-      } else {
-        __privateGet(this, _selectedSet).delete(rowElement.value);
-      }
-    });
-  }
-  get headerElements() {
-    return Array.from(this.querySelectorAll(OdxTableHeaderElement.selector));
-  }
-  get rowElements() {
-    return Array.from(this.querySelectorAll(OdxTableRowElement.selector));
-  }
-  connectedCallback() {
-    super.connectedCallback?.();
-    this.role = "grid";
-  }
-  render() {
-    return html`<slot @change=${__privateGet(this, _handleChange)}></slot>`;
-  }
-};
-_selectedSet = new WeakMap();
-_OdxTableElement_instances = new WeakSet();
-selectAllRows_fn = function() {
-  for (const row of this.rowElements) {
-    row.selected = true;
-    __privateGet(this, _selectedSet).add(row.value);
-  }
-};
-deselectAllRows_fn = function() {
-  __privateGet(this, _selectedSet).clear();
-  for (const row of this.rowElements) {
-    if (!row.selected) continue;
-    row.selected = false;
-  }
-};
-_handleChange = new WeakMap();
-__decorateClass([
-  property()
-], OdxTableElement.prototype, "mode", 2);
-__decorateClass([
-  property({ type: Array })
-], OdxTableElement.prototype, "selected", 2);
-__decorateClass([
-  property({ type: Array })
-], OdxTableElement.prototype, "items", 2);
-OdxTableElement = __decorateClass([
-  customElement("odx-table", [styles])
-], OdxTableElement);
-
-export { OdxTableElement };

package/dist/elements/toast/index.d.ts

@@ -1,3 +0,0 @@
-export * from './models';
-export * from './toast.element';
-//# sourceMappingURL=index.d.ts.map

package/dist/elements/toast/models/index.d.ts

@@ -1,2 +0,0 @@
-export * from './toast-variant';
-//# sourceMappingURL=index.d.ts.map

package/dist/elements/toast/models/toast-variant.js

@@ -1,5 +0,0 @@
-const ToastVariant = {
-  DANGER: "danger"
-};
-
-export { ToastVariant };

package/dist/elements/toast/toast.element.css.js

@@ -1,3 +0,0 @@
-const styles = "";
-
-export { styles as default };

package/dist/elements/toast/toast.element.d.ts

@@ -1,13 +0,0 @@
-import { CustomElement } from '@odx/foundation';
-import { TemplateResult } from 'lit';
-import { ToastVariant } from './models';
-declare global {
-    interface HTMLElementTagNameMap {
-        'odx-toast': OdxToastElement;
-    }
-}
-export declare class OdxToastElement extends CustomElement {
-    variant?: ToastVariant | null;
-    protected render(): TemplateResult;
-}
-//# sourceMappingURL=toast.element.d.ts.map

package/dist/elements/toast/toast.element.js

@@ -1,31 +0,0 @@
-import { CustomElement, customElement } from '@odx/foundation';
-import { html } from 'lit';
-import { property } from 'lit/decorators.js';
-import styles from './toast.element.css.js';
-
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-let OdxToastElement = class extends CustomElement {
-  render() {
-    return html`
-      <slot name="title"></slot>
-      <slot></slot>
-    `;
-  }
-};
-__decorateClass([
-  property({ reflect: true })
-], OdxToastElement.prototype, "variant", 2);
-OdxToastElement = __decorateClass([
-  customElement("odx-toast", [styles])
-], OdxToastElement);
-
-export { OdxToastElement };

package/dist/elements/tooltip/index.d.ts

@@ -1,3 +0,0 @@
-export * from './models';
-export * from './tooltip.element';
-//# sourceMappingURL=index.d.ts.map

package/dist/elements/tooltip/models/index.d.ts

@@ -1,2 +0,0 @@
-export * from './tooltip-placement';
-//# sourceMappingURL=index.d.ts.map

package/dist/elements/tooltip/models/tooltip-placement.js

@@ -1,10 +0,0 @@
-import { PopoverPlacement } from '@odx/foundation/cdk';
-
-const TooltipPlacement = {
-  TOP: PopoverPlacement.TOP,
-  RIGHT: PopoverPlacement.RIGHT,
-  BOTTOM: PopoverPlacement.BOTTOM,
-  LEFT: PopoverPlacement.LEFT
-};
-
-export { TooltipPlacement };

package/dist/elements/tooltip/tooltip.element.css.js

@@ -1,3 +0,0 @@
-const styles = ":host(:not([interactive])){pointer-events:none}odx-popover{--color-fill: var(--odx-palette-blue-90);--color-text: var(--odx-color-text-inverse)}::slotted(odx-button[aria-disabled=\"true\"]){pointer-events:auto}";
-
-export { styles as default };

package/dist/elements/tooltip/tooltip.element.js

@@ -1,120 +0,0 @@
-import { CustomElement, getUniqueId, toggleAttribute, customElement } from '@odx/foundation';
-import { PopoverHost } from '@odx/foundation/cdk';
-import { html } from 'lit';
-import { property } from 'lit/decorators.js';
-import styles from './tooltip.element.css.js';
-import { TooltipPlacement } from './models/tooltip-placement.js';
-
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __typeError = (msg) => {
-  throw TypeError(msg);
-};
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
-var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
-var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
-var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _OdxTooltipElement_instances, addKeyboardListeners_fn, removeKeyboardListeners_fn, addMouseListeners_fn, removeMouseListeners_fn, updateAriaAttributes_fn, _handleReferenceMouseLeave, _handleMouseEvents, _handleKeyboardFocus;
-let OdxTooltipElement = class extends PopoverHost(CustomElement) {
-  constructor() {
-    super(...arguments);
-    __privateAdd(this, _OdxTooltipElement_instances);
-    this.placement = TooltipPlacement.TOP;
-    this.interactive = false;
-    this.id = "test";
-    __privateAdd(this, _handleReferenceMouseLeave, (event) => {
-      if (event.relatedTarget === this) return;
-      __privateGet(this, _handleMouseEvents).call(this, event);
-    });
-    __privateAdd(this, _handleMouseEvents, ({ type }) => {
-      if (type !== "mouseenter" && type !== "mouseleave") return;
-      this.togglePopover(type === "mouseenter");
-    });
-    __privateAdd(this, _handleKeyboardFocus, ({ type, key }) => {
-      if (key !== "Tab") return;
-      this.togglePopover(type !== "keydown");
-    });
-  }
-  connectedCallback() {
-    super.connectedCallback?.();
-    this.id ||= getUniqueId("odx-tooltip");
-    this.role = "tooltip";
-  }
-  mountPopover(referenceElement) {
-    super.mountPopover(referenceElement);
-    if (!referenceElement) return;
-    __privateMethod(this, _OdxTooltipElement_instances, updateAriaAttributes_fn).call(this, referenceElement, this.id);
-    __privateMethod(this, _OdxTooltipElement_instances, addKeyboardListeners_fn).call(this, referenceElement);
-    __privateMethod(this, _OdxTooltipElement_instances, addMouseListeners_fn).call(this, referenceElement);
-  }
-  unmountPopover(referenceElement) {
-    super.unmountPopover(referenceElement);
-    __privateMethod(this, _OdxTooltipElement_instances, updateAriaAttributes_fn).call(this, referenceElement, null);
-    __privateMethod(this, _OdxTooltipElement_instances, removeKeyboardListeners_fn).call(this, referenceElement);
-    __privateMethod(this, _OdxTooltipElement_instances, removeMouseListeners_fn).call(this, referenceElement);
-  }
-  render() {
-    return html`
-      <odx-popover showArrow>
-        <slot></slot>
-      </odx-popover>
-    `;
-  }
-  willUpdate(props) {
-    super.willUpdate?.(props);
-    if (props.has("id")) {
-      __privateMethod(this, _OdxTooltipElement_instances, updateAriaAttributes_fn).call(this, this.referenceElement, this.id);
-    }
-  }
-};
-_OdxTooltipElement_instances = new WeakSet();
-addKeyboardListeners_fn = function(referenceElement) {
-  referenceElement.addEventListener("keyup", __privateGet(this, _handleKeyboardFocus));
-  referenceElement.addEventListener("keydown", __privateGet(this, _handleKeyboardFocus));
-};
-removeKeyboardListeners_fn = function(referenceElement) {
-  referenceElement.removeEventListener("keyup", __privateGet(this, _handleKeyboardFocus));
-  referenceElement.removeEventListener("keydown", __privateGet(this, _handleKeyboardFocus));
-};
-addMouseListeners_fn = function(referenceElement) {
-  this.addEventListener("mouseleave", __privateGet(this, _handleMouseEvents));
-  referenceElement.addEventListener("mouseenter", __privateGet(this, _handleMouseEvents));
-  referenceElement.addEventListener("mouseleave", __privateGet(this, _handleReferenceMouseLeave));
-  referenceElement.addEventListener("keyup", __privateGet(this, _handleKeyboardFocus));
-  referenceElement.addEventListener("keydown", __privateGet(this, _handleKeyboardFocus));
-};
-removeMouseListeners_fn = function(referenceElement) {
-  this.removeEventListener("mouseleave", __privateGet(this, _handleMouseEvents));
-  referenceElement.removeEventListener("mouseenter", __privateGet(this, _handleMouseEvents));
-  referenceElement.removeEventListener("mouseleave", __privateGet(this, _handleReferenceMouseLeave));
-  referenceElement.removeEventListener("keyup", __privateGet(this, _handleKeyboardFocus));
-  referenceElement.removeEventListener("keydown", __privateGet(this, _handleKeyboardFocus));
-};
-updateAriaAttributes_fn = function(referenceElement, id) {
-  toggleAttribute(referenceElement, "aria-describedby", id);
-};
-_handleReferenceMouseLeave = new WeakMap();
-_handleMouseEvents = new WeakMap();
-_handleKeyboardFocus = new WeakMap();
-__decorateClass([
-  property({ reflect: true })
-], OdxTooltipElement.prototype, "placement", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], OdxTooltipElement.prototype, "interactive", 2);
-__decorateClass([
-  property({ reflect: true })
-], OdxTooltipElement.prototype, "id", 2);
-OdxTooltipElement = __decorateClass([
-  customElement("odx-tooltip", [styles])
-], OdxTooltipElement);
-
-export { OdxTooltipElement };

package/dist/lib/controllers/focus-trap.controller.js

@@ -1,55 +0,0 @@
-import { createFocusTrap } from 'focus-trap';
-import { isServer } from 'lit';
-import { createOptions } from '../utils/create-options.js';
-import { waitForAnimations } from '../utils/wait-for-animations.js';
-
-const FocusTrapControllerOptions = createOptions({
-  escapeDeactivates: false,
-  tabbableOptions: { getShadowRoot: true }
-});
-class FocusTrapController {
-  #host;
-  #options;
-  #focusTrap;
-  constructor(host, options) {
-    this.#host = host;
-    this.#options = FocusTrapControllerOptions(options);
-    this.#host.addController(this);
-  }
-  async activate() {
-    await this.#host.updateComplete;
-    this.#focusTrap?.activate();
-  }
-  async deactivate() {
-    await this.#host.updateComplete;
-    this.#focusTrap?.deactivate();
-  }
-  async toggle(state) {
-    if (state ?? !this.#focusTrap?.active) {
-      return this.activate();
-    }
-    return this.deactivate();
-  }
-  async hostConnected() {
-    if (isServer) return;
-    await this.#host.updateComplete;
-    this.#focusTrap ??= createFocusTrap(this.#host, {
-      ...this.#options,
-      checkCanFocusTrap: this.#checkCanFocusTrap.bind(this),
-      checkCanReturnFocus: this.#checkCanReturnFocus.bind(this)
-    });
-  }
-  hostDisconnected() {
-    this.deactivate();
-  }
-  async #checkCanFocusTrap(containers) {
-    await waitForAnimations(this.#host);
-    await this.#options.checkCanFocusTrap?.(containers);
-  }
-  async #checkCanReturnFocus(trigger) {
-    await waitForAnimations(this.#host);
-    await this.#options.checkCanReturnFocus?.(trigger);
-  }
-}
-
-export { FocusTrapController };

package/dist/lib/controllers/index.d.ts

@@ -1,2 +0,0 @@
-export * from './focus-trap.controller';
-//# sourceMappingURL=index.d.ts.map

package/dist/lib/directives/aria-boolean-attr.d.ts

@@ -1,3 +0,0 @@
-export declare function toAriaBooleanAttribute(value: boolean, removeOnFalse?: boolean): 'true' | 'false';
-export declare function fromAriaBooleanAttribute(value?: string | null): boolean;
-//# sourceMappingURL=aria-boolean-attr.d.ts.map

package/dist/lib/directives/aria-boolean-attr.js

@@ -1,9 +0,0 @@
-function toAriaBooleanAttribute(value, removeOnFalse = true) {
-  if (removeOnFalse && value === false) return null;
-  return String(value);
-}
-function fromAriaBooleanAttribute(value) {
-  return value === "true";
-}
-
-export { fromAriaBooleanAttribute, toAriaBooleanAttribute };

package/dist/lib/directives/index.d.ts

@@ -1,5 +0,0 @@
-export * from './aria-boolean-attr';
-export * from './optional-attr';
-export * from './optional-slot';
-export * from './slot-fallback';
-//# sourceMappingURL=index.d.ts.map

package/dist/lib/directives/optional-attr.js

@@ -1,8 +0,0 @@
-import { nothing } from 'lit';
-
-const optionalAttr = (value) => {
-  if (value === void 0 || value === null || value === "") return nothing;
-  return value;
-};
-
-export { optionalAttr };

package/dist/lib/directives/optional-slot.js

@@ -1,14 +0,0 @@
-import { html, nothing } from 'lit';
-
-function optionalSlot(host, slotName) {
-  if (host.querySelector(`[slot="${slotName}"]`)) {
-    return html`
-      <div class="${slotName}" part="${slotName}-container">
-        <slot name="${slotName}" @slotchange="${() => host.requestUpdate()}"></slot>
-      </div>
-    `;
-  }
-  return nothing;
-}
-
-export { optionalSlot };

package/dist/lib/directives/slot-fallback.js

@@ -1,16 +0,0 @@
-import { directive, Directive } from 'lit/directive.js';
-import { toggleAttribute } from '../utils/dom.js';
-
-class SlotFallbackDirective extends Directive {
-  update({ options, element }) {
-    const host = options?.host;
-    if (!host || !(element instanceof HTMLSlotElement)) return;
-    const attributeName = ["empty-slot", element.name].filter(Boolean).join("-");
-    toggleAttribute(host, attributeName, !host.textContent?.trim() && element.assignedElements().length === 0);
-  }
-  render() {
-  }
-}
-const emptySlotFallbackFix = directive(SlotFallbackDirective);
-
-export { emptySlotFallbackFix };

package/dist/lib/external/index.d.ts

@@ -1,2 +0,0 @@
-export * from './roving-tabindex';
-//# sourceMappingURL=index.d.ts.map

package/dist/lib/external/roving-tabindex.d.ts

@@ -1,87 +0,0 @@
-import { ReactiveController, ReactiveElement } from 'lit';
-type DirectionTypes = 'horizontal' | 'vertical' | 'both' | 'grid';
-export type FocusGroupConfig<T> = {
-    hostDelegatesFocus?: boolean;
-    focusInIndex?: (_elements: T[]) => number;
-    direction?: DirectionTypes | (() => DirectionTypes);
-    elementEnterAction?: (el: T) => void;
-    elements: () => T[];
-    isFocusableElement?: (el: T) => boolean;
-    listenerScope?: HTMLElement | (() => HTMLElement);
-};
-export declare class FocusGroupController<T extends HTMLElement> implements ReactiveController {
-    protected cachedElements?: T[];
-    private mutationObserver;
-    get currentIndex(): number;
-    set currentIndex(currentIndex: number);
-    private _currentIndex;
-    private prevIndex;
-    get direction(): DirectionTypes;
-    _direction: () => DirectionTypes;
-    directionLength: number;
-    hostDelegatesFocus: boolean;
-    elementEnterAction: (_el: T) => void;
-    get elements(): T[];
-    private _elements;
-    protected set focused(focused: boolean);
-    protected get focused(): boolean;
-    private _focused;
-    get focusInElement(): T;
-    get focusInIndex(): number;
-    _focusInIndex: (_elements: T[]) => number;
-    host: ReactiveElement;
-    isFocusableElement: (_el: T) => boolean;
-    isEventWithinListenerScope(event: Event): boolean;
-    _listenerScope: () => HTMLElement;
-    offset: number;
-    recentlyConnected: boolean;
-    constructor(host: ReactiveElement, { hostDelegatesFocus, direction, elementEnterAction, elements, focusInIndex, isFocusableElement, listenerScope }?: FocusGroupConfig<T>);
-    handleItemMutation(): void;
-    update({ elements }?: FocusGroupConfig<T>): void;
-    /**
-     * resets the focusedItem to initial item
-     */
-    reset(): void;
-    focusOnItem(item?: T, options?: FocusOptions): void;
-    focus(options?: FocusOptions): void;
-    clearElementCache(offset?: number): void;
-    setCurrentIndexCircularly(diff: number): void;
-    hostContainsFocus(): void;
-    hostNoLongerContainsFocus(): void;
-    isRelatedTargetOrContainAnElement(event: FocusEvent): boolean;
-    handleFocusin: (event: FocusEvent) => void;
-    /**
-     * handleClick - Finds the element that was clicked and sets the tabindex to 0
-     * @returns void
-     */
-    handleClick: () => void;
-    handleFocusout: (event: FocusEvent) => void;
-    acceptsEventKey(key: string): boolean;
-    handleKeydown: (event: KeyboardEvent) => void;
-    manage(): void;
-    unmanage(): void;
-    addEventListeners(): void;
-    removeEventListeners(): void;
-    hostConnected(): void;
-    hostDisconnected(): void;
-    hostUpdated(): void;
-}
-export type RovingTabindexConfig<T> = FocusGroupConfig<T>;
-interface UpdateTabIndexes {
-    tabIndex: number;
-    removeTabIndex?: boolean;
-}
-export declare class RovingTabindexController<T extends HTMLElement> extends FocusGroupController<T> {
-    protected set focused(focused: boolean);
-    protected get focused(): boolean;
-    private managed;
-    private manageIndexesAnimationFrame;
-    clearElementCache(offset?: number): void;
-    manageTabindexes(): void;
-    updateTabindexes(getTabIndex: (el: HTMLElement) => UpdateTabIndexes): void;
-    manage(): void;
-    unmanage(): void;
-    hostUpdated(): void;
-}
-export {};
-//# sourceMappingURL=roving-tabindex.d.ts.map