igniteui-webcomponents 7.3.0 → 7.3.1

package/components/resize-container/themes/light/resize-indicator.indigo.css.js

@@ -1,3 +0,0 @@
-import { css } from 'lit';
-export const styles = css `:host{--ig-theme: indigo;--ig-theme-variant: light}`;
-//# sourceMappingURL=resize-indicator.indigo.css.js.map

package/components/resize-container/themes/light/resize-indicator.indigo.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"resize-indicator.indigo.css.js","sourceRoot":"","sources":["../../../../../src/components/resize-container/themes/light/resize-indicator.indigo.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,qDAAqD,CAAC","sourcesContent":["\n  import { css } from 'lit';\n  export const styles = css`:host{--ig-theme: indigo;--ig-theme-variant: light}`;\n  "]}

package/components/resize-container/themes/light/resize-indicator.material.css.d.ts

@@ -1 +0,0 @@
-export declare const styles: import("lit").CSSResult;

package/components/resize-container/themes/light/resize-indicator.material.css.js

@@ -1,3 +0,0 @@
-import { css } from 'lit';
-export const styles = css `:host{--ig-theme: material;--ig-theme-variant: light}`;
-//# sourceMappingURL=resize-indicator.material.css.js.map

package/components/resize-container/themes/light/resize-indicator.material.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"resize-indicator.material.css.js","sourceRoot":"","sources":["../../../../../src/components/resize-container/themes/light/resize-indicator.material.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,uDAAuD,CAAC","sourcesContent":["\n  import { css } from 'lit';\n  export const styles = css`:host{--ig-theme: material;--ig-theme-variant: light}`;\n  "]}

package/components/resize-container/themes/light/resize-indicator.shared.css.d.ts

@@ -1 +0,0 @@
-export declare const styles: import("lit").CSSResult;

package/components/resize-container/themes/light/resize-indicator.shared.css.js

@@ -1,3 +0,0 @@
-import { css } from 'lit';
-export const styles = css `:host{--resize-indicator: var(--ig-resize-indicator-resize-indicator, var(--ig-primary-500));--ig-theme-variant: light}`;
-//# sourceMappingURL=resize-indicator.shared.css.js.map

package/components/resize-container/themes/light/resize-indicator.shared.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"resize-indicator.shared.css.js","sourceRoot":"","sources":["../../../../../src/components/resize-container/themes/light/resize-indicator.shared.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,yHAAyH,CAAC","sourcesContent":["\n  import { css } from 'lit';\n  export const styles = css`:host{--resize-indicator: var(--ig-resize-indicator-resize-indicator, var(--ig-primary-500));--ig-theme-variant: light}`;\n  "]}

package/components/resize-container/themes/resize-container.base.css.d.ts

@@ -1 +0,0 @@
-export declare const styles: import("lit").CSSResult;

package/components/resize-container/themes/resize-container.base.css.js

@@ -1,3 +0,0 @@
-import { css } from 'lit';
-export const styles = css `:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}[part=trigger-side],[part=trigger],[part=trigger-bottom]{--_size: 0.6875rem;display:inline-flex;visibility:var(--resize-visibility);position:absolute;z-index:1}:host{display:contents}[part~=resize-base]{position:relative;height:100%}[part=trigger-side]{top:calc(50% - var(--_size));right:calc(var(--_size)/2*-1);cursor:e-resize}[part=trigger]{bottom:calc(var(--_size)/2*-1);right:calc(var(--_size)/2*-1);cursor:se-resize}[part=trigger-bottom]{left:calc(50% - var(--_size));bottom:calc(var(--_size)/2*-1);cursor:s-resize}[part=trigger]:focus{outline:none}`;
-//# sourceMappingURL=resize-container.base.css.js.map

