igniteui-webcomponents 7.2.3 → 7.3.0-beta.0

package/components/theme-provider/theme-provider.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme-provider.js","sourceRoot":"","sources":["../../../src/components/theme-provider/theme-provider.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAC/C,OAAO,EACL,GAAG,EACH,IAAI,EACJ,UAAU,GAGX,MAAM,KAAK,CAAC;AACb,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAqB,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAE3E,OAAO,EAAE,iBAAiB,EAAE,MAAM,mCAAmC,CAAC;AAwCtE,MAAM,CAAC,OAAO,OAAO,yBAA0B,SAAQ,UAAU;IAAjE;;QAcmB,cAAS,GAAG,IAAI,eAAe,CAAC,IAAI,EAAE;YACrD,OAAO,EAAE,YAAY;SACtB,CAAC,CAAC;QASI,UAAK,GAAU,WAAW,CAAC;QAS3B,YAAO,GAAiB,OAAO,CAAC;IAoBzC,CAAC;aArDwB,YAAO,GAAG,oBAAoB,AAAvB,CAAwB;aAE/B,WAAM,GAAG,GAAG,CAAA;;;;GAIlC,AAJ4B,CAI3B;IAGK,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,yBAAyB,CAAC,CAAC;IAC/C,CAAC;IAwBkB,MAAM,CAAC,iBAAuC;QAC/D,IAAI,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,iBAAiB,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,CAAC;YACvE,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,IAAI,CAAC,gBAAgB,EAAE,CAAC,CAAC;QACnD,CAAC;QAED,KAAK,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC;IAClC,CAAC;IAEO,gBAAgB;QACtB,OAAO;YACL,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,OAAO,EAAE,IAAI,CAAC,OAAO;SACtB,CAAC;IACJ,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AA5BM;IADN,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wDACM;AAS3B;IADN,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0DACW","sourcesContent":["import { ContextProvider } from '@lit/context';\nimport {\n  css,\n  html,\n  LitElement,\n  type PropertyValues,\n  type TemplateResult,\n} from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { type ThemeContext, themeContext } from '../../theming/context.js';\nimport type { Theme, ThemeVariant } from '../../theming/types.js';\nimport { registerComponent } from '../common/definitions/register.js';\n\n/**\n * A theme provider component that uses Lit context to provide theme information\n * to descendant components.\n *\n * This component allows you to scope a theme to a specific part of the page.\n * All library components within this provider will use the specified theme\n * instead of the global theme.\n *\n * @element igc-theme-provider\n *\n * @slot - Default slot for content that should receive the provided theme.\n *\n * @remarks\n * When using the theme provider, it must be registered **before** any descendant components\n * that will consume the theme context. This ensures the context provider is available\n * when descendant components attempt to consume it.\n *\n * ```typescript\n * import { defineComponents, IgcThemeProviderComponent, IgcButtonComponent } from 'igniteui-webcomponents';\n *\n * // Register theme provider first, then descendant components\n * defineComponents(IgcThemeProviderComponent, IgcButtonComponent);\n * ```\n *\n * @example\n * ```html\n * <!-- Scope material theme to a section -->\n * <igc-theme-provider theme=\"material\" variant=\"dark\">\n *   <igc-button>Material Dark Button</igc-button>\n *   <igc-input label=\"Material Dark Input\"></igc-input>\n * </igc-theme-provider>\n *\n * <!-- Use different theme in another section -->\n * <igc-theme-provider theme=\"fluent\" variant=\"light\">\n *   <igc-button>Fluent Light Button</igc-button>\n * </igc-theme-provider>\n * ```\n */\nexport default class IgcThemeProviderComponent extends LitElement {\n  public static readonly tagName = 'igc-theme-provider';\n\n  public static override styles = css`\n    :host {\n      display: contents;\n    }\n  `;\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcThemeProviderComponent);\n  }\n\n  private readonly _provider = new ContextProvider(this, {\n    context: themeContext,\n  });\n\n  /**\n   * The theme to provide to descendant components.\n   *\n   * @attr\n   * @default 'bootstrap'\n   */\n  @property({ reflect: true })\n  public theme: Theme = 'bootstrap';\n\n  /**\n   * The theme variant to provide to descendant components.\n   *\n   * @attr\n   * @default 'light'\n   */\n  @property({ reflect: true })\n  public variant: ThemeVariant = 'light';\n\n  protected override update(changedProperties: PropertyValues<this>): void {\n    if (changedProperties.has('theme') || changedProperties.has('variant')) {\n      this._provider.setValue(this._getContextValue());\n    }\n\n    super.update(changedProperties);\n  }\n\n  private _getContextValue(): ThemeContext {\n    return {\n      theme: this.theme,\n      variant: this.variant,\n    };\n  }\n\n  protected override render(): TemplateResult {\n    return html`<slot></slot>`;\n  }\n}\n"]}
+{"version":3,"file":"theme-provider.js","sourceRoot":"","sources":["../../../src/components/theme-provider/theme-provider.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAC/C,OAAO,EACL,GAAG,EACH,IAAI,EACJ,UAAU,GAGX,MAAM,KAAK,CAAC;AACb,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AACvE,OAAO,EAAqB,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAyCtE,MAAM,CAAC,OAAO,OAAO,yBAA0B,SAAQ,UAAU;IAAjE;;QAcmB,cAAS,GAAG,IAAI,eAAe,CAAC,IAAI,EAAE;YACrD,OAAO,EAAE,YAAY;SACtB,CAAC,CAAC;QASI,UAAK,GAAU,WAAW,CAAC;QAS3B,YAAO,GAAiB,OAAO,CAAC;IAoBzC,CAAC;aArDwB,YAAO,GAAG,oBAAoB,AAAvB,CAAwB;aAE/B,WAAM,GAAG,GAAG,CAAA;;;;GAIlC,AAJ4B,CAI3B;IAGK,MAAM,CAAC,QAAQ;QACpB,iBAAiB,CAAC,yBAAyB,CAAC,CAAC;IAC/C,CAAC;IAwBkB,MAAM,CAAC,iBAAuC;QAC/D,IAAI,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,iBAAiB,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,CAAC;YACvE,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,IAAI,CAAC,gBAAgB,EAAE,CAAC,CAAC;QACnD,CAAC;QAED,KAAK,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC;IAClC,CAAC;IAEO,gBAAgB;QACtB,OAAO;YACL,KAAK,EAAE,IAAI,CAAC,KAAK;YACjB,OAAO,EAAE,IAAI,CAAC,OAAO;SACtB,CAAC;IACJ,CAAC;IAEkB,MAAM;QACvB,OAAO,IAAI,CAAA,eAAe,CAAC;IAC7B,CAAC;;AA5BM;IADN,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;wDACM;AAS3B;IADN,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0DACW","sourcesContent":["import { ContextProvider } from '@lit/context';\nimport {\n  css,\n  html,\n  LitElement,\n  type PropertyValues,\n  type TemplateResult,\n} from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { type ThemeContext, themeContext } from '#theming/context.js';\nimport type { Theme, ThemeVariant } from '#theming/types.js';\n\n/**\n * A theme provider component that uses Lit context to provide theme information\n * to descendant components.\n *\n * This component allows you to scope a theme to a specific part of the page.\n * All library components within this provider will use the specified theme\n * instead of the global theme.\n *\n * @element igc-theme-provider\n *\n * @slot - Default slot for content that should receive the provided theme.\n *\n * @remarks\n * When using the theme provider, it must be registered **before** any descendant components\n * that will consume the theme context. This ensures the context provider is available\n * when descendant components attempt to consume it.\n *\n * ```typescript\n * import { defineComponents, IgcThemeProviderComponent, IgcButtonComponent } from 'igniteui-webcomponents';\n *\n * // Register theme provider first, then descendant components\n * defineComponents(IgcThemeProviderComponent, IgcButtonComponent);\n * ```\n *\n * @example\n * ```html\n * <!-- Scope material theme to a section -->\n * <igc-theme-provider theme=\"material\" variant=\"dark\">\n *   <igc-button>Material Dark Button</igc-button>\n *   <igc-input label=\"Material Dark Input\"></igc-input>\n * </igc-theme-provider>\n *\n * <!-- Use different theme in another section -->\n * <igc-theme-provider theme=\"fluent\" variant=\"light\">\n *   <igc-button>Fluent Light Button</igc-button>\n * </igc-theme-provider>\n * ```\n */\nexport default class IgcThemeProviderComponent extends LitElement {\n  public static readonly tagName = 'igc-theme-provider';\n\n  public static override styles = css`\n    :host {\n      display: contents;\n    }\n  `;\n\n  /* blazorSuppress */\n  public static register(): void {\n    registerComponent(IgcThemeProviderComponent);\n  }\n\n  private readonly _provider = new ContextProvider(this, {\n    context: themeContext,\n  });\n\n  /**\n   * The theme to provide to descendant components.\n   *\n   * @attr\n   * @default 'bootstrap'\n   */\n  @property({ reflect: true })\n  public theme: Theme = 'bootstrap';\n\n  /**\n   * The theme variant to provide to descendant components.\n   *\n   * @attr\n   * @default 'light'\n   */\n  @property({ reflect: true })\n  public variant: ThemeVariant = 'light';\n\n  protected override update(changedProperties: PropertyValues<this>): void {\n    if (changedProperties.has('theme') || changedProperties.has('variant')) {\n      this._provider.setValue(this._getContextValue());\n    }\n\n    super.update(changedProperties);\n  }\n\n  private _getContextValue(): ThemeContext {\n    return {\n      theme: this.theme,\n      variant: this.variant,\n    };\n  }\n\n  protected override render(): TemplateResult {\n    return html`<slot></slot>`;\n  }\n}\n"]}

package/components/tile-manager/position.d.ts

@@ -1,5 +1,5 @@
-import type IgcTileComponent from './tile.js';
 import type IgcTileManagerComponent from './tile-manager.js';
+import type IgcTileComponent from './tile.js';
 declare class TilesState {
     private _nextEmptyPosition;
     manager: IgcTileManagerComponent;

package/components/tile-manager/position.js

@@ -1,4 +1,4 @@
-import { last, partition } from '../common/util.js';
+import { lastOf, partition } from '#internals/utils/arrays.js';
 class TilesState {
     get _tiles() {
         return Array.from(this.manager.querySelectorAll(':scope > igc-tile'));
@@ -78,7 +78,7 @@ class TileDragStack {
         this._stack = [];
     }
     peek() {
-        return last(this._stack).tile;
+        return lastOf(this._stack).tile;
     }
     pop() {
         return this._stack.pop();

package/components/tile-manager/position.js.map

@@ -1 +1 @@
-{"version":3,"file":"position.js","sourceRoot":"","sources":["../../../src/components/tile-manager/position.ts"],"names":[],"mappings":"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","sourcesContent":["import { last, partition } from '../common/util.js';\nimport type IgcTileComponent from './tile.js';\nimport type IgcTileManagerComponent from './tile-manager.js';\n\nclass TilesState {\n  private _nextEmptyPosition = 0;\n\n  public manager: IgcTileManagerComponent;\n\n  private get _tiles(): IgcTileComponent[] {\n    return Array.from(\n      this.manager.querySelectorAll<IgcTileComponent>(':scope > igc-tile')\n    );\n  }\n\n  /**\n   * Returns the current tiles of the tile manager sorted by their position.\n   */\n  public get tiles(): IgcTileComponent[] {\n    return this._tiles.toSorted((a, b) => a.position - b.position);\n  }\n\n  constructor(manager: IgcTileManagerComponent) {\n    this.manager = manager;\n  }\n\n  public assignPositions(): void {\n    let nextPosition = 0;\n    const [positionedTiles, nonPositionedTiles] = partition(\n      this._tiles,\n      (tile) => tile.position !== -1\n    );\n\n    positionedTiles.sort((a, b) => a.position - b.position);\n\n    for (const tile of positionedTiles) {\n      // Fill any unassigned slots before the next assigned tile's position\n      while (nextPosition < tile.position && nonPositionedTiles.length > 0) {\n        const nonPositionedTile = nonPositionedTiles.shift()!;\n        nonPositionedTile.position = nextPosition++;\n      }\n\n      tile.position = nextPosition;\n      nextPosition = tile.position + 1;\n    }\n\n    for (const tile of nonPositionedTiles) {\n      tile.position = nextPosition++;\n    }\n  }\n\n  /** Updates the default (manual) slot of the tile manager with the current tiles. */\n  public assignTiles(): void {\n    this.manager.renderRoot.querySelector('slot')!.assign(...this._tiles);\n  }\n\n  public add(tile: IgcTileComponent): void {\n    const tiles = this.tiles;\n\n    if (tile.position > -1) {\n      for (const each of tiles) {\n        if (each !== tile && each.position >= tile.position) {\n          each.position++;\n        }\n      }\n    } else {\n      const positionedTiles = this._tiles.filter((tile) => tile.position > -1);\n\n      tile.position =\n        positionedTiles.length > 1\n          ? Math.max(...positionedTiles.map((tile) => tile.position)) + 1\n          : this._nextEmptyPosition;\n\n      this._nextEmptyPosition += 1;\n    }\n  }\n\n  /**\n   * Checks and adjusts tile spans based on the column count of the tile manager.\n   */\n  public adjustTileGridPosition(): void {\n    const columnCount = this.manager.columnCount;\n\n    if (columnCount > 0) {\n      for (const tile of this.tiles) {\n        let colStart = tile.colStart || 0;\n        let colStartDelta = colStart > 0 ? 1 : 0;\n        const colSpan = tile.colSpan || 0;\n\n        if (colStart > columnCount) {\n          colStart = 0;\n          colStartDelta = 0;\n          tile.colStart = 0;\n        }\n\n        if (colStart + colSpan > columnCount) {\n          tile.colSpan = columnCount - colStart + colStartDelta;\n        }\n      }\n    }\n  }\n\n  public remove(tile: IgcTileComponent): void {\n    for (const each of this.tiles) {\n      if (each.position >= tile.position) {\n        each.position--;\n      }\n    }\n  }\n}\n\ntype TileDragStackEntry = {\n  tile: IgcTileComponent;\n  position: number;\n  column?: number | null;\n  row?: number | null;\n};\n\nclass TileDragStack {\n  private _stack: TileDragStackEntry[] = [];\n\n  public peek(): IgcTileComponent {\n    return last(this._stack).tile;\n  }\n\n  public pop(): TileDragStackEntry | undefined {\n    return this._stack.pop();\n  }\n\n  public push(tile: IgcTileComponent): void {\n    this._stack.push({\n      tile,\n      position: tile.position,\n      column: tile.colStart,\n      row: tile.rowStart,\n    });\n  }\n\n  public restore(): void {\n    for (const {\n      tile,\n      position,\n      column: colStart,\n      row: rowStart,\n    } of this._stack.toReversed()) {\n      Object.assign(tile, {\n        position,\n        colStart,\n        rowStart,\n      });\n    }\n  }\n\n  public reset(): void {\n    this._stack = [];\n  }\n}\n\nexport function createTilesState(manager: IgcTileManagerComponent) {\n  return new TilesState(manager);\n}\n\nexport function createTileDragStack(): TileDragStack {\n  return new TileDragStack();\n}\n\nexport function swapTiles(a: IgcTileComponent, b: IgcTileComponent): void {\n  [a.colStart, b.colStart] = [b.colStart, a.colStart];\n  [a.rowStart, b.rowStart] = [b.rowStart, a.colStart];\n  [a.position, b.position] = [b.position, a.position];\n}\n"]}
+{"version":3,"file":"position.js","sourceRoot":"","sources":["../../../src/components/tile-manager/position.ts"],"names":[],"mappings":"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","sourcesContent":["import { lastOf, partition } from '#internals/utils/arrays.js';\nimport type IgcTileManagerComponent from './tile-manager.js';\nimport type IgcTileComponent from './tile.js';\n\nclass TilesState {\n  private _nextEmptyPosition = 0;\n\n  public manager: IgcTileManagerComponent;\n\n  private get _tiles(): IgcTileComponent[] {\n    return Array.from(\n      this.manager.querySelectorAll<IgcTileComponent>(':scope > igc-tile')\n    );\n  }\n\n  /**\n   * Returns the current tiles of the tile manager sorted by their position.\n   */\n  public get tiles(): IgcTileComponent[] {\n    return this._tiles.toSorted((a, b) => a.position - b.position);\n  }\n\n  constructor(manager: IgcTileManagerComponent) {\n    this.manager = manager;\n  }\n\n  public assignPositions(): void {\n    let nextPosition = 0;\n    const [positionedTiles, nonPositionedTiles] = partition(\n      this._tiles,\n      (tile) => tile.position !== -1\n    );\n\n    positionedTiles.sort((a, b) => a.position - b.position);\n\n    for (const tile of positionedTiles) {\n      // Fill any unassigned slots before the next assigned tile's position\n      while (nextPosition < tile.position && nonPositionedTiles.length > 0) {\n        const nonPositionedTile = nonPositionedTiles.shift()!;\n        nonPositionedTile.position = nextPosition++;\n      }\n\n      tile.position = nextPosition;\n      nextPosition = tile.position + 1;\n    }\n\n    for (const tile of nonPositionedTiles) {\n      tile.position = nextPosition++;\n    }\n  }\n\n  /** Updates the default (manual) slot of the tile manager with the current tiles. */\n  public assignTiles(): void {\n    this.manager.renderRoot.querySelector('slot')!.assign(...this._tiles);\n  }\n\n  public add(tile: IgcTileComponent): void {\n    const tiles = this.tiles;\n\n    if (tile.position > -1) {\n      for (const each of tiles) {\n        if (each !== tile && each.position >= tile.position) {\n          each.position++;\n        }\n      }\n    } else {\n      const positionedTiles = this._tiles.filter((tile) => tile.position > -1);\n\n      tile.position =\n        positionedTiles.length > 1\n          ? Math.max(...positionedTiles.map((tile) => tile.position)) + 1\n          : this._nextEmptyPosition;\n\n      this._nextEmptyPosition += 1;\n    }\n  }\n\n  /**\n   * Checks and adjusts tile spans based on the column count of the tile manager.\n   */\n  public adjustTileGridPosition(): void {\n    const columnCount = this.manager.columnCount;\n\n    if (columnCount > 0) {\n      for (const tile of this.tiles) {\n        let colStart = tile.colStart || 0;\n        let colStartDelta = colStart > 0 ? 1 : 0;\n        const colSpan = tile.colSpan || 0;\n\n        if (colStart > columnCount) {\n          colStart = 0;\n          colStartDelta = 0;\n          tile.colStart = 0;\n        }\n\n        if (colStart + colSpan > columnCount) {\n          tile.colSpan = columnCount - colStart + colStartDelta;\n        }\n      }\n    }\n  }\n\n  public remove(tile: IgcTileComponent): void {\n    for (const each of this.tiles) {\n      if (each.position >= tile.position) {\n        each.position--;\n      }\n    }\n  }\n}\n\ntype TileDragStackEntry = {\n  tile: IgcTileComponent;\n  position: number;\n  column?: number | null;\n  row?: number | null;\n};\n\nclass TileDragStack {\n  private _stack: TileDragStackEntry[] = [];\n\n  public peek(): IgcTileComponent {\n    return lastOf(this._stack).tile;\n  }\n\n  public pop(): TileDragStackEntry | undefined {\n    return this._stack.pop();\n  }\n\n  public push(tile: IgcTileComponent): void {\n    this._stack.push({\n      tile,\n      position: tile.position,\n      column: tile.colStart,\n      row: tile.rowStart,\n    });\n  }\n\n  public restore(): void {\n    for (const {\n      tile,\n      position,\n      column: colStart,\n      row: rowStart,\n    } of this._stack.toReversed()) {\n      Object.assign(tile, {\n        position,\n        colStart,\n        rowStart,\n      });\n    }\n  }\n\n  public reset(): void {\n    this._stack = [];\n  }\n}\n\nexport function createTilesState(manager: IgcTileManagerComponent) {\n  return new TilesState(manager);\n}\n\nexport function createTileDragStack(): TileDragStack {\n  return new TileDragStack();\n}\n\nexport function swapTiles(a: IgcTileComponent, b: IgcTileComponent): void {\n  [a.colStart, b.colStart] = [b.colStart, a.colStart];\n  [a.rowStart, b.rowStart] = [b.rowStart, a.colStart];\n  [a.position, b.position] = [b.position, a.position];\n}\n"]}

package/components/tile-manager/resize-state.js

@@ -1,12 +1,13 @@
-import { asNumber, first } from '../common/util.js';
+import { firstOf } from '#internals/utils/arrays.js';
+import { asNumber } from '#internals/utils/math.js';
 import { ResizeUtil } from './resize-util.js';
 const CssValues = /(?<start>\d+)?\s*\/?\s*span\s*(?<span>\d+)?/gi;
 function parseTileGridRect(tile) {
     const computed = getComputedStyle(tile);
     const { gridColumn, gridRow } = computed;
     const [column, row] = [
-        first(Array.from(gridColumn.matchAll(CssValues))).groups,
-        first(Array.from(gridRow.matchAll(CssValues))).groups,
+        firstOf(Array.from(gridColumn.matchAll(CssValues))).groups,
+        firstOf(Array.from(gridRow.matchAll(CssValues))).groups,
     ];
     return {
         column: {

package/components/tile-manager/resize-state.js.map

@@ -1 +1 @@
-{"version":3,"file":"resize-state.js","sourceRoot":"","sources":["../../../src/components/tile-manager/resize-state.ts"],"names":[],"mappings":"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","sourcesContent":["import { asNumber, first } from '../common/util.js';\nimport type { ResizeState } from '../resize-container/types.js';\nimport { ResizeUtil } from './resize-util.js';\nimport type IgcTileComponent from './tile.js';\nimport type {\n  ResizeProps,\n  ResizeSpanProps,\n  TileGridDimension,\n  TileGridPosition,\n  TileResizeDimensions,\n} from './types.js';\n\nconst CssValues = /(?<start>\\d+)?\\s*\\/?\\s*span\\s*(?<span>\\d+)?/gi;\n\nfunction parseTileGridRect(tile: IgcTileComponent): TileGridPosition {\n  const computed = getComputedStyle(tile);\n  const { gridColumn, gridRow } = computed;\n\n  const [column, row] = [\n    first(Array.from(gridColumn.matchAll(CssValues))).groups!,\n    first(Array.from(gridRow.matchAll(CssValues))).groups!,\n  ];\n\n  return {\n    column: {\n      start: asNumber(column.start, -1),\n      span: asNumber(column.span, -1),\n    },\n    row: { start: asNumber(row.start, -1), span: asNumber(row.span, -1) },\n  };\n}\n\nfunction parseTileParentGrid(gridContainer: HTMLElement) {\n  const computed = getComputedStyle(gridContainer);\n  const { gap, gridTemplateColumns, gridTemplateRows } = computed;\n\n  const columns = gridTemplateColumns.split(' ').map(asNumber);\n  const rows = gridTemplateRows.split(' ').map(asNumber);\n\n  return {\n    gap: asNumber(gap),\n    columns: {\n      count: columns.length,\n      entries: columns,\n      minSize: asNumber(computed.getPropertyValue('--min-col-width')),\n    },\n    rows: {\n      count: rows.length,\n      entries: rows,\n      minSize: asNumber(computed.getPropertyValue('--min-row-height')),\n    },\n  };\n}\n\nclass TileResizeState {\n  private _initialPosition!: TileGridPosition;\n  private _resizeUtil!: ResizeUtil;\n\n  protected _gap = 0;\n  protected _prevDeltaX = 0;\n  protected _prevDeltaY = 0;\n\n  protected _prevSnappedWidth = 0;\n  protected _prevSnappedHeight = 0;\n\n  protected _position: TileGridPosition = {\n    column: { start: 0, span: 0 },\n    row: { start: 0, span: 0 },\n  };\n\n  protected _columns: TileGridDimension = {\n    count: 0,\n    entries: [],\n    minSize: 0,\n  };\n\n  protected _rows: TileGridDimension = {\n    count: 0,\n    entries: [],\n    minSize: 0,\n  };\n\n  public resizedDimensions: TileResizeDimensions = {\n    width: null,\n    height: null,\n  };\n\n  public get gap(): number {\n    return this._gap;\n  }\n\n  public get position(): TileGridPosition {\n    return structuredClone(this._position);\n  }\n\n  public get columns(): TileGridDimension {\n    return structuredClone(this._columns);\n  }\n\n  public get rows(): TileGridDimension {\n    return structuredClone(this._rows);\n  }\n\n  public calculateSnappedWidth(state: ResizeState): number {\n    const resizeProps = this.getResizeProps(state);\n    const snappedDimension =\n      this._resizeUtil.calculateSnappedDimension(resizeProps);\n\n    this._prevDeltaX = snappedDimension.newDelta;\n    this._prevSnappedWidth = snappedDimension.snappedSize;\n    return snappedDimension.snappedSize;\n  }\n\n  public calculateSnappedHeight(state: ResizeState): number {\n    const resizeProps = this.getResizeProps(state, true);\n    const snappedDimension =\n      this._resizeUtil.calculateSnappedDimension(resizeProps);\n\n    this._prevDeltaY = snappedDimension.newDelta;\n    this._prevSnappedHeight = snappedDimension.snappedSize;\n    return snappedDimension.snappedSize;\n  }\n\n  public updateState(\n    tileRect: DOMRect,\n    tile: IgcTileComponent,\n    grid: HTMLElement\n  ): void {\n    this.initState(grid, tile);\n    this.calculateTileStartPosition(grid, tileRect);\n  }\n\n  /**\n   * Calculates and returns the CSS column and row properties of a tile after resizing,\n   * based on its new dimensions and starting position.\n   */\n  public calculateResizedGridPosition(rect: DOMRect) {\n    const colProps = this.getResizeSpanProps(rect);\n    const rowProps = this.getResizeSpanProps(rect, true);\n\n    // REVIEW pass col minSize and allowOverflow?\n    this._position.column.span =\n      this._resizeUtil.calculateResizedSpan(colProps);\n    this._position.row.span = this._resizeUtil.calculateResizedSpan(rowProps);\n\n    return {\n      colSpan: this._position.column.span,\n      rowSpan: this._position.row.span,\n    };\n  }\n\n  private initState(grid: HTMLElement, tile: IgcTileComponent): void {\n    const { gap, columns, rows } = parseTileParentGrid(grid);\n\n    this._resizeUtil = new ResizeUtil(gap);\n    this._initialPosition = parseTileGridRect(tile);\n    this._position = structuredClone(this._initialPosition);\n\n    this._gap = gap;\n    this._columns = columns;\n    this._rows = rows;\n    this._prevDeltaX = 0;\n    this._prevDeltaY = 0;\n    this._prevSnappedWidth = 0;\n    this._prevSnappedHeight = 0;\n  }\n\n  private calculateTileStartPosition(\n    grid: HTMLElement,\n    tileRect: DOMRect\n  ): void {\n    if (this._position.column.start < 0) {\n      const offsetX = this.getGridOffset(grid, 'horizontal');\n\n      this._position.column.start = this._resizeUtil.calculatePosition(\n        tileRect.left + window.scrollX + grid.scrollLeft - offsetX,\n        this._columns.entries\n      );\n    }\n\n    if (this._position.row.start < 0) {\n      const offsetY = this.getGridOffset(grid, 'vertical');\n\n      this._position.row.start = this._resizeUtil.calculatePosition(\n        tileRect.top + window.scrollY - offsetY,\n        this._rows.entries\n      );\n    }\n  }\n\n  private getGridOffset(\n    grid: HTMLElement,\n    axis: 'horizontal' | 'vertical'\n  ): number {\n    const gridRect = grid.getBoundingClientRect();\n    const computed = getComputedStyle(grid);\n\n    return axis === 'horizontal'\n      ? gridRect.left +\n          window.scrollX +\n          grid.scrollLeft +\n          Number.parseFloat(computed.paddingLeft)\n      : gridRect.top + window.scrollY + Number.parseFloat(computed.paddingTop);\n  }\n\n  private getResizeProps(state: ResizeState, isRow = false): ResizeProps {\n    return isRow\n      ? {\n          currentDelta: state.deltaY,\n          currentSize: state.current.height,\n          prevDelta: this._prevDeltaY,\n          gridEntries: this._rows.entries,\n          startIndex: this._position.row.start,\n          prevSnapped: this._prevSnappedHeight,\n        }\n      : {\n          currentDelta: state.deltaX,\n          currentSize: state.current.width,\n          prevDelta: this._prevDeltaX,\n          gridEntries: this._columns.entries,\n          startIndex: this._position.column.start,\n          prevSnapped: this._prevSnappedWidth,\n        };\n  }\n\n  private getResizeSpanProps(rect: DOMRect, isRow = false): ResizeSpanProps {\n    return isRow\n      ? {\n          targetSize: rect.height,\n          tilePosition: this.position.row,\n          tileGridDimension: this.rows,\n          gap: this.gap,\n          isRow,\n        }\n      : {\n          targetSize: rect.width,\n          tilePosition: this.position.column,\n          tileGridDimension: this.columns,\n          gap: this.gap,\n          isRow,\n        };\n  }\n}\n\nexport function createTileResizeState(): TileResizeState {\n  return new TileResizeState();\n}\n"]}
+{"version":3,"file":"resize-state.js","sourceRoot":"","sources":["../../../src/components/tile-manager/resize-state.ts"],"names":[],"mappings":"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","sourcesContent":["import { firstOf } from '#internals/utils/arrays.js';\nimport { asNumber } from '#internals/utils/math.js';\nimport type { ResizeState } from '../resize-container/types.js';\nimport { ResizeUtil } from './resize-util.js';\nimport type IgcTileComponent from './tile.js';\nimport type {\n  ResizeProps,\n  ResizeSpanProps,\n  TileGridDimension,\n  TileGridPosition,\n  TileResizeDimensions,\n} from './types.js';\n\nconst CssValues = /(?<start>\\d+)?\\s*\\/?\\s*span\\s*(?<span>\\d+)?/gi;\n\nfunction parseTileGridRect(tile: IgcTileComponent): TileGridPosition {\n  const computed = getComputedStyle(tile);\n  const { gridColumn, gridRow } = computed;\n\n  const [column, row] = [\n    firstOf(Array.from(gridColumn.matchAll(CssValues))).groups!,\n    firstOf(Array.from(gridRow.matchAll(CssValues))).groups!,\n  ];\n\n  return {\n    column: {\n      start: asNumber(column.start, -1),\n      span: asNumber(column.span, -1),\n    },\n    row: { start: asNumber(row.start, -1), span: asNumber(row.span, -1) },\n  };\n}\n\nfunction parseTileParentGrid(gridContainer: HTMLElement) {\n  const computed = getComputedStyle(gridContainer);\n  const { gap, gridTemplateColumns, gridTemplateRows } = computed;\n\n  const columns = gridTemplateColumns.split(' ').map(asNumber);\n  const rows = gridTemplateRows.split(' ').map(asNumber);\n\n  return {\n    gap: asNumber(gap),\n    columns: {\n      count: columns.length,\n      entries: columns,\n      minSize: asNumber(computed.getPropertyValue('--min-col-width')),\n    },\n    rows: {\n      count: rows.length,\n      entries: rows,\n      minSize: asNumber(computed.getPropertyValue('--min-row-height')),\n    },\n  };\n}\n\nclass TileResizeState {\n  private _initialPosition!: TileGridPosition;\n  private _resizeUtil!: ResizeUtil;\n\n  protected _gap = 0;\n  protected _prevDeltaX = 0;\n  protected _prevDeltaY = 0;\n\n  protected _prevSnappedWidth = 0;\n  protected _prevSnappedHeight = 0;\n\n  protected _position: TileGridPosition = {\n    column: { start: 0, span: 0 },\n    row: { start: 0, span: 0 },\n  };\n\n  protected _columns: TileGridDimension = {\n    count: 0,\n    entries: [],\n    minSize: 0,\n  };\n\n  protected _rows: TileGridDimension = {\n    count: 0,\n    entries: [],\n    minSize: 0,\n  };\n\n  public resizedDimensions: TileResizeDimensions = {\n    width: null,\n    height: null,\n  };\n\n  public get gap(): number {\n    return this._gap;\n  }\n\n  public get position(): TileGridPosition {\n    return structuredClone(this._position);\n  }\n\n  public get columns(): TileGridDimension {\n    return structuredClone(this._columns);\n  }\n\n  public get rows(): TileGridDimension {\n    return structuredClone(this._rows);\n  }\n\n  public calculateSnappedWidth(state: ResizeState): number {\n    const resizeProps = this.getResizeProps(state);\n    const snappedDimension =\n      this._resizeUtil.calculateSnappedDimension(resizeProps);\n\n    this._prevDeltaX = snappedDimension.newDelta;\n    this._prevSnappedWidth = snappedDimension.snappedSize;\n    return snappedDimension.snappedSize;\n  }\n\n  public calculateSnappedHeight(state: ResizeState): number {\n    const resizeProps = this.getResizeProps(state, true);\n    const snappedDimension =\n      this._resizeUtil.calculateSnappedDimension(resizeProps);\n\n    this._prevDeltaY = snappedDimension.newDelta;\n    this._prevSnappedHeight = snappedDimension.snappedSize;\n    return snappedDimension.snappedSize;\n  }\n\n  public updateState(\n    tileRect: DOMRect,\n    tile: IgcTileComponent,\n    grid: HTMLElement\n  ): void {\n    this.initState(grid, tile);\n    this.calculateTileStartPosition(grid, tileRect);\n  }\n\n  /**\n   * Calculates and returns the CSS column and row properties of a tile after resizing,\n   * based on its new dimensions and starting position.\n   */\n  public calculateResizedGridPosition(rect: DOMRect) {\n    const colProps = this.getResizeSpanProps(rect);\n    const rowProps = this.getResizeSpanProps(rect, true);\n\n    // REVIEW pass col minSize and allowOverflow?\n    this._position.column.span =\n      this._resizeUtil.calculateResizedSpan(colProps);\n    this._position.row.span = this._resizeUtil.calculateResizedSpan(rowProps);\n\n    return {\n      colSpan: this._position.column.span,\n      rowSpan: this._position.row.span,\n    };\n  }\n\n  private initState(grid: HTMLElement, tile: IgcTileComponent): void {\n    const { gap, columns, rows } = parseTileParentGrid(grid);\n\n    this._resizeUtil = new ResizeUtil(gap);\n    this._initialPosition = parseTileGridRect(tile);\n    this._position = structuredClone(this._initialPosition);\n\n    this._gap = gap;\n    this._columns = columns;\n    this._rows = rows;\n    this._prevDeltaX = 0;\n    this._prevDeltaY = 0;\n    this._prevSnappedWidth = 0;\n    this._prevSnappedHeight = 0;\n  }\n\n  private calculateTileStartPosition(\n    grid: HTMLElement,\n    tileRect: DOMRect\n  ): void {\n    if (this._position.column.start < 0) {\n      const offsetX = this.getGridOffset(grid, 'horizontal');\n\n      this._position.column.start = this._resizeUtil.calculatePosition(\n        tileRect.left + window.scrollX + grid.scrollLeft - offsetX,\n        this._columns.entries\n      );\n    }\n\n    if (this._position.row.start < 0) {\n      const offsetY = this.getGridOffset(grid, 'vertical');\n\n      this._position.row.start = this._resizeUtil.calculatePosition(\n        tileRect.top + window.scrollY - offsetY,\n        this._rows.entries\n      );\n    }\n  }\n\n  private getGridOffset(\n    grid: HTMLElement,\n    axis: 'horizontal' | 'vertical'\n  ): number {\n    const gridRect = grid.getBoundingClientRect();\n    const computed = getComputedStyle(grid);\n\n    return axis === 'horizontal'\n      ? gridRect.left +\n          window.scrollX +\n          grid.scrollLeft +\n          Number.parseFloat(computed.paddingLeft)\n      : gridRect.top + window.scrollY + Number.parseFloat(computed.paddingTop);\n  }\n\n  private getResizeProps(state: ResizeState, isRow = false): ResizeProps {\n    return isRow\n      ? {\n          currentDelta: state.deltaY,\n          currentSize: state.current.height,\n          prevDelta: this._prevDeltaY,\n          gridEntries: this._rows.entries,\n          startIndex: this._position.row.start,\n          prevSnapped: this._prevSnappedHeight,\n        }\n      : {\n          currentDelta: state.deltaX,\n          currentSize: state.current.width,\n          prevDelta: this._prevDeltaX,\n          gridEntries: this._columns.entries,\n          startIndex: this._position.column.start,\n          prevSnapped: this._prevSnappedWidth,\n        };\n  }\n\n  private getResizeSpanProps(rect: DOMRect, isRow = false): ResizeSpanProps {\n    return isRow\n      ? {\n          targetSize: rect.height,\n          tilePosition: this.position.row,\n          tileGridDimension: this.rows,\n          gap: this.gap,\n          isRow,\n        }\n      : {\n          targetSize: rect.width,\n          tilePosition: this.position.column,\n          tileGridDimension: this.columns,\n          gap: this.gap,\n          isRow,\n        };\n  }\n}\n\nexport function createTileResizeState(): TileResizeState {\n  return new TileResizeState();\n}\n"]}

package/components/tile-manager/themes/container.d.ts

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

package/components/tile-manager/themes/container.js.map

@@ -1 +1 @@
-{"version":3,"file":"container.js","sourceRoot":"","sources":["../../../../src/components/tile-manager/themes/container.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAI1B,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,sCAAsC,CAAC;AAC/E,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,mCAAmC,CAAC;AACzE,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,mCAAmC,CAAC;AACzE,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,qCAAqC,CAAC;AAC7E,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAEzE,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,uCAAuC,CAAC;AACjF,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAC;AAC3E,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAC;AAC3E,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,sCAAsC,CAAC;AAC/E,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAC;AAI3E,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/tile-manager.bootstrap.css.js';\nimport { styles as fluentDark } from './dark/tile-manager.fluent.css.js';\nimport { styles as indigoDark } from './dark/tile-manager.indigo.css.js';\nimport { styles as materialDark } from './dark/tile-manager.material.css.js';\nimport { styles as sharedDark } from './dark/tile-manager.shared.css.js';\n// Light Overrides\nimport { styles as bootstrapLight } from './light/tile-manager.bootstrap.css.js';\nimport { styles as fluentLight } from './light/tile-manager.fluent.css.js';\nimport { styles as indigoLight } from './light/tile-manager.indigo.css.js';\nimport { styles as materialLight } from './light/tile-manager.material.css.js';\nimport { styles as sharedLight } from './light/tile-manager.shared.css.js';\n\n// Shared Styles\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"]}
+{"version":3,"file":"container.js","sourceRoot":"","sources":["../../../../src/components/tile-manager/themes/container.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAI1B,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,sCAAsC,CAAC;AAC/E,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,mCAAmC,CAAC;AACzE,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,mCAAmC,CAAC;AACzE,OAAO,EAAE,MAAM,IAAI,YAAY,EAAE,MAAM,qCAAqC,CAAC;AAC7E,OAAO,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAEzE,OAAO,EAAE,MAAM,IAAI,cAAc,EAAE,MAAM,uCAAuC,CAAC;AACjF,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAC;AAC3E,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAC;AAC3E,OAAO,EAAE,MAAM,IAAI,aAAa,EAAE,MAAM,sCAAsC,CAAC;AAC/E,OAAO,EAAE,MAAM,IAAI,WAAW,EAAE,MAAM,oCAAoC,CAAC;AAI3E,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/tile-manager.bootstrap.css.js';\nimport { styles as fluentDark } from './dark/tile-manager.fluent.css.js';\nimport { styles as indigoDark } from './dark/tile-manager.indigo.css.js';\nimport { styles as materialDark } from './dark/tile-manager.material.css.js';\nimport { styles as sharedDark } from './dark/tile-manager.shared.css.js';\n// Light Overrides\nimport { styles as bootstrapLight } from './light/tile-manager.bootstrap.css.js';\nimport { styles as fluentLight } from './light/tile-manager.fluent.css.js';\nimport { styles as indigoLight } from './light/tile-manager.indigo.css.js';\nimport { styles as materialLight } from './light/tile-manager.material.css.js';\nimport { styles as sharedLight } from './light/tile-manager.shared.css.js';\n\n// Shared Styles\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/tile-manager/themes/tile.d.ts

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

package/components/tile-manager/themes/tile.js.map

@@ -1 +1 @@
-{"version":3,"file":"tile.js","sourceRoot":"","sources":["../../../../src/components/tile-manager/themes/tile.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAI1B,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAC1E,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,kCAAkC,CAAC;AAEpE,MAAM,KAAK,GAAG;IACZ,SAAS,EAAE,GAAG,CAAA;MACV,SAAS;GACZ;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM;GACT;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM;GACT;CACF,CAAC;AAEF,MAAM,IAAI,GAAG;IACX,SAAS,EAAE,GAAG,CAAA;MACV,SAAS;GACZ;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM;GACT;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM;GACT;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// Shared Styles\nimport { styles as bootstrap } from './shared/tile/tile.bootstrap.css.js';\nimport { styles as fluent } from './shared/tile/tile.fluent.css.js';\nimport { styles as indigo } from './shared/tile/tile.indigo.css.js';\n\nconst light = {\n  bootstrap: css`\n    ${bootstrap}\n  `,\n  fluent: css`\n    ${fluent}\n  `,\n  indigo: css`\n    ${indigo}\n  `,\n};\n\nconst dark = {\n  bootstrap: css`\n    ${bootstrap}\n  `,\n  fluent: css`\n    ${fluent}\n  `,\n  indigo: css`\n    ${indigo}\n  `,\n};\n\nexport const all: Themes = { light, dark };\n"]}
+{"version":3,"file":"tile.js","sourceRoot":"","sources":["../../../../src/components/tile-manager/themes/tile.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAI1B,OAAO,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAC1E,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,kCAAkC,CAAC;AACpE,OAAO,EAAE,MAAM,IAAI,MAAM,EAAE,MAAM,kCAAkC,CAAC;AAEpE,MAAM,KAAK,GAAG;IACZ,SAAS,EAAE,GAAG,CAAA;MACV,SAAS;GACZ;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM;GACT;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM;GACT;CACF,CAAC;AAEF,MAAM,IAAI,GAAG;IACX,SAAS,EAAE,GAAG,CAAA;MACV,SAAS;GACZ;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM;GACT;IACD,MAAM,EAAE,GAAG,CAAA;MACP,MAAM;GACT;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// Shared Styles\nimport { styles as bootstrap } from './shared/tile/tile.bootstrap.css.js';\nimport { styles as fluent } from './shared/tile/tile.fluent.css.js';\nimport { styles as indigo } from './shared/tile/tile.indigo.css.js';\n\nconst light = {\n  bootstrap: css`\n    ${bootstrap}\n  `,\n  fluent: css`\n    ${fluent}\n  `,\n  indigo: css`\n    ${indigo}\n  `,\n};\n\nconst dark = {\n  bootstrap: css`\n    ${bootstrap}\n  `,\n  fluent: css`\n    ${fluent}\n  `,\n  indigo: css`\n    ${indigo}\n  `,\n};\n\nexport const all: Themes = { light, dark };\n"]}

package/components/tile-manager/tile-ghost-util.js

@@ -1,4 +1,4 @@
-import { isLTR } from '../common/util.js';
+import { isLTR } from '#internals/utils/dom.js';
 export function createTileDragGhost(tile) {
     const clone = tile.cloneNode(true);
     const computed = getComputedStyle(tile);

package/components/tile-manager/tile-ghost-util.js.map

@@ -1 +1 @@
-{"version":3,"file":"tile-ghost-util.js","sourceRoot":"","sources":["../../../src/components/tile-manager/tile-ghost-util.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAG1C,MAAM,UAAU,mBAAmB,CAAC,IAAsB;IACxD,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAqB,CAAC;IACvD,MAAM,QAAQ,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAExC,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC;IAEvD,MAAM,CAAC,MAAM,CAAC,KAAK,EAAE;QACnB,EAAE,EAAE,IAAI;QACR,KAAK,EAAE,IAAI;QACX,QAAQ,EAAE,CAAC,CAAC;KACb,CAAC,CAAC;IAEH,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE;QACzB,SAAS,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK;QACtC,QAAQ,EAAE,UAAU;QACpB,OAAO,EAAE,QAAQ;QACjB,GAAG,EAAE,CAAC;QACN,IAAI,EAAE,CAAC;QACP,KAAK,EAAE,GAAG,KAAK,IAAI;QACnB,MAAM,EAAE,GAAG,MAAM,IAAI;QACrB,OAAO,EAAE,GAAG;QACZ,UAAU,EAAE,QAAQ,CAAC,gBAAgB,CAAC,mBAAmB,CAAC;QAC1D,MAAM,EAAE,aAAa,QAAQ,CAAC,gBAAgB,CAAC,sBAAsB,CAAC,EAAE;QACxE,YAAY,EAAE,QAAQ,CAAC,gBAAgB,CAAC,iBAAiB,CAAC;QAC1D,SAAS,EAAE,QAAQ,CAAC,gBAAgB,CAAC,kBAAkB,CAAC;QACxD,MAAM,EAAE,IAAI;QACZ,kBAAkB,EAAE,oBAAoB;KACzC,CAAC,CAAC;IAEH,OAAO,KAAK,CAAC;AACf,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,IAAsB;IACpD,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,QAAQ,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAC;IACxC,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC;IAC7D,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,MAAM,CAAC;IAEpC,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE;QAC3B,SAAS,EAAE,YAAY;QACvB,QAAQ,EAAE,UAAU;QACpB,OAAO,EAAE,QAAQ;QACjB,GAAG,EAAE,GAAG,CAAC,GAAG,OAAO,IAAI;QACvB,IAAI,EAAE,GAAG,CAAC,GAAG,OAAO,IAAI;QACxB,MAAM,EAAE,IAAI;QACZ,UAAU,EAAE,QAAQ,CAAC,gBAAgB,CAAC,0BAA0B,CAAC;QACjE,MAAM,EAAE,aAAa,QAAQ,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,EAAE;QAClE,YAAY,EAAE,QAAQ,CAAC,gBAAgB,CAAC,iBAAiB,CAAC;QAC1D,KAAK,EAAE,GAAG,KAAK,IAAI;QACnB,MAAM,EAAE,GAAG,MAAM,IAAI;KACtB,CAAC,CAAC;IAEH,OAAO,OAAO,CAAC;AACjB,CAAC","sourcesContent":["import { isLTR } from '../common/util.js';\nimport type IgcTileComponent from './tile.js';\n\nexport function createTileDragGhost(tile: IgcTileComponent): IgcTileComponent {\n  const clone = tile.cloneNode(true) as IgcTileComponent;\n  const computed = getComputedStyle(tile);\n\n  const { width, height } = tile.getBoundingClientRect();\n\n  Object.assign(clone, {\n    id: null,\n    inert: true,\n    position: -1,\n  });\n\n  Object.assign(clone.style, {\n    direction: isLTR(tile) ? 'ltr' : 'rtl',\n    position: 'absolute',\n    contain: 'strict',\n    top: 0,\n    left: 0,\n    width: `${width}px`,\n    height: `${height}px`,\n    opacity: 0.6,\n    background: computed.getPropertyValue('--tile-background'),\n    border: `1px solid ${computed.getPropertyValue('--hover-border-color')}`,\n    borderRadius: computed.getPropertyValue('--border-radius'),\n    boxShadow: computed.getPropertyValue('--drag-elevation'),\n    zIndex: 1000,\n    viewTransitionName: 'dragged-tile-ghost',\n  });\n\n  return clone;\n}\n\nexport function createTileGhost(tile: IgcTileComponent): HTMLElement {\n  const element = document.createElement('div');\n  const computed = getComputedStyle(tile);\n  const { x, y, width, height } = tile.getBoundingClientRect();\n  const { scrollX, scrollY } = window;\n\n  Object.assign(element.style, {\n    boxSizing: 'border-box',\n    position: 'absolute',\n    contain: 'strict',\n    top: `${y + scrollY}px`,\n    left: `${x + scrollX}px`,\n    zIndex: 1000,\n    background: computed.getPropertyValue('--placeholder-background'),\n    border: `1px solid ${computed.getPropertyValue('--ghost-border')}`,\n    borderRadius: computed.getPropertyValue('--border-radius'),\n    width: `${width}px`,\n    height: `${height}px`,\n  });\n\n  return element;\n}\n"]}
+{"version":3,"file":"tile-ghost-util.js","sourceRoot":"","sources":["../../../src/components/tile-manager/tile-ghost-util.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAGhD,MAAM,UAAU,mBAAmB,CAAC,IAAsB;IACxD,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAqB,CAAC;IACvD,MAAM,QAAQ,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAExC,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC;IAEvD,MAAM,CAAC,MAAM,CAAC,KAAK,EAAE;QACnB,EAAE,EAAE,IAAI;QACR,KAAK,EAAE,IAAI;QACX,QAAQ,EAAE,CAAC,CAAC;KACb,CAAC,CAAC;IAEH,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,KAAK,EAAE;QACzB,SAAS,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK;QACtC,QAAQ,EAAE,UAAU;QACpB,OAAO,EAAE,QAAQ;QACjB,GAAG,EAAE,CAAC;QACN,IAAI,EAAE,CAAC;QACP,KAAK,EAAE,GAAG,KAAK,IAAI;QACnB,MAAM,EAAE,GAAG,MAAM,IAAI;QACrB,OAAO,EAAE,GAAG;QACZ,UAAU,EAAE,QAAQ,CAAC,gBAAgB,CAAC,mBAAmB,CAAC;QAC1D,MAAM,EAAE,aAAa,QAAQ,CAAC,gBAAgB,CAAC,sBAAsB,CAAC,EAAE;QACxE,YAAY,EAAE,QAAQ,CAAC,gBAAgB,CAAC,iBAAiB,CAAC;QAC1D,SAAS,EAAE,QAAQ,CAAC,gBAAgB,CAAC,kBAAkB,CAAC;QACxD,MAAM,EAAE,IAAI;QACZ,kBAAkB,EAAE,oBAAoB;KACzC,CAAC,CAAC;IAEH,OAAO,KAAK,CAAC;AACf,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,IAAsB;IACpD,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,QAAQ,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAC;IACxC,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC;IAC7D,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,MAAM,CAAC;IAEpC,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE;QAC3B,SAAS,EAAE,YAAY;QACvB,QAAQ,EAAE,UAAU;QACpB,OAAO,EAAE,QAAQ;QACjB,GAAG,EAAE,GAAG,CAAC,GAAG,OAAO,IAAI;QACvB,IAAI,EAAE,GAAG,CAAC,GAAG,OAAO,IAAI;QACxB,MAAM,EAAE,IAAI;QACZ,UAAU,EAAE,QAAQ,CAAC,gBAAgB,CAAC,0BAA0B,CAAC;QACjE,MAAM,EAAE,aAAa,QAAQ,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,EAAE;QAClE,YAAY,EAAE,QAAQ,CAAC,gBAAgB,CAAC,iBAAiB,CAAC;QAC1D,KAAK,EAAE,GAAG,KAAK,IAAI;QACnB,MAAM,EAAE,GAAG,MAAM,IAAI;KACtB,CAAC,CAAC;IAEH,OAAO,OAAO,CAAC;AACjB,CAAC","sourcesContent":["import { isLTR } from '#internals/utils/dom.js';\nimport type IgcTileComponent from './tile.js';\n\nexport function createTileDragGhost(tile: IgcTileComponent): IgcTileComponent {\n  const clone = tile.cloneNode(true) as IgcTileComponent;\n  const computed = getComputedStyle(tile);\n\n  const { width, height } = tile.getBoundingClientRect();\n\n  Object.assign(clone, {\n    id: null,\n    inert: true,\n    position: -1,\n  });\n\n  Object.assign(clone.style, {\n    direction: isLTR(tile) ? 'ltr' : 'rtl',\n    position: 'absolute',\n    contain: 'strict',\n    top: 0,\n    left: 0,\n    width: `${width}px`,\n    height: `${height}px`,\n    opacity: 0.6,\n    background: computed.getPropertyValue('--tile-background'),\n    border: `1px solid ${computed.getPropertyValue('--hover-border-color')}`,\n    borderRadius: computed.getPropertyValue('--border-radius'),\n    boxShadow: computed.getPropertyValue('--drag-elevation'),\n    zIndex: 1000,\n    viewTransitionName: 'dragged-tile-ghost',\n  });\n\n  return clone;\n}\n\nexport function createTileGhost(tile: IgcTileComponent): HTMLElement {\n  const element = document.createElement('div');\n  const computed = getComputedStyle(tile);\n  const { x, y, width, height } = tile.getBoundingClientRect();\n  const { scrollX, scrollY } = window;\n\n  Object.assign(element.style, {\n    boxSizing: 'border-box',\n    position: 'absolute',\n    contain: 'strict',\n    top: `${y + scrollY}px`,\n    left: `${x + scrollX}px`,\n    zIndex: 1000,\n    background: computed.getPropertyValue('--placeholder-background'),\n    border: `1px solid ${computed.getPropertyValue('--ghost-border')}`,\n    borderRadius: computed.getPropertyValue('--border-radius'),\n    width: `${width}px`,\n    height: `${height}px`,\n  });\n\n  return element;\n}\n"]}

package/components/tile-manager/tile-manager.d.ts

@@ -6,7 +6,7 @@ import IgcTileComponent from './tile.js';
  *
  * @element igc-tile-manager
  *
- * @slot - Default slot for the tile manager. Only `igc-tile` elements will be projected inside the CSS grid container.
+ * @slot - Default slot for the tile manager. Only tile elements will be projected inside the CSS grid container.
  *
  * @csspart base - The tile manager CSS Grid container.
  *

package/components/tile-manager/tile-manager.js

@@ -10,13 +10,13 @@ import { html, LitElement } from 'lit';
 import { property } from 'lit/decorators.js';
 import { createRef, ref } from 'lit/directives/ref.js';
 import { styleMap } from 'lit/directives/style-map.js';
-import { addThemingController } from '../../theming/theming-controller.js';
-import { tileManagerContext, } from '../common/context.js';
-import { createMutationController, } from '../common/controllers/mutation-observer.js';
-import { shadowOptions } from '../common/decorators/shadow-options.js';
-import { registerComponent } from '../common/definitions/register.js';
-import { partMap } from '../common/part-map.js';
-import { asNumber } from '../common/util.js';
+import { tileManagerContext, } from '#internals/context.js';
+import { createMutationController, } from '#internals/controllers/mutation-observer.js';
+import { shadowOptions } from '#internals/decorators/shadow-options.js';
+import { registerComponent } from '#internals/definitions/register.js';
+import { partMap } from '#internals/part-map.js';
+import { asNumber } from '#internals/utils/math.js';
+import { addThemingController } from '#theming/theming-controller.js';
 import { createTilesState } from './position.js';
 import { createSerializer } from './serializer.js';
 import { all } from './themes/container.js';

package/components/tile-manager/tile-manager.js.map

@@ -1 +1 @@
-{"version":3,"file":"tile-manager.js","sourceRoot":"","sources":["../../../src/components/tile-manager/tile-manager.ts"],"names":[],"mappings":"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","sourcesContent":["import { ContextProvider } from '@lit/context';\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { createRef, ref } from 'lit/directives/ref.js';\nimport { type StyleInfo, styleMap } from 'lit/directives/style-map.js';\nimport { addThemingController } from '../../theming/theming-controller.js';\nimport {\n  type TileManagerContext,\n  tileManagerContext,\n} from '../common/context.js';\nimport {\n  createMutationController,\n  type MutationControllerParams,\n} from '../common/controllers/mutation-observer.js';\nimport { shadowOptions } from '../common/decorators/shadow-options.js';\nimport { registerComponent } from '../common/definitions/register.js';\nimport { partMap } from '../common/part-map.js';\nimport { asNumber } from '../common/util.js';\nimport type { TileManagerDragMode, TileManagerResizeMode } from '../types.js';\nimport { createTilesState } from './position.js';\nimport { createSerializer } from './serializer.js';\nimport { all } from './themes/container.js';\nimport { styles as shared } from './themes/shared/tile-manager.common.css.js';\nimport { styles } from './themes/tile-manager.base.css.js';\nimport IgcTileComponent from './tile.js';\n\n/* blazorAdditionalDependency: IgcTileComponent */\n/**\n * The tile manager component enables the dynamic arrangement, resizing, and interaction of tiles.\n *\n * @element igc-tile-manager\n *\n * @slot - Default slot for the tile manager. Only `igc-tile` elements will be projected inside the CSS grid container.\n *\n * @csspart base - The tile manager CSS Grid container.\n *\n * @cssproperty --column-count - The number of columns for the tile manager. The `column-count` attribute sets this variable.\n * @cssproperty --min-col-width - The minimum size of the columns in the tile-manager. The `min-column-width` attribute sets this variable.\n * @cssproperty --min-row-height - The minimum size of the rows in the tile-manager. The `min-row-height` attribute sets this variable.\n * @cssproperty --grid-gap - The gap size of the underlying CSS grid container. The `gap` attributes sts this variable.\n *\n */\n@shadowOptions({ slotAssignment: 'manual' })\nexport default class IgcTileManagerComponent extends LitElement {\n  public static readonly tagName = 'igc-tile-manager';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register() {\n    registerComponent(IgcTileManagerComponent, IgcTileComponent);\n  }\n\n  // #region Internal state\n\n  private _internalStyles: StyleInfo = {};\n  private _dragMode: TileManagerDragMode = 'none';\n  private _resizeMode: TileManagerResizeMode = 'none';\n  private _columnCount = 0;\n  private _gap?: string;\n  private _minColWidth?: string;\n  private _minRowHeight?: string;\n\n  private _serializer = createSerializer(this);\n  private _tilesState = createTilesState(this);\n\n  private _grid = createRef<HTMLElement>();\n\n  // #endregion\n\n  // #region Context helpers\n\n  private _context = new ContextProvider(this, {\n    context: tileManagerContext,\n    initialValue: this._createContext(),\n  });\n\n  private _createContext(): TileManagerContext {\n    return {\n      instance: this,\n      grid: this._grid,\n      setMaximizedState: () => this._setMaximizedState(),\n    };\n  }\n\n  private _setManagerContext(): void {\n    this._context.setValue(this._createContext(), true);\n  }\n\n  // #endregion\n\n  // #region Properties and Attributes\n\n  /**\n   * Whether resize operations are enabled.\n   *\n   * @attr resize-mode\n   * @default none\n   */\n  @property({ attribute: 'resize-mode' })\n  public set resizeMode(value: TileManagerResizeMode) {\n    this._resizeMode = value;\n    this._setManagerContext();\n  }\n\n  public get resizeMode(): TileManagerResizeMode {\n    return this._resizeMode;\n  }\n\n  /**\n   * Whether drag and drop operations are enabled.\n   *\n   * @attr drag-mode\n   * @default none\n   */\n  @property({ attribute: 'drag-mode' })\n  public set dragMode(value: TileManagerDragMode) {\n    this._dragMode = value;\n    this._setManagerContext();\n  }\n\n  public get dragMode(): TileManagerDragMode {\n    return this._dragMode;\n  }\n\n  /**\n   * Sets the number of columns for the tile manager.\n   * Setting value <= than zero will trigger a responsive layout.\n   *\n   * @attr column-count\n   * @default 0\n   */\n  @property({ type: Number, attribute: 'column-count' })\n  public set columnCount(value: number) {\n    this._columnCount = Math.max(0, asNumber(value));\n    Object.assign(this._internalStyles, {\n      '--column-count': this._columnCount || undefined,\n    });\n  }\n\n  public get columnCount(): number {\n    return this._columnCount;\n  }\n\n  /**\n   * Sets the minimum width for a column unit in the tile manager.\n   * @attr min-column-width\n   */\n  @property({ attribute: 'min-column-width' })\n  public set minColumnWidth(value: string | undefined) {\n    this._minColWidth = value ?? undefined;\n    Object.assign(this._internalStyles, {\n      '--min-col-width': this._minColWidth,\n    });\n  }\n\n  public get minColumnWidth(): string | undefined {\n    return this._minColWidth;\n  }\n\n  /**\n   * Sets the minimum height for a row unit in the tile manager.\n   * @attr min-row-height\n   */\n  @property({ attribute: 'min-row-height' })\n  public set minRowHeight(value: string | undefined) {\n    this._minRowHeight = value ?? undefined;\n    Object.assign(this._internalStyles, {\n      '--min-row-height': this._minRowHeight,\n    });\n  }\n\n  public get minRowHeight(): string | undefined {\n    return this._minRowHeight;\n  }\n\n  /**\n   * Sets the gap size between tiles in the tile manager.\n   *\n   * @attr gap\n   */\n  @property()\n  public set gap(value: string | undefined) {\n    this._gap = value ?? undefined;\n    Object.assign(this._internalStyles, {\n      '--grid-gap': this._gap,\n    });\n  }\n\n  public get gap(): string | undefined {\n    return this._gap;\n  }\n\n  /**\n   * Gets the tiles sorted by their position in the layout.\n   * @property\n   */\n  public get tiles() {\n    return this._tilesState.tiles;\n  }\n\n  // #endregion\n\n  // #region Internal API\n\n  constructor() {\n    super();\n\n    addThemingController(this, all);\n\n    createMutationController(this, {\n      callback: this._observerCallback,\n      filter: [IgcTileComponent.tagName],\n      config: {\n        childList: true,\n      },\n    });\n  }\n\n  protected override updated() {\n    this._tilesState.adjustTileGridPosition();\n  }\n\n  protected override firstUpdated() {\n    this._tilesState.assignPositions();\n    this._tilesState.assignTiles();\n    this._setManagerContext();\n  }\n\n  private _observerCallback({\n    changes: { added, removed },\n  }: MutationControllerParams<IgcTileComponent>) {\n    const ownAdded = added.filter(\n      ({ target }) => target.closest(this.tagName) === this\n    );\n    const ownRemoved = removed.filter(\n      ({ target }) => target.closest(this.tagName) === this\n    );\n\n    for (const remove of ownRemoved) {\n      this._tilesState.remove(remove.node);\n    }\n\n    for (const added of ownAdded) {\n      this._tilesState.add(added.node);\n    }\n\n    this._tilesState.assignTiles();\n  }\n\n  /**\n   * Locks/unlocks the grid container height in response to a tile's maximized state changing.\n   *\n   * @remarks\n   * Maximizing a tile removes it from the grid flow (absolute positioning), so it no longer\n   * contributes to the grid's intrinsic height. When that tile is the sole contributor to the\n   * tallest row track, the container would otherwise collapse to the remaining tiles and cut off\n   * the maximized tile's content. Capturing the current height before the layout change keeps the\n   * container stable, and it is released once no tile remains maximized.\n   */\n  private _setMaximizedState(): void {\n    const grid = this._grid.value;\n\n    if (grid) {\n      if (this.tiles.some((tile) => tile.maximized)) {\n        if (!grid.style.minHeight) {\n          grid.style.minHeight = `${grid.offsetHeight}px`;\n        }\n      } else {\n        grid.style.minHeight = '';\n      }\n    }\n\n    this.requestUpdate();\n  }\n\n  // #endregion\n\n  // #region Public API\n\n  /**\n   * Returns the properties of the current tile collections as a JSON payload.\n   *\n   * @remarks\n   * The content of the tiles is not serialized or saved. Only tile properties\n   * are serialized.\n   */\n  public saveLayout(): string {\n    return this._serializer.saveAsJSON();\n  }\n\n  /**\n   * Restores a previously serialized state produced by `saveLayout`.\n   */\n  public loadLayout(data: string): void {\n    this._serializer.loadFromJSON(data);\n  }\n\n  // #endregion\n\n  // #region Rendering\n\n  protected override render() {\n    const parts = {\n      base: true,\n      'maximized-tile': this.tiles.some((tile) => tile.maximized),\n    };\n\n    return html`\n      <div\n        ${ref(this._grid)}\n        style=${styleMap(this._internalStyles)}\n        part=${partMap(parts)}\n      >\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  // #endregion\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-tile-manager': IgcTileManagerComponent;\n  }\n}\n"]}
+{"version":3,"file":"tile-manager.js","sourceRoot":"","sources":["../../../src/components/tile-manager/tile-manager.ts"],"names":[],"mappings":"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","sourcesContent":["import { ContextProvider } from '@lit/context';\nimport { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { createRef, ref } from 'lit/directives/ref.js';\nimport { type StyleInfo, styleMap } from 'lit/directives/style-map.js';\nimport {\n  type TileManagerContext,\n  tileManagerContext,\n} from '#internals/context.js';\nimport {\n  createMutationController,\n  type MutationControllerParams,\n} from '#internals/controllers/mutation-observer.js';\nimport { shadowOptions } from '#internals/decorators/shadow-options.js';\nimport { registerComponent } from '#internals/definitions/register.js';\nimport { partMap } from '#internals/part-map.js';\nimport { asNumber } from '#internals/utils/math.js';\nimport { addThemingController } from '#theming/theming-controller.js';\nimport type { TileManagerDragMode, TileManagerResizeMode } from '../types.js';\nimport { createTilesState } from './position.js';\nimport { createSerializer } from './serializer.js';\nimport { all } from './themes/container.js';\nimport { styles as shared } from './themes/shared/tile-manager.common.css.js';\nimport { styles } from './themes/tile-manager.base.css.js';\nimport IgcTileComponent from './tile.js';\n\n/* blazorAdditionalDependency: IgcTileComponent */\n/**\n * The tile manager component enables the dynamic arrangement, resizing, and interaction of tiles.\n *\n * @element igc-tile-manager\n *\n * @slot - Default slot for the tile manager. Only tile elements will be projected inside the CSS grid container.\n *\n * @csspart base - The tile manager CSS Grid container.\n *\n * @cssproperty --column-count - The number of columns for the tile manager. The `column-count` attribute sets this variable.\n * @cssproperty --min-col-width - The minimum size of the columns in the tile-manager. The `min-column-width` attribute sets this variable.\n * @cssproperty --min-row-height - The minimum size of the rows in the tile-manager. The `min-row-height` attribute sets this variable.\n * @cssproperty --grid-gap - The gap size of the underlying CSS grid container. The `gap` attributes sts this variable.\n *\n */\n@shadowOptions({ slotAssignment: 'manual' })\nexport default class IgcTileManagerComponent extends LitElement {\n  public static readonly tagName = 'igc-tile-manager';\n  public static override styles = [styles, shared];\n\n  /* blazorSuppress */\n  public static register() {\n    registerComponent(IgcTileManagerComponent, IgcTileComponent);\n  }\n\n  // #region Internal state\n\n  private _internalStyles: StyleInfo = {};\n  private _dragMode: TileManagerDragMode = 'none';\n  private _resizeMode: TileManagerResizeMode = 'none';\n  private _columnCount = 0;\n  private _gap?: string;\n  private _minColWidth?: string;\n  private _minRowHeight?: string;\n\n  private _serializer = createSerializer(this);\n  private _tilesState = createTilesState(this);\n\n  private _grid = createRef<HTMLElement>();\n\n  // #endregion\n\n  // #region Context helpers\n\n  private _context = new ContextProvider(this, {\n    context: tileManagerContext,\n    initialValue: this._createContext(),\n  });\n\n  private _createContext(): TileManagerContext {\n    return {\n      instance: this,\n      grid: this._grid,\n      setMaximizedState: () => this._setMaximizedState(),\n    };\n  }\n\n  private _setManagerContext(): void {\n    this._context.setValue(this._createContext(), true);\n  }\n\n  // #endregion\n\n  // #region Properties and Attributes\n\n  /**\n   * Whether resize operations are enabled.\n   *\n   * @attr resize-mode\n   * @default none\n   */\n  @property({ attribute: 'resize-mode' })\n  public set resizeMode(value: TileManagerResizeMode) {\n    this._resizeMode = value;\n    this._setManagerContext();\n  }\n\n  public get resizeMode(): TileManagerResizeMode {\n    return this._resizeMode;\n  }\n\n  /**\n   * Whether drag and drop operations are enabled.\n   *\n   * @attr drag-mode\n   * @default none\n   */\n  @property({ attribute: 'drag-mode' })\n  public set dragMode(value: TileManagerDragMode) {\n    this._dragMode = value;\n    this._setManagerContext();\n  }\n\n  public get dragMode(): TileManagerDragMode {\n    return this._dragMode;\n  }\n\n  /**\n   * Sets the number of columns for the tile manager.\n   * Setting value <= than zero will trigger a responsive layout.\n   *\n   * @attr column-count\n   * @default 0\n   */\n  @property({ type: Number, attribute: 'column-count' })\n  public set columnCount(value: number) {\n    this._columnCount = Math.max(0, asNumber(value));\n    Object.assign(this._internalStyles, {\n      '--column-count': this._columnCount || undefined,\n    });\n  }\n\n  public get columnCount(): number {\n    return this._columnCount;\n  }\n\n  /**\n   * Sets the minimum width for a column unit in the tile manager.\n   * @attr min-column-width\n   */\n  @property({ attribute: 'min-column-width' })\n  public set minColumnWidth(value: string | undefined) {\n    this._minColWidth = value ?? undefined;\n    Object.assign(this._internalStyles, {\n      '--min-col-width': this._minColWidth,\n    });\n  }\n\n  public get minColumnWidth(): string | undefined {\n    return this._minColWidth;\n  }\n\n  /**\n   * Sets the minimum height for a row unit in the tile manager.\n   * @attr min-row-height\n   */\n  @property({ attribute: 'min-row-height' })\n  public set minRowHeight(value: string | undefined) {\n    this._minRowHeight = value ?? undefined;\n    Object.assign(this._internalStyles, {\n      '--min-row-height': this._minRowHeight,\n    });\n  }\n\n  public get minRowHeight(): string | undefined {\n    return this._minRowHeight;\n  }\n\n  /**\n   * Sets the gap size between tiles in the tile manager.\n   *\n   * @attr gap\n   */\n  @property()\n  public set gap(value: string | undefined) {\n    this._gap = value ?? undefined;\n    Object.assign(this._internalStyles, {\n      '--grid-gap': this._gap,\n    });\n  }\n\n  public get gap(): string | undefined {\n    return this._gap;\n  }\n\n  /**\n   * Gets the tiles sorted by their position in the layout.\n   * @property\n   */\n  public get tiles() {\n    return this._tilesState.tiles;\n  }\n\n  // #endregion\n\n  // #region Internal API\n\n  constructor() {\n    super();\n\n    addThemingController(this, all);\n\n    createMutationController(this, {\n      callback: this._observerCallback,\n      filter: [IgcTileComponent.tagName],\n      config: {\n        childList: true,\n      },\n    });\n  }\n\n  protected override updated() {\n    this._tilesState.adjustTileGridPosition();\n  }\n\n  protected override firstUpdated() {\n    this._tilesState.assignPositions();\n    this._tilesState.assignTiles();\n    this._setManagerContext();\n  }\n\n  private _observerCallback({\n    changes: { added, removed },\n  }: MutationControllerParams<IgcTileComponent>) {\n    const ownAdded = added.filter(\n      ({ target }) => target.closest(this.tagName) === this\n    );\n    const ownRemoved = removed.filter(\n      ({ target }) => target.closest(this.tagName) === this\n    );\n\n    for (const remove of ownRemoved) {\n      this._tilesState.remove(remove.node);\n    }\n\n    for (const added of ownAdded) {\n      this._tilesState.add(added.node);\n    }\n\n    this._tilesState.assignTiles();\n  }\n\n  /**\n   * Locks/unlocks the grid container height in response to a tile's maximized state changing.\n   *\n   * @remarks\n   * Maximizing a tile removes it from the grid flow (absolute positioning), so it no longer\n   * contributes to the grid's intrinsic height. When that tile is the sole contributor to the\n   * tallest row track, the container would otherwise collapse to the remaining tiles and cut off\n   * the maximized tile's content. Capturing the current height before the layout change keeps the\n   * container stable, and it is released once no tile remains maximized.\n   */\n  private _setMaximizedState(): void {\n    const grid = this._grid.value;\n\n    if (grid) {\n      if (this.tiles.some((tile) => tile.maximized)) {\n        if (!grid.style.minHeight) {\n          grid.style.minHeight = `${grid.offsetHeight}px`;\n        }\n      } else {\n        grid.style.minHeight = '';\n      }\n    }\n\n    this.requestUpdate();\n  }\n\n  // #endregion\n\n  // #region Public API\n\n  /**\n   * Returns the properties of the current tile collections as a JSON payload.\n   *\n   * @remarks\n   * The content of the tiles is not serialized or saved. Only tile properties\n   * are serialized.\n   */\n  public saveLayout(): string {\n    return this._serializer.saveAsJSON();\n  }\n\n  /**\n   * Restores a previously serialized state produced by `saveLayout`.\n   */\n  public loadLayout(data: string): void {\n    this._serializer.loadFromJSON(data);\n  }\n\n  // #endregion\n\n  // #region Rendering\n\n  protected override render() {\n    const parts = {\n      base: true,\n      'maximized-tile': this.tiles.some((tile) => tile.maximized),\n    };\n\n    return html`\n      <div\n        ${ref(this._grid)}\n        style=${styleMap(this._internalStyles)}\n        part=${partMap(parts)}\n      >\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  // #endregion\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'igc-tile-manager': IgcTileManagerComponent;\n  }\n}\n"]}

package/components/tile-manager/tile.d.ts

@@ -1,5 +1,5 @@
 import { LitElement } from 'lit';
-import type { Constructor } from '../common/mixins/constructor.js';
+import type { Constructor } from '#internals/mixins/constructor.js';
 import IgcResizeContainerComponent from '../resize-container/resize-container.js';
 export interface IgcTileChangeStateEventArgs {
     tile: IgcTileComponent;
@@ -15,9 +15,9 @@ export interface IgcTileComponentEventMap {
     igcTileResizeEnd: CustomEvent<IgcTileComponent>;
     igcTileResizeCancel: CustomEvent<IgcTileComponent>;
 }
-declare const IgcTileComponent_base: Constructor<import("../common/mixins/event-emitter.js").EventEmitterInterface<IgcTileComponentEventMap>> & Constructor<LitElement>;
+declare const IgcTileComponent_base: Constructor<import("#internals/mixins/event-emitter.js").EventEmitterInterface<IgcTileComponentEventMap>> & Constructor<LitElement>;
 /**
- * The tile component is used within the `igc-tile-manager` as a container
+ * The tile component is used within the tile manager as a container
  * for displaying various types of information.
  *
  * @element igc-tile
@@ -137,7 +137,7 @@ export default class IgcTileComponent extends IgcTileComponent_base {
     get maximized(): boolean;
     /**
      * Indicates whether to disable tile resize behavior regardless
-     * ot its tile manager parent settings.
+     * of its tile manager parent settings.
      *
      * @attr disable-resize
      * @default false

package/components/tile-manager/tile.js

@@ -7,18 +7,21 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 import { html, LitElement, nothing } from 'lit';
 import { property, query, state } from 'lit/decorators.js';
 import { createRef, ref } from 'lit/directives/ref.js';
-import { startViewTransition } from '../../animations/player.js';
-import { addThemingController } from '../../theming/theming-controller.js';
+import { setTransitionName, startViewTransition, } from '#animations/view-transition.js';
+import { tileManagerContext, } from '#internals/context.js';
+import { createAsyncContext } from '#internals/controllers/async-consumer.js';
+import { addDragController, } from '#internals/controllers/drag.js';
+import { addFullscreenController } from '#internals/controllers/fullscreen.js';
+import { addSlotController, setSlots } from '#internals/controllers/slot.js';
+import { registerComponent } from '#internals/definitions/register.js';
+import { EventEmitterMixin } from '#internals/mixins/event-emitter.js';
+import { partMap } from '#internals/part-map.js';
+import { isLTR } from '#internals/utils/dom.js';
+import { getElementFromPath } from '#internals/utils/events.js';
+import { asNumber } from '#internals/utils/math.js';
+import { createIdGenerator } from '#internals/utils/strings.js';
+import { addThemingController } from '#theming/theming-controller.js';
 import IgcIconButtonComponent from '../button/icon-button.js';
-import { tileManagerContext, } from '../common/context.js';
-import { createAsyncContext } from '../common/controllers/async-consumer.js';
-import { addDragController, } from '../common/controllers/drag.js';
-import { addFullscreenController } from '../common/controllers/fullscreen.js';
-import { addSlotController, setSlots } from '../common/controllers/slot.js';
-import { registerComponent } from '../common/definitions/register.js';
-import { EventEmitterMixin } from '../common/mixins/event-emitter.js';
-import { partMap } from '../common/part-map.js';
-import { asNumber, getElementFromPath, isLTR } from '../common/util.js';
 import IgcDividerComponent from '../divider/divider.js';
 import IgcResizeContainerComponent from '../resize-container/resize-container.js';
 import { createTileDragStack, swapTiles } from './position.js';
@@ -27,7 +30,7 @@ import { styles as shared } from './themes/shared/tile/tile.common.css.js';
 import { styles } from './themes/tile.base.css.js';
 import { all } from './themes/tile.js';
 import { createTileDragGhost, createTileGhost } from './tile-ghost-util.js';
-let nextId = 1;
+const nextId = createIdGenerator('tile');
 const Slots = setSlots('title', 'maximize-action', 'fullscreen-action', 'actions', 'side-adorner', 'corner-adorner', 'bottom-adorner');
 export default class IgcTileComponent extends EventEmitterMixin(LitElement) {
     static { this.tagName = 'igc-tile'; }
@@ -144,9 +147,10 @@ export default class IgcTileComponent extends EventEmitterMixin(LitElement) {
     }
     connectedCallback() {
         super.connectedCallback();
-        this.id = this.id || `tile-${nextId++}`;
-        this.style.viewTransitionName =
-            this.style.viewTransitionName || `tile-transition-${this.id}`;
+        this.id = this.id || nextId();
+        if (!this.style.viewTransitionName) {
+            setTransitionName(this, `tile-transition-${this.id}`);
+        }
     }
     _setDragState(state = true) {
         this._isDragging = state;
@@ -255,7 +259,7 @@ export default class IgcTileComponent extends EventEmitterMixin(LitElement) {
             await startViewTransition(() => {
                 this.colSpan = colSpan;
                 this.rowSpan = rowSpan;
-            }).transition?.updateCallbackDone;
+            }).updateCallbackDone;
             this._setResizeState(false);
             this.emitEvent('igcTileResizeEnd', { detail: this });
         };
@@ -274,7 +278,7 @@ export default class IgcTileComponent extends EventEmitterMixin(LitElement) {
         this.style.zIndex = '1';
         await startViewTransition(() => {
             this.maximized = !this.maximized;
-        }).transition?.finished;
+        }).finished;
         this.style.zIndex = '';
     }
     _emitFullScreenEvent(state) {
@@ -340,17 +344,17 @@ export default class IgcTileComponent extends EventEmitterMixin(LitElement) {
         <section id="tile-actions" part="actions">
           ${hasMaximizeSlot
             ? html `
-                <slot name="maximize-action">
-                  ${this._renderDefaultAction('maximize')}
-                </slot>
-              `
+                  <slot name="maximize-action">
+                    ${this._renderDefaultAction('maximize')}
+                  </slot>
+                `
             : nothing}
           ${hasFullscreenSlot
             ? html `
-                <slot name="fullscreen-action">
-                  ${this._renderDefaultAction('fullscreen')}
-                </slot>
-              `
+                  <slot name="fullscreen-action">
+                    ${this._renderDefaultAction('fullscreen')}
+                  </slot>
+                `
             : nothing}
 
           <slot name="actions"></slot>