package/components/resize-container/themes/resize-container.base.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"resize-container.base.css.js","sourceRoot":"","sources":["../../../../src/components/resize-container/themes/resize-container.base.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,o/CAAo/C,CAAC","sourcesContent":["\n  import { css } from 'lit';\n  export const styles = css`:host{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);position:relative;box-sizing:border-box;scrollbar-width:var(--ig-scrollbar-size, var(--sb-size));scrollbar-color:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color)) var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar{width:var(--ig-scrollbar-size, var(--sb-size));height:var(--ig-scrollbar-size, var(--sb-size));background:var(--ig-scrollbar-track-background, var(--sb-track-bg-color))}:host ::-webkit-scrollbar-thumb{background:var(--ig-scrollbar-thumb-background, var(--sb-thumb-bg-color))}:host *,:host *::before,:host *::after{box-sizing:border-box}:host([hidden]),[hidden]{display:none !important}[part=trigger-side],[part=trigger],[part=trigger-bottom]{--_size: 0.6875rem;display:inline-flex;visibility:var(--resize-visibility);position:absolute;z-index:1}:host{display:contents}[part~=resize-base]{position:relative;height:100%}[part=trigger-side]{top:calc(50% - var(--_size));right:calc(var(--_size)/2*-1);cursor:e-resize}[part=trigger]{bottom:calc(var(--_size)/2*-1);right:calc(var(--_size)/2*-1);cursor:se-resize}[part=trigger-bottom]{left:calc(50% - var(--_size));bottom:calc(var(--_size)/2*-1);cursor:s-resize}[part=trigger]:focus{outline:none}`;\n  "]}

package/components/resize-container/themes/shared/resize-container.common.css.d.ts

@@ -1 +0,0 @@
-export declare const styles: import("lit").CSSResult;

package/components/resize-container/themes/shared/resize-container.common.css.js

@@ -1,3 +0,0 @@
-import { css } from 'lit';
-export const styles = css `[part~=active]::after{content:"";position:absolute;pointer-events:none;inset:0;width:100%;height:100%;border-radius:var(--_border-radius);border:.0625rem solid var(--resize-indicator)}[part=trigger-side],[part=trigger],[part=trigger-bottom]{width:var(--_size);aspect-ratio:1;border-radius:50%;z-index:11111;background-color:var(--resize-indicator)}`;
-//# sourceMappingURL=resize-container.common.css.js.map

package/components/resize-container/themes/shared/resize-container.common.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"resize-container.common.css.js","sourceRoot":"","sources":["../../../../../src/components/resize-container/themes/shared/resize-container.common.css.ts"],"names":[],"mappings":"AACE,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAC1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA,8VAA8V,CAAC","sourcesContent":["\n  import { css } from 'lit';\n  export const styles = css`[part~=active]::after{content:\"\";position:absolute;pointer-events:none;inset:0;width:100%;height:100%;border-radius:var(--_border-radius);border:.0625rem solid var(--resize-indicator)}[part=trigger-side],[part=trigger],[part=trigger-bottom]{width:var(--_size);aspect-ratio:1;border-radius:50%;z-index:11111;background-color:var(--resize-indicator)}`;\n  "]}

package/components/resize-container/themes/themes.d.ts

@@ -1,2 +0,0 @@
-import type { Themes } from '#theming/types.js';
-export declare const all: Themes;

package/components/resize-container/themes/themes.js

@@ -1,47 +0,0 @@
-import { css } from 'lit';
-import { styles as bootstrapDark } from './dark/resize-indicator.bootstrap.css.js';
-import { styles as fluentDark } from './dark/resize-indicator.fluent.css.js';
-import { styles as indigoDark } from './dark/resize-indicator.indigo.css.js';
-import { styles as materialDark } from './dark/resize-indicator.material.css.js';
-import { styles as sharedDark } from './dark/resize-indicator.shared.css.js';
-import { styles as bootstrapLight } from './light/resize-indicator.bootstrap.css.js';
-import { styles as fluentLight } from './light/resize-indicator.fluent.css.js';
-import { styles as indigoLight } from './light/resize-indicator.indigo.css.js';
-import { styles as materialLight } from './light/resize-indicator.material.css.js';
-import { styles as sharedLight } from './light/resize-indicator.shared.css.js';
-const light = {
-    shared: css `
-    ${sharedLight}
-  `,
-    bootstrap: css `
-    ${bootstrapLight}
-  `,
-    material: css `
-    ${materialLight}
-  `,
-    fluent: css `
-    ${fluentLight}
-  `,
-    indigo: css `
-    ${indigoLight}
-  `,
-};
-const dark = {
-    shared: css `
-    ${sharedDark}
-  `,
-    bootstrap: css `
-    ${bootstrapDark}
-  `,
-    material: css `
-    ${materialDark}
-  `,
-    fluent: css `
-    ${fluentDark}
-  `,
-    indigo: css `
-    ${indigoDark}
-  `,
-};
-export const all = { light, dark };
-//# sourceMappingURL=themes.js.map

package/components/resize-container/themes/themes.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"themes.js","sourceRoot":"","sources":["../../../../src/components/resize-container/themes/themes.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAI1B,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,0CAA0C,CAAC;AACnF,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,yCAAyC,CAAC;AACjF,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,uCAAuC,CAAC;AAE7E,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,2CAA2C,CAAC;AACrF,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAC/E,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAC/E,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,0CAA0C,CAAC;AACnF,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,wCAAwC,CAAC;AAE/E,MAAM,KAAK,GAAG;IACZ,MAAM,EAAE,GAAG,CAAA;MACP,WAAW;GACd;IACD,SAAS,EAAE,GAAG,CAAA;MACV,cAAc;GACjB;IACD,QAAQ,EAAE,GAAG,CAAA;MACT,aAAa;GAChB;IACD,MAAM,EAAE,GAAG,CAAA;MACP,WAAW;GACd;IACD,MAAM,EAAE,GAAG,CAAA;MACP,WAAW;GACd;CACF,CAAC;AAEF,MAAM,IAAI,GAAG;IACX,MAAM,EAAE,GAAG,CAAA;MACP,UAAU;GACb;IACD,SAAS,EAAE,GAAG,CAAA;MACV,aAAa;GAChB;IACD,QAAQ,EAAE,GAAG,CAAA;MACT,YAAY;GACf;IACD,MAAM,EAAE,GAAG,CAAA;MACP,UAAU;GACb;IACD,MAAM,EAAE,GAAG,CAAA;MACP,UAAU;GACb;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,GAAG,GAAW,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC","sourcesContent":["import { css } from 'lit';\n\nimport type { Themes } from '#theming/types.js';\n// Dark Overrides\nimport { styles as bootstrapDark } from './dark/resize-indicator.bootstrap.css.js';\nimport { styles as fluentDark } from './dark/resize-indicator.fluent.css.js';\nimport { styles as indigoDark } from './dark/resize-indicator.indigo.css.js';\nimport { styles as materialDark } from './dark/resize-indicator.material.css.js';\nimport { styles as sharedDark } from './dark/resize-indicator.shared.css.js';\n// Light Overrides\nimport { styles as bootstrapLight } from './light/resize-indicator.bootstrap.css.js';\nimport { styles as fluentLight } from './light/resize-indicator.fluent.css.js';\nimport { styles as indigoLight } from './light/resize-indicator.indigo.css.js';\nimport { styles as materialLight } from './light/resize-indicator.material.css.js';\nimport { styles as sharedLight } from './light/resize-indicator.shared.css.js';\n\nconst light = {\n  shared: css`\n    ${sharedLight}\n  `,\n  bootstrap: css`\n    ${bootstrapLight}\n  `,\n  material: css`\n    ${materialLight}\n  `,\n  fluent: css`\n    ${fluentLight}\n  `,\n  indigo: css`\n    ${indigoLight}\n  `,\n};\n\nconst dark = {\n  shared: css`\n    ${sharedDark}\n  `,\n  bootstrap: css`\n    ${bootstrapDark}\n  `,\n  material: css`\n    ${materialDark}\n  `,\n  fluent: css`\n    ${fluentDark}\n  `,\n  indigo: css`\n    ${indigoDark}\n  `,\n};\n\nexport const all: Themes = { light, dark };\n"]}

package/components/resize-container/types.d.ts

@@ -1,40 +0,0 @@
-import type { Ref } from 'lit/directives/ref.js';
-export type ResizeMode = 'immediate' | 'deferred';
-export type ResizeCallback = (params: ResizeCallbackParams) => unknown;
-export type ResizeCancelCallback = (state: ResizeState) => unknown;
-export type ResizeGhostFactory = () => HTMLElement;
-export type ResizeState = {
-    initial: DOMRect;
-    current: DOMRect;
-    deltaX: number;
-    deltaY: number;
-    ghost: HTMLElement | null;
-    trigger: HTMLElement | null;
-    commit?: () => unknown;
-};
-export type ResizeCallbackParams = {
-    event: PointerEvent;
-    state: ResizeState;
-};
-export type ResizeControllerConfiguration = {
-    enabled?: boolean;
-    ref?: Ref<HTMLElement>[];
-    mode?: ResizeMode;
-    deferredFactory?: ResizeGhostFactory;
-    layer?: () => HTMLElement;
-    /** Callback invoked at the start of a resize operation. */
-    start?: ResizeCallback;
-    /** Callback invoked on each pointer move during a resize operation. */
-    resize?: ResizeCallback;
-    /** Callback invoked when a resize operation completes. */
-    end?: ResizeCallback;
-    /** Callback invoked when a resize operation is cancelled. */
-    cancel?: ResizeCancelCallback;
-    /**
-     * Optional callback that returns the DOM element which will be resized/resizing depending on the
-     * configured mode of the controller.
-     *
-     * Defaults to the controller host.
-     */
-    resizeTarget?: () => HTMLElement;
-};

package/components/resize-container/types.js

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

package/components/resize-container/types.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/resize-container/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Ref } from 'lit/directives/ref.js';\n\nexport type ResizeMode = 'immediate' | 'deferred';\nexport type ResizeCallback = (params: ResizeCallbackParams) => unknown;\nexport type ResizeCancelCallback = (state: ResizeState) => unknown;\nexport type ResizeGhostFactory = () => HTMLElement;\n\nexport type ResizeState = {\n  initial: DOMRect;\n  current: DOMRect;\n  deltaX: number;\n  deltaY: number;\n  ghost: HTMLElement | null;\n  trigger: HTMLElement | null;\n  commit?: () => unknown;\n};\n\nexport type ResizeCallbackParams = {\n  event: PointerEvent;\n  state: ResizeState;\n};\n\nexport type ResizeControllerConfiguration = {\n  enabled?: boolean;\n  ref?: Ref<HTMLElement>[];\n  mode?: ResizeMode;\n  deferredFactory?: ResizeGhostFactory;\n  layer?: () => HTMLElement;\n  /** Callback invoked at the start of a resize operation. */\n  start?: ResizeCallback;\n  /** Callback invoked on each pointer move during a resize operation. */\n  resize?: ResizeCallback;\n  /** Callback invoked when a resize operation completes. */\n  end?: ResizeCallback;\n  /** Callback invoked when a resize operation is cancelled. */\n  cancel?: ResizeCancelCallback;\n  /**\n   * Optional callback that returns the DOM element which will be resized/resizing depending on the\n   * configured mode of the controller.\n   *\n   * Defaults to the controller host.\n   */\n  resizeTarget?: () => HTMLElement;\n};\n"]}

package/internals/controllers/drag.d.ts

@@ -1,166 +0,0 @@
-import type { LitElement, ReactiveController, ReactiveControllerHost } from 'lit';
-import type { Ref } from 'lit/directives/ref.js';
-type DragCallback = (parameters: DragCallbackParameters) => unknown;
-type DragCancelCallback = (state: DragState) => unknown;
-export type DragCallbackParameters = {
-    event: PointerEvent;
-    state: DragState;
-};
-type State = {
-    initial: DOMRect;
-    current: DOMRect;
-    position: {
-        x: number;
-        y: number;
-    };
-    offset: {
-        x: number;
-        y: number;
-    };
-    pointerState: {
-        previous: {
-            x: number;
-            y: number;
-        };
-        current: {
-            x: number;
-            y: number;
-        };
-        direction: Direction;
-    };
-};
-type DragState = State & {
-    ghost: HTMLElement | null;
-    element: Element | null;
-};
-type Direction = 'start' | 'end' | 'bottom' | 'top';
-type DragControllerConfiguration = {
-    /** Whether the drag feature is enabled for the current host. */
-    enabled?: boolean;
-    /**
-     * The mode of the drag operation.
-     *
-     * Deferred will create a ghost element and keep the original element
-     * at its place until the operation completes successfully.
-     */
-    mode?: 'immediate' | 'deferred';
-    /**
-     * Whether starting a drag operation should snap the dragged item's top left corner
-     * to the cursor position.
-     */
-    snapToCursor?: boolean;
-    /**
-     * Guard function invoked during the `start` callback.
-     * Returning a truthy value will stop the current drag operation.
-     */
-    skip?: (event: PointerEvent) => boolean;
-    matchTarget?: (target: Element) => boolean;
-    /**
-     *
-     */
-    trigger?: () => HTMLElement;
-    /**
-     * Contain drag operations to the scope of the passed DOM element.
-     */
-    container?: Ref<HTMLElement>;
-    /**
-     * The DOM element that will "host" the ghost drag element when the controller
-     * is set to **deferred**.
-     *
-     * @remarks
-     * In **immediate** mode, this property is ignored.
-     */
-    layer?: () => HTMLElement;
-    ghost?: () => HTMLElement;
-    /** Callback invoked at the beginning of a drag operation. */
-    start?: DragCallback;
-    /** Callback invoked while dragging the target element.  */
-    move?: DragCallback;
-    enter?: DragCallback;
-    leave?: DragCallback;
-    over?: DragCallback;
-    /** Callback invoked during a drop operation. */
-    end?: DragCallback;
-    /** Callback invoked when a drag is cancelled */
-    cancel?: DragCancelCallback;
-};
-declare class DragController implements ReactiveController {
-    private readonly _host;
-    private readonly _options;
-    private readonly _abortHandle;
-    private _state;
-    private _matchedElement;
-    private _id;
-    private _hasPointerCapture;
-    private _ghost;
-    /** Whether `snapToCursor` is enabled for the controller. */
-    private get _hasSnapping();
-    /** Whether the current drag mode is deferred. */
-    private get _isDeferred();
-    /**
-     * The source element which will capture pointer events and initiate drag mode.
-     *
-     * @remarks
-     * By default that will be the host element itself, unless `trigger` is passed in.
-     */
-    private get _element();
-    /**
-     * The element being dragged.
-     *
-     * @remarks
-     * When in **deferred** mode this returns a reference to the drag ghost element,
-     * otherwise it is the host element.
-     */
-    private get _dragItem();
-    /**
-     * The DOM element that will "host" the ghost drag element when the controller
-     * is set to **deferred**.
-     *
-     * @remarks
-     * In **immediate** mode, this property is ignored.
-     */
-    private get _layer();
-    private get _stateParameters();
-    constructor(host: ReactiveControllerHost & LitElement, options?: DragControllerConfiguration);
-    /** Whether the drag controller is enabled. */
-    get enabled(): boolean;
-    /** Updates the drag controller configuration. */
-    set(options?: DragControllerConfiguration): void;
-    /** Stops any drag operation and cleans up state, additional event listeners and elements. */
-    dispose(): void;
-    /** @internal */
-    hostConnected(): void;
-    /** @internal */
-    hostDisconnected(): void;
-    /** @internal */
-    handleEvent(event: PointerEvent & KeyboardEvent): void;
-    private _handlePointerDown;
-    private _handlePointerMove;
-    private _handlePointerEnd;
-    private _handleCancel;
-    private _setDragCancelListener;
-    private _setInitialState;
-    private _setDragState;
-    /**
-     * Toggles text selection for the duration of a drag operation.
-     *
-     * @remarks
-     * Disabling `user-select` only on the dragged element is not enough, since browsers
-     * (notably Safari) will still create a text selection in whatever elements sit under
-     * the pointer while dragging. Applying it to the owner document's body prevents that
-     * across the page for the active drag and is reverted once the operation completes.
-     */
-    private _toggleTextSelection;
-    private _updateMatcher;
-    private _updatePosition;
-    private _updatePointerState;
-    private _assignPosition;
-    private _createDragGhost;
-    private _removeGhost;
-    private _shouldSkip;
-}
-/**
- * Adds a drag and drop controller to the given host
- */
-export declare function addDragController(host: ReactiveControllerHost & LitElement, options?: DragControllerConfiguration): DragController;
-export {};

package/internals/controllers/drag.js

@@ -1,283 +0,0 @@
-import { getDefaultLayer } from '../../components/resize-container/default-ghost.js';
-import { createAbortHandle } from '../abort-handler.js';
-import { getRoot, isLTR, roundByDPR, setStyles } from '../utils/dom.js';
-import { getElementFromPath } from '../utils/events.js';
-import { escapeKey, isKey } from './key-bindings.js';
-const additionalEvents = [
-    'pointermove',
-    'lostpointercapture',
-    'contextmenu',
-];
-class DragController {
-    get _hasSnapping() {
-        return Boolean(this._options.snapToCursor);
-    }
-    get _isDeferred() {
-        return this._options.mode === 'deferred';
-    }
-    get _element() {
-        return this._options.trigger?.() ?? this._host;
-    }
-    get _dragItem() {
-        return this._isDeferred ? this._ghost : this._host;
-    }
-    get _layer() {
-        if (!this._isDeferred) {
-            return this._host;
-        }
-        return this._options.layer?.() ?? this._host;
-    }
-    get _stateParameters() {
-        return {
-            ...this._state,
-            ghost: this._ghost,
-            element: this._matchedElement,
-        };
-    }
-    constructor(host, options) {
-        this._options = {
-            enabled: true,
-            mode: 'deferred',
-            snapToCursor: false,
-            layer: getDefaultLayer,
-        };
-        this._abortHandle = createAbortHandle();
-        this._id = -1;
-        this._hasPointerCapture = false;
-        this._ghost = null;
-        this._host = host;
-        this._host.addController(this);
-        this.set(options);
-    }
-    get enabled() {
-        return Boolean(this._options.enabled);
-    }
-    set(options) {
-        Object.assign(this._options, options);
-    }
-    dispose() {
-        this._matchedElement = null;
-        this._removeGhost();
-        this._setDragState(false);
-    }
-    hostConnected() {
-        const { signal } = this._abortHandle;
-        this._host.addEventListener('dragstart', this, { signal });
-        this._host.addEventListener('touchstart', this, { passive: false, signal });
-        this._host.addEventListener('pointerdown', this, { signal });
-    }
-    hostDisconnected() {
-        this._abortHandle.abort();
-        this._setDragCancelListener(false);
-        this._removeGhost();
-    }
-    handleEvent(event) {
-        if (!this.enabled) {
-            return;
-        }
-        switch (event.type) {
-            case 'touchstart':
-            case 'dragstart':
-            case 'contextmenu':
-                event.preventDefault();
-                break;
-            case 'keydown':
-                this._handleCancel(event);
-                break;
-            case 'pointerdown':
-                this._handlePointerDown(event);
-                break;
-            case 'pointermove':
-                this._handlePointerMove(event);
-                break;
-            case 'lostpointercapture':
-                this._handlePointerEnd(event);
-                break;
-        }
-    }
-    _handlePointerDown(event) {
-        if (this._shouldSkip(event)) {
-            return;
-        }
-        this._setInitialState(event);
-        this._createDragGhost();
-        this._updatePosition(event);
-        const parameters = {
-            event,
-            state: this._stateParameters,
-        };
-        if (this._options.start?.call(this._host, parameters) === false) {
-            this.dispose();
-            return;
-        }
-        this._assignPosition(this._dragItem);
-        this._setDragState();
-    }
-    _handlePointerMove(event) {
-        if (!this._hasPointerCapture) {
-            return;
-        }
-        this._updatePosition(event);
-        this._updatePointerState(event);
-        this._updateMatcher(event);
-        const parameters = {
-            event,
-            state: this._stateParameters,
-        };
-        this._options.move?.call(this._host, parameters);
-        this._assignPosition(this._dragItem);
-    }
-    _handlePointerEnd(event) {
-        this._options.end?.call(this._host, {
-            event,
-            state: this._stateParameters,
-        });
-        this.dispose();
-    }
-    _handleCancel(event) {
-        if (this._hasPointerCapture && isKey(event, escapeKey)) {
-            this._options.cancel?.call(this._host, this._stateParameters);
-        }
-    }
-    _setDragCancelListener(enabled = true) {
-        enabled
-            ? globalThis.addEventListener('keydown', this)
-            : globalThis.removeEventListener('keydown', this);
-    }
-    _setInitialState({ pointerId, clientX, clientY, }) {
-        const rect = this._host.getBoundingClientRect();
-        const position = { x: rect.x, y: rect.y };
-        const offset = { x: rect.x - clientX, y: rect.y - clientY };
-        this._id = pointerId;
-        this._state = {
-            initial: rect,
-            current: structuredClone(rect),
-            position,
-            offset,
-            pointerState: {
-                previous: { x: clientX, y: clientY },
-                current: { x: clientX, y: clientY },
-                direction: 'end',
-            },
-        };
-    }
-    _setDragState(enabled = true) {
-        this._hasPointerCapture = enabled;
-        const cssValue = enabled ? 'none' : '';
-        setStyles(this._element, {
-            touchAction: cssValue,
-            userSelect: cssValue,
-            webkitUserSelect: cssValue,
-        });
-        this._toggleTextSelection(enabled);
-        enabled
-            ? this._element.setPointerCapture(this._id)
-            : this._element.releasePointerCapture(this._id);
-        this._setDragCancelListener(enabled);
-        for (const type of additionalEvents) {
-            enabled
-                ? this._host.addEventListener(type, this)
-                : this._host.removeEventListener(type, this);
-        }
-    }
-    _toggleTextSelection(disabled) {
-        const value = disabled ? 'none' : '';
-        const { style } = this._host.ownerDocument.body;
-        style.userSelect = value;
-        style.webkitUserSelect = value;
-        if (disabled) {
-            this._host.ownerDocument.getSelection()?.removeAllRanges();
-        }
-    }
-    _updateMatcher(event) {
-        if (!this._options.matchTarget) {
-            return;
-        }
-        const match = getRoot(this._host)
-            .elementsFromPoint(event.clientX, event.clientY)
-            .find((element) => this._options.matchTarget.call(this._host, element));
-        if (match && !this._matchedElement) {
-            this._matchedElement = match;
-            this._options.enter?.call(this._host, {
-                event,
-                state: this._stateParameters,
-            });
-            return;
-        }
-        if (!match && this._matchedElement) {
-            this._options.leave?.call(this._host, {
-                event,
-                state: this._stateParameters,
-            });
-            this._matchedElement = null;
-            return;
-        }
-        if (match && match === this._matchedElement) {
-            this._options.over?.call(this._host, {
-                event,
-                state: this._stateParameters,
-            });
-        }
-    }
-    _updatePosition({ clientX, clientY }) {
-        const { x, y } = this._state.offset;
-        const { x: layerX, y: layerY } = this._isDeferred
-            ? this._layer.getBoundingClientRect()
-            : this._state.initial;
-        const posX = this._hasSnapping ? clientX - layerX : clientX - layerX + x;
-        const posY = this._hasSnapping ? clientY - layerY : clientY - layerY + y;
-        this._state.position = { x: posX, y: posY };
-    }
-    _updatePointerState({ clientX, clientY }) {
-        const state = this._state.pointerState;
-        state.previous = { ...state.current };
-        state.current = { x: clientX, y: clientY };
-        const dx = state.current.x - state.previous.x;
-        const dy = state.current.y - state.previous.y;
-        if (Math.abs(dx) >= Math.abs(dy)) {
-            const swapHorizontal = isLTR(this._host) ? dx >= 0 : dx <= 0;
-            state.direction = swapHorizontal ? 'end' : 'start';
-        }
-        else {
-            state.direction = dy >= 0 ? 'bottom' : 'top';
-        }
-    }
-    _assignPosition(element) {
-        element.style.transform = `translate3d(${roundByDPR(this._state.position.x)}px,${roundByDPR(this._state.position.y)}px,0)`;
-    }
-    _createDragGhost() {
-        if (!this._isDeferred) {
-            return;
-        }
-        this._ghost =
-            this._options.ghost?.call(this._host) ??
-                createDefaultDragGhost(this._host.getBoundingClientRect());
-        this._layer.append(this._ghost);
-    }
-    _removeGhost() {
-        this._ghost?.remove();
-        this._ghost = null;
-    }
-    _shouldSkip(event) {
-        return (Boolean(event.button) ||
-            this._options.skip?.call(this._host, event) ||
-            !getElementFromPath((e) => e === this._element, event));
-    }
-}
-function createDefaultDragGhost({ x, y, width, height }) {
-    const element = document.createElement('div');
-    setStyles(element, {
-        position: 'absolute',
-        left: `${x}px`,
-        top: `${y}px`,
-        width: `${width}px`,
-        height: `${height}px`,
-        zIndex: '1000',
-        background: 'gold',
-    });
-    return element;
-}
-export function addDragController(host, options) {
-    return new DragController(host, options);
-}
-//# sourceMappingURL=drag.js.map