@breadstone/mosaik-elements-foundation 0.0.147 → 0.0.149

package/Controls/Components/Layouts/Dock/DockPanelElement.js

@@ -21,30 +21,41 @@ import { dockPanelElementTemplate } from './DockPanelElementTemplate';
 import { CssLength } from '@breadstone/mosaik-themes';
 // #endregion
 /**
- * DockPanel - A layout component used to arrange child components by docking them to specific edges or filling the remaining space.
+ * Dock Panel - A flexible layout container for docking child elements to specific edges with fill capability.
  *
  * @description
- * The DockPanel component is a powerful layout element that allows child components or elements to be docked
- * to the top, bottom, left, or right edges of the container, while optionally letting one element fill the
- * remaining available space. This makes it ideal for constructing flexible and adaptive interfaces such as
- * application shells, sidebars, headers, footers, and content regions.
- *
- * DockPanel layouts provide developers with fine-grained control over how elements are positioned relative
- * to each other, ensuring that UIs remain both structured and responsive without relying heavily on manual
- * CSS positioning.
+ * The Dock Panel component provides a powerful layout system where child elements can be docked to specific
+ * edges (top, bottom, left, right) of the container, with one element optionally filling the remaining space.
+ * This creates flexible, adaptive layouts perfect for application shells, dashboards, and structured interfaces.
+ * The component handles automatic space distribution, supports gap spacing between docked elements, respects
+ * orientation and reversal settings, and provides responsive behavior. Child elements use dock attributes
+ * to specify their positioning preference, while the panel manages the overall layout flow and space allocation.
+ * Essential for creating professional application layouts with headers, sidebars, content areas, and footers.
  *
+ * @name Dock Panel
  * @element mosaik-dock-panel
- * @category Layout
+ * @category Layouts
+ *
+ * @slot - The default slot for child elements with dock positioning attributes.
  *
- * @slot - The default slot for child elements to be docked.
+ * @csspart surface - The main container surface for docked elements.
  *
  * @example
  * ```html
  * <mosaik-dock-panel>
- *   <div dock="top">Header</div>
- *   <div dock="left">Sidebar</div>
- *   <div dock="content">Main Content</div>
- *   <div dock="bottom">Footer</div>
+ *   <header dock="top">Application Header</header>
+ *   <nav dock="left">Navigation Sidebar</nav>
+ *   <footer dock="bottom">Application Footer</footer>
+ *   <main dock="fill">Main Content Area</main>
+ * </mosaik-dock-panel>
+ * ```
+ *
+ * @example
+ * ```html
+ * <mosaik-dock-panel gap="16px" orientation="vertical">
+ *   <div dock="start">Start Panel</div>
+ *   <div dock="end">End Panel</div>
+ *   <div dock="fill">Center Content</div>
  * </mosaik-dock-panel>
  * ```
  *

package/Controls/Components/Layouts/Dock/DockPanelElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"DockPanelElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Layouts/Dock/DockPanelElement.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"DockPanelElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Layouts/Dock/DockPanelElement.ts"],"names":[],"mappings":"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"}

package/Controls/Components/Layouts/Grid/GridElement.d.ts

@@ -9,9 +9,25 @@ declare const GridElement_base: (abstract new (...args: Array<any>) => import(".
 /**
  * Grid - A layout system that arranges elements in a structured grid pattern.
  *
+ * @description
+ * The Grid component provides a flexible grid layout system for arranging child elements in rows and columns.
+ * It supports responsive design patterns and allows for precise control over element positioning and spacing.
+ * This component is ideal for creating complex layouts, dashboards, and organized content structures.
+ *
+ * @name Grid
  * @element mosaik-grid
+ * @category Layout
+ *
+ * @slot - The default slot for grid items.
  *
- * @slot - The default slot.
+ * @example
+ * ```html
+ * <mosaik-grid>
+ *   <mosaik-grid-item row="1" column="1">Item 1</mosaik-grid-item>
+ *   <mosaik-grid-item row="1" column="2">Item 2</mosaik-grid-item>
+ *   <mosaik-grid-item row="2" column="1,2">Item 3</mosaik-grid-item>
+ * </mosaik-grid>
+ * ```
  *
  * @public
  */

package/Controls/Components/Layouts/Grid/GridElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GridElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Layouts/Grid/GridElement.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AACzE,OAAO,EAAE,iBAAiB,EAAE,MAAM,kCAAkC,CAAC;AACrE,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAExD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;;AAOlD;;;;;;;;GAQG;AACH,qBASa,WACT,SAAQ,gBACR,YAAW,iBAAiB;IAI5B,OAAO,CAAC,eAAe,CAAiB;IACxC,OAAO,CAAC,kBAAkB,CAAoB;IAC9C,OAAO,CAAC,IAAI,CAAmC;IAC/C,OAAO,CAAC,oBAAoB,CAAsB;IAClD,OAAO,CAAC,kBAAkB,CAAoB;IAM9C;;;;OAIG;;IAeH;;;;;;;MAOE;IACF,WAA2B,EAAE,IAAI,MAAM,CAEtC;IAED;;;;;;;;;;;;;OAaG;IACH,IACW,cAAc,IAAI,cAAc,CAE1C;IAED,IAAW,cAAc,CAAC,KAAK,EAAE,cAAc,EAM9C;IAED;;;;;;;;;;;;;OAaG;IACH,IACW,iBAAiB,IAAI,iBAAiB,CAEhD;IAED,IAAW,iBAAiB,CAAC,KAAK,EAAE,iBAAiB,EAMpD;IAED;;;;;OAKG;IACH,IACW,GAAG,IAAI,MAAM,GAAG,MAAM,GAAG,cAAc,CAEjD;IAED,IAAW,GAAG,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,cAAc,EAMrD;IAED;;;;;OAKG;IACH,IACW,mBAAmB,IAAI,mBAAmB,CAEpD;IAED,IAAW,mBAAmB,CAAC,KAAK,EAAE,mBAAmB,EAKxD;IAED;;;;;OAKG;IACH,IACW,iBAAiB,IAAI,iBAAiB,CAEhD;IAED,IAAW,iBAAiB,CAAC,KAAK,EAAE,iBAAiB,EAKpD;IAMD;;OAEG;IACH,OAAO,CAAC,gBAAgB;IAoBxB;;OAEG;IACH,OAAO,CAAC,mBAAmB;IA6B3B;;OAEG;IACH,OAAO,CAAC,gBAAgB;CA+B3B;AAED;;GAEG;AACH,yBAAiB,WAAW,CAAC;IACzB,KAAY,KAAK,GAAG,iBAAiB,CAAC;CACzC;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,aAAa,EAAE,WAAW,CAAC;KAC9B;CACJ"}
+{"version":3,"file":"GridElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Layouts/Grid/GridElement.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AACzE,OAAO,EAAE,iBAAiB,EAAE,MAAM,kCAAkC,CAAC;AACrE,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAExD,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;;AAOlD;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,qBASa,WACT,SAAQ,gBACR,YAAW,iBAAiB;IAI5B,OAAO,CAAC,eAAe,CAAiB;IACxC,OAAO,CAAC,kBAAkB,CAAoB;IAC9C,OAAO,CAAC,IAAI,CAAmC;IAC/C,OAAO,CAAC,oBAAoB,CAAsB;IAClD,OAAO,CAAC,kBAAkB,CAAoB;IAM9C;;;;OAIG;;IAeH;;;;;;;MAOE;IACF,WAA2B,EAAE,IAAI,MAAM,CAEtC;IAED;;;;;;;;;;;;;OAaG;IACH,IACW,cAAc,IAAI,cAAc,CAE1C;IAED,IAAW,cAAc,CAAC,KAAK,EAAE,cAAc,EAM9C;IAED;;;;;;;;;;;;;OAaG;IACH,IACW,iBAAiB,IAAI,iBAAiB,CAEhD;IAED,IAAW,iBAAiB,CAAC,KAAK,EAAE,iBAAiB,EAMpD;IAED;;;;;OAKG;IACH,IACW,GAAG,IAAI,MAAM,GAAG,MAAM,GAAG,cAAc,CAEjD;IAED,IAAW,GAAG,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,cAAc,EAMrD;IAED;;;;;OAKG;IACH,IACW,mBAAmB,IAAI,mBAAmB,CAEpD;IAED,IAAW,mBAAmB,CAAC,KAAK,EAAE,mBAAmB,EAKxD;IAED;;;;;OAKG;IACH,IACW,iBAAiB,IAAI,iBAAiB,CAEhD;IAED,IAAW,iBAAiB,CAAC,KAAK,EAAE,iBAAiB,EAKpD;IAMD;;OAEG;IACH,OAAO,CAAC,gBAAgB;IAoBxB;;OAEG;IACH,OAAO,CAAC,mBAAmB;IA6B3B;;OAEG;IACH,OAAO,CAAC,gBAAgB;CA+B3B;AAED;;GAEG;AACH,yBAAiB,WAAW,CAAC;IACzB,KAAY,KAAK,GAAG,iBAAiB,CAAC;CACzC;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,aAAa,EAAE,WAAW,CAAC;KAC9B;CACJ"}

package/Controls/Components/Layouts/Grid/GridElement.js

@@ -25,9 +25,25 @@ import { gridElementCosmopolitanStyle } from './Themes/GridElement.Cosmopolitan'
 /**
  * Grid - A layout system that arranges elements in a structured grid pattern.
  *
+ * @description
+ * The Grid component provides a flexible grid layout system for arranging child elements in rows and columns.
+ * It supports responsive design patterns and allows for precise control over element positioning and spacing.
+ * This component is ideal for creating complex layouts, dashboards, and organized content structures.
+ *
+ * @name Grid
  * @element mosaik-grid
+ * @category Layout
+ *
+ * @slot - The default slot for grid items.
  *
- * @slot - The default slot.
+ * @example
+ * ```html
+ * <mosaik-grid>
+ *   <mosaik-grid-item row="1" column="1">Item 1</mosaik-grid-item>
+ *   <mosaik-grid-item row="1" column="2">Item 2</mosaik-grid-item>
+ *   <mosaik-grid-item row="2" column="1,2">Item 3</mosaik-grid-item>
+ * </mosaik-grid>
+ * ```
  *
  * @public
  */

package/Controls/Components/Layouts/Grid/GridElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"GridElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Layouts/Grid/GridElement.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"GridElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Layouts/Grid/GridElement.ts"],"names":[],"mappings":"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"}

package/Controls/Components/Layouts/Masonry/MasonryElement.d.ts

@@ -2,18 +2,45 @@ import { CustomElement } from '../../Abstracts/CustomElement';
 import type { IMasonryElementProps } from './IMasonryElementProps';
 declare const MasonryElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Fitable").IFitableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Gapable").IGapableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor;
 /**
- * Masonry - A grid-based layout system for arranging elements in a dynamic, vertical grid.
+ * Masonry - A dynamic grid layout system that arranges elements of varying heights in optimal vertical columns.
  *
  * @description
- * The Masonry is a popular grid-based layout system used to arrange elements of varying heights in a vertical grid.
- * It is particularly useful when dealing with content like cards, images, or articles with different heights. Unlike traditional
- * grid systems, Masonry optimizes space utilization by aligning elements to fill gaps in a visually pleasing manner. This layout
- * is commonly used in websites and applications to create visually appealing and responsive grid designs.
+ * The Masonry layout component creates a Pinterest-style grid where elements are arranged in columns with
+ * optimal space utilization, minimizing gaps and creating visually pleasing layouts. Unlike traditional
+ * grid systems, Masonry dynamically positions elements to fill available space efficiently, making it
+ * perfect for content with varying heights. The component supports configurable column counts, gap spacing,
+ * responsive behavior, and automatic height distribution. It handles dynamic content addition and removal,
+ * maintains layout integrity during window resizing, and provides smooth transitions. Essential for image
+ * galleries, card layouts, dashboard widgets, blog post grids, and any interface displaying heterogeneous
+ * content that needs optimal space utilization.
  *
+ * @name Masonry
  * @element mosaik-masonry
- * @category Layout
+ * @category Layouts
  *
- * @slot - The default slot.
+ * @slot - The default slot for elements to be arranged in masonry layout.
+ *
+ * @cssprop {String} --masonry-columns - The number of columns in the masonry grid.
+ * @cssprop {String} --masonry-gap - The gap between masonry items.
+ *
+ * @example
+ * ```html
+ * <mosaik-masonry columns="3" gap="16px">
+ *   <div>Short content</div>
+ *   <div>Much longer content that spans multiple lines and creates different heights</div>
+ *   <div>Medium content</div>
+ *   <div>Another short item</div>
+ * </mosaik-masonry>
+ * ```
+ *
+ * @example
+ * ```html
+ * <mosaik-masonry columns="4" gap="20px">
+ *   <mosaik-card>Card 1</mosaik-card>
+ *   <mosaik-card>Card 2 with more content</mosaik-card>
+ *   <mosaik-card>Card 3</mosaik-card>
+ * </mosaik-masonry>
+ * ```
  *
  * @public
  */

package/Controls/Components/Layouts/Masonry/MasonryElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MasonryElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Layouts/Masonry/MasonryElement.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;;AASnE;;;;;;;;;;;;;;;GAeG;AACH,qBAUa,cACT,SAAQ,mBACR,YAAW,oBAAoB;IAI/B,OAAO,CAAC,QAAQ,CAAS;IAMzB;;OAEG;;IAWH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;OAIG;IACH,IACW,OAAO,IAAI,MAAM,CAE3B;IACD,IAAW,OAAO,CAAC,KAAK,EAAE,MAAM,EAK/B;CAIJ;AAED;;GAEG;AACH,yBAAiB,cAAc,CAAC;IAC5B,KAAY,KAAK,GAAG,oBAAoB,CAAC;CAC5C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,gBAAgB,EAAE,cAAc,CAAC;KACpC;CACJ"}
+{"version":3,"file":"MasonryElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Layouts/Masonry/MasonryElement.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;;AASnE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,qBAUa,cACT,SAAQ,mBACR,YAAW,oBAAoB;IAI/B,OAAO,CAAC,QAAQ,CAAS;IAMzB;;OAEG;;IAWH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;OAIG;IACH,IACW,OAAO,IAAI,MAAM,CAE3B;IACD,IAAW,OAAO,CAAC,KAAK,EAAE,MAAM,EAK/B;CAIJ;AAED;;GAEG;AACH,yBAAiB,cAAc,CAAC;IAC5B,KAAY,KAAK,GAAG,oBAAoB,CAAC;CAC5C;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,gBAAgB,EAAE,cAAc,CAAC;KACpC;CACJ"}

package/Controls/Components/Layouts/Masonry/MasonryElement.js

@@ -20,18 +20,45 @@ import { masonryElementCosmopolitanStyle } from './Themes/MasonryElement.Cosmopo
 import { Gapable } from '../../../Behaviors/Gapable';
 // #endregion
 /**
- * Masonry - A grid-based layout system for arranging elements in a dynamic, vertical grid.
+ * Masonry - A dynamic grid layout system that arranges elements of varying heights in optimal vertical columns.
  *
  * @description
- * The Masonry is a popular grid-based layout system used to arrange elements of varying heights in a vertical grid.
- * It is particularly useful when dealing with content like cards, images, or articles with different heights. Unlike traditional
- * grid systems, Masonry optimizes space utilization by aligning elements to fill gaps in a visually pleasing manner. This layout
- * is commonly used in websites and applications to create visually appealing and responsive grid designs.
+ * The Masonry layout component creates a Pinterest-style grid where elements are arranged in columns with
+ * optimal space utilization, minimizing gaps and creating visually pleasing layouts. Unlike traditional
+ * grid systems, Masonry dynamically positions elements to fill available space efficiently, making it
+ * perfect for content with varying heights. The component supports configurable column counts, gap spacing,
+ * responsive behavior, and automatic height distribution. It handles dynamic content addition and removal,
+ * maintains layout integrity during window resizing, and provides smooth transitions. Essential for image
+ * galleries, card layouts, dashboard widgets, blog post grids, and any interface displaying heterogeneous
+ * content that needs optimal space utilization.
  *
+ * @name Masonry
  * @element mosaik-masonry
- * @category Layout
+ * @category Layouts
  *
- * @slot - The default slot.
+ * @slot - The default slot for elements to be arranged in masonry layout.
+ *
+ * @cssprop {String} --masonry-columns - The number of columns in the masonry grid.
+ * @cssprop {String} --masonry-gap - The gap between masonry items.
+ *
+ * @example
+ * ```html
+ * <mosaik-masonry columns="3" gap="16px">
+ *   <div>Short content</div>
+ *   <div>Much longer content that spans multiple lines and creates different heights</div>
+ *   <div>Medium content</div>
+ *   <div>Another short item</div>
+ * </mosaik-masonry>
+ * ```
+ *
+ * @example
+ * ```html
+ * <mosaik-masonry columns="4" gap="20px">
+ *   <mosaik-card>Card 1</mosaik-card>
+ *   <mosaik-card>Card 2 with more content</mosaik-card>
+ *   <mosaik-card>Card 3</mosaik-card>
+ * </mosaik-masonry>
+ * ```
  *
  * @public
  */

package/Controls/Components/Layouts/Masonry/MasonryElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"MasonryElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Layouts/Masonry/MasonryElement.ts"],"names":[],"mappings":"AAAA,kBAAkB;;;;;;;;;;AAElB,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AACjE,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE9D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACrE,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AACzE,OAAO,EAAE,+BAA+B,EAAE,MAAM,sCAAsC,CAAC;AACvF,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAErD,aAAa;AAEb;;;;;;;;;;;;;;;GAeG;AAWI,IAAM,cAAc,GAApB,MAAM,cACT,SAAQ,SAAS,CAAC,OAAO,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC,CAAC;IAGlD,iBAAiB;IAET,QAAQ,CAAS;IAEzB,aAAa;IAEb,eAAe;IAEf;;OAEG;IACH;QACI,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;IACtB,CAAC;IAED,aAAa;IAEb,qBAAqB;IAErB;;;;;;;OAOG;IACI,MAAM,KAAK,EAAE;QAChB,OAAO,gBAAgB,CAAC;IAC5B,CAAC;IAED;;;;OAIG;IACH,IACW,OAAO;QACd,OAAO,IAAI,CAAC,QAAQ,CAAC;IACzB,CAAC;IACD,IAAW,OAAO,CAAC,KAAa;QAC5B,IAAI,IAAI,CAAC,QAAQ,KAAK,KAAK,EAAE,CAAC;YAC1B,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;YACtB,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;QAClC,CAAC;IACL,CAAC;CAIJ,CAAA;AAbG;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;6CAG1B;AA7CQ,cAAc;IAV1B,SAAS,CAAC;QACP,QAAQ,EAAE,gBAAgB;QAC1B,QAAQ,EAAE,sBAAsB;QAChC,MAAM,EAAE;YACJ,GAAG,EAAE,sBAAsB;YAC3B,KAAK,EAAE,wBAAwB;YAC/B,YAAY,EAAE,+BAA+B;SAChD;QACD,OAAO,EAAE,EAAE;KACd,CAAC;;GACW,cAAc,CAuD1B"}
+{"version":3,"file":"MasonryElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Layouts/Masonry/MasonryElement.ts"],"names":[],"mappings":"AAAA,kBAAkB;;;;;;;;;;AAElB,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,QAAQ,EAAE,MAAM,uCAAuC,CAAC;AACjE,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE9D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AACrE,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AACzE,OAAO,EAAE,+BAA+B,EAAE,MAAM,sCAAsC,CAAC;AACvF,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAErD,aAAa;AAEb;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AAWI,IAAM,cAAc,GAApB,MAAM,cACT,SAAQ,SAAS,CAAC,OAAO,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC,CAAC;IAGlD,iBAAiB;IAET,QAAQ,CAAS;IAEzB,aAAa;IAEb,eAAe;IAEf;;OAEG;IACH;QACI,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC;IACtB,CAAC;IAED,aAAa;IAEb,qBAAqB;IAErB;;;;;;;OAOG;IACI,MAAM,KAAK,EAAE;QAChB,OAAO,gBAAgB,CAAC;IAC5B,CAAC;IAED;;;;OAIG;IACH,IACW,OAAO;QACd,OAAO,IAAI,CAAC,QAAQ,CAAC;IACzB,CAAC;IACD,IAAW,OAAO,CAAC,KAAa;QAC5B,IAAI,IAAI,CAAC,QAAQ,KAAK,KAAK,EAAE,CAAC;YAC1B,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;YACtB,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;QAClC,CAAC;IACL,CAAC;CAIJ,CAAA;AAbG;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;6CAG1B;AA7CQ,cAAc;IAV1B,SAAS,CAAC;QACP,QAAQ,EAAE,gBAAgB;QAC1B,QAAQ,EAAE,sBAAsB;QAChC,MAAM,EAAE;YACJ,GAAG,EAAE,sBAAsB;YAC3B,KAAK,EAAE,wBAAwB;YAC/B,YAAY,EAAE,+BAA+B;SAChD;QACD,OAAO,EAAE,EAAE;KACd,CAAC;;GACW,cAAc,CAuD1B"}

package/Controls/Components/Layouts/Page/PageElement.d.ts

@@ -2,20 +2,54 @@ import { CustomElement } from '../../Abstracts/CustomElement';
 import type { IPageElementProps } from './IPageElementProps';
 declare const PageElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor;
 /**
- * Page - A top-level container that represents a distinct section or view within an application or website.
+ * Page - A semantic container element that represents a complete application view or document section.
  *
+ * Provides structured slots for organizing page layout with header, content, and footer areas.
+ * Includes responsive breakpoint support for adaptive layouts across different screen sizes.
+ *
+ * @name PageElement
  * @element mosaik-page
+ * @category Layout
+ *
+ * @slot preHeader - Content displayed before the main header (e.g., notifications, alerts)
+ * @slot header - Primary page header content (e.g., navigation, title, actions)
+ * @slot preContent - Content between header and main content (e.g., breadcrumbs, filters)
+ * @slot content - Main page content area
+ * @slot footer - Page footer content (e.g., copyright, links)
+ *
+ * @csspart scroll-panel-header - Container for header sections that scroll with content
+ *
+ * @cssprop --page-max-width - Maximum width constraint for page content
+ * @cssprop --page-padding - Padding applied to page container
+ * @cssprop --page-gap - Spacing between page sections
  *
- * @slot preHeader - The header of the page.
- * @slot header - The header of the page.
- * @slot preContent - The pre content of the page.
- * @slot content - The content of the page.
- * @slot footer - The footer of the page.
+ * @dependency PageHeaderElement - Provides header layout structure
+ * @dependency PageContentElement - Provides content area structure
  *
- * @csspart scroll-panel-header - The header part of the scroll panel.
+ * @example
+ * ```html
+ * <!-- Basic page layout -->
+ * <mosaik-page>
+ *   <header slot="header">
+ *     <h1>Page Title</h1>
+ *     <nav>Navigation</nav>
+ *   </header>
+ *   <main slot="content">
+ *     <p>Main page content</p>
+ *   </main>
+ *   <footer slot="footer">
+ *     <p>© 2024 Company</p>
+ *   </footer>
+ * </mosaik-page>
  *
- * @dependency {PageHeaderElement} - The Page Header element.
- * @dependency {PageContentElement} - The Page Content element.
+ * <!-- Page with responsive breakpoint -->
+ * <mosaik-page breakpoint="tablet">
+ *   <div slot="preHeader">Alert banner</div>
+ *   <header slot="header">Page header</header>
+ *   <nav slot="preContent">Breadcrumbs</nav>
+ *   <article slot="content">Article content</article>
+ * </mosaik-page>
+ * ```
  *
  * @public
  */

package/Controls/Components/Layouts/Page/PageElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PageElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Layouts/Page/PageElement.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;;AAW7D;;;;;;;;;;;;;;;;;GAiBG;AACH,qBAaa,WACT,SAAQ,gBACR,YAAW,iBAAiB;IAI5B,OAAO,CAAC,WAAW,CAAS;IAM5B;;OAEG;;IAWH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;OAKG;IACH,IACW,UAAU,IAAI,MAAM,CAE9B;IAED,IAAW,UAAU,CAAC,KAAK,EAAE,MAAM,EAKlC;CAIJ;AAED;;GAEG;AACH,yBAAiB,WAAW,CAAC;IACzB,KAAY,KAAK,GAAG,iBAAiB,CAAC;CACzC;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,aAAa,EAAE,WAAW,CAAC;KAC9B;CACJ"}
+{"version":3,"file":"PageElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Layouts/Page/PageElement.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;;AAW7D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmDG;AACH,qBAaa,WACT,SAAQ,gBACR,YAAW,iBAAiB;IAI5B,OAAO,CAAC,WAAW,CAAS;IAM5B;;OAEG;;IAWH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;OAKG;IACH,IACW,UAAU,IAAI,MAAM,CAE9B;IAED,IAAW,UAAU,CAAC,KAAK,EAAE,MAAM,EAKlC;CAIJ;AAED;;GAEG;AACH,yBAAiB,WAAW,CAAC;IACzB,KAAY,KAAK,GAAG,iBAAiB,CAAC;CACzC;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IAEX,UAAU,qBAAqB;QAE3B,aAAa,EAAE,WAAW,CAAC;KAC9B;CACJ"}

package/Controls/Components/Layouts/Page/PageElement.js

@@ -20,20 +20,54 @@ import { pageElementCosmopolitanStyle } from './Themes/PageElement.Cosmopolitan'
 import { Themeable } from '../../../Behaviors/Themeable';
 // #endregion
 /**
- * Page - A top-level container that represents a distinct section or view within an application or website.
+ * Page - A semantic container element that represents a complete application view or document section.
  *
+ * Provides structured slots for organizing page layout with header, content, and footer areas.
+ * Includes responsive breakpoint support for adaptive layouts across different screen sizes.
+ *
+ * @name PageElement
  * @element mosaik-page
+ * @category Layout
+ *
+ * @slot preHeader - Content displayed before the main header (e.g., notifications, alerts)
+ * @slot header - Primary page header content (e.g., navigation, title, actions)
+ * @slot preContent - Content between header and main content (e.g., breadcrumbs, filters)
+ * @slot content - Main page content area
+ * @slot footer - Page footer content (e.g., copyright, links)
+ *
+ * @csspart scroll-panel-header - Container for header sections that scroll with content
+ *
+ * @cssprop --page-max-width - Maximum width constraint for page content
+ * @cssprop --page-padding - Padding applied to page container
+ * @cssprop --page-gap - Spacing between page sections
  *
- * @slot preHeader - The header of the page.
- * @slot header - The header of the page.
- * @slot preContent - The pre content of the page.
- * @slot content - The content of the page.
- * @slot footer - The footer of the page.
+ * @dependency PageHeaderElement - Provides header layout structure
+ * @dependency PageContentElement - Provides content area structure
  *
- * @csspart scroll-panel-header - The header part of the scroll panel.
+ * @example
+ * ```html
+ * <!-- Basic page layout -->
+ * <mosaik-page>
+ *   <header slot="header">
+ *     <h1>Page Title</h1>
+ *     <nav>Navigation</nav>
+ *   </header>
+ *   <main slot="content">
+ *     <p>Main page content</p>
+ *   </main>
+ *   <footer slot="footer">
+ *     <p>© 2024 Company</p>
+ *   </footer>
+ * </mosaik-page>
  *
- * @dependency {PageHeaderElement} - The Page Header element.
- * @dependency {PageContentElement} - The Page Content element.
+ * <!-- Page with responsive breakpoint -->
+ * <mosaik-page breakpoint="tablet">
+ *   <div slot="preHeader">Alert banner</div>
+ *   <header slot="header">Page header</header>
+ *   <nav slot="preContent">Breadcrumbs</nav>
+ *   <article slot="content">Article content</article>
+ * </mosaik-page>
+ * ```
  *
  * @public
  */

package/Controls/Components/Layouts/Page/PageElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"PageElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Layouts/Page/PageElement.ts"],"names":[],"mappings":"AAAA,kBAAkB;;;;;;;;;;AAElB,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE9D,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,4BAA4B,EAAE,MAAM,mCAAmC,CAAC;AACjF,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD,aAAa;AAEb;;;;;;;;;;;;;;;;;GAiBG;AAcI,IAAM,WAAW,GAAjB,MAAM,WACT,SAAQ,SAAS,CAAC,aAAa,CAAC;IAGhC,iBAAiB;IAET,WAAW,CAAS;IAE5B,aAAa;IAEb,eAAe;IAEf;;OAEG;IACH;QACI,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC;IAC1B,CAAC;IAED,aAAa;IAEb,qBAAqB;IAErB;;;;;;;OAOG;IACI,MAAM,KAAK,EAAE;QAChB,OAAO,aAAa,CAAC;IACzB,CAAC;IAED;;;;;OAKG;IACH,IACW,UAAU;QACjB,OAAO,IAAI,CAAC,WAAW,CAAC;IAC5B,CAAC;IAED,IAAW,UAAU,CAAC,KAAa;QAC/B,IAAI,IAAI,CAAC,WAAW,KAAK,KAAK,EAAE,CAAC;YAC7B,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;YACzB,IAAI,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;QACrC,CAAC;IACL,CAAC;CAIJ,CAAA;AAdG;IAAC,SAAS,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;6CAG3B;AA9CQ,WAAW;IAbvB,SAAS,CAAC;QACP,QAAQ,EAAE,aAAa;QACvB,QAAQ,EAAE,mBAAmB;QAC7B,MAAM,EAAE;YACJ,GAAG,EAAE,mBAAmB;YACxB,KAAK,EAAE,qBAAqB;YAC5B,YAAY,EAAE,4BAA4B;SAC7C;QACD,OAAO,EAAE;YACL,iBAAiB;YACjB,kBAAkB;SACrB;KACJ,CAAC;;GACW,WAAW,CAyDvB"}
+{"version":3,"file":"PageElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Layouts/Page/PageElement.ts"],"names":[],"mappings":"AAAA,kBAAkB;;;;;;;;;;AAElB,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE9D,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AACnE,OAAO,EAAE,4BAA4B,EAAE,MAAM,mCAAmC,CAAC;AACjF,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD,aAAa;AAEb;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmDG;AAcI,IAAM,WAAW,GAAjB,MAAM,WACT,SAAQ,SAAS,CAAC,aAAa,CAAC;IAGhC,iBAAiB;IAET,WAAW,CAAS;IAE5B,aAAa;IAEb,eAAe;IAEf;;OAEG;IACH;QACI,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC;IAC1B,CAAC;IAED,aAAa;IAEb,qBAAqB;IAErB;;;;;;;OAOG;IACI,MAAM,KAAK,EAAE;QAChB,OAAO,aAAa,CAAC;IACzB,CAAC;IAED;;;;;OAKG;IACH,IACW,UAAU;QACjB,OAAO,IAAI,CAAC,WAAW,CAAC;IAC5B,CAAC;IAED,IAAW,UAAU,CAAC,KAAa;QAC/B,IAAI,IAAI,CAAC,WAAW,KAAK,KAAK,EAAE,CAAC;YAC7B,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;YACzB,IAAI,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;QACrC,CAAC;IACL,CAAC;CAIJ,CAAA;AAdG;IAAC,SAAS,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;6CAG3B;AA9CQ,WAAW;IAbvB,SAAS,CAAC;QACP,QAAQ,EAAE,aAAa;QACvB,QAAQ,EAAE,mBAAmB;QAC7B,MAAM,EAAE;YACJ,GAAG,EAAE,mBAAmB;YACxB,KAAK,EAAE,qBAAqB;YAC5B,YAAY,EAAE,4BAA4B;SAC7C;QACD,OAAO,EAAE;YACL,iBAAiB;YACjB,kBAAkB;SACrB;KACJ,CAAC;;GACW,WAAW,CAyDvB"}

package/Controls/Components/Layouts/Split/SplitElement.d.ts

@@ -8,22 +8,53 @@ import type { ISplitElementProps } from './ISplitElementProps';
 import { ISlottable } from '../../../Behaviors/Slottable';
 declare const SplitElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Reversible").IReversibleProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Orientable").IOrientableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Disableable").IDisableableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Fitable").IFitableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Slottable").ISlottableProps & ISlottable) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor;
 /**
- * Split - A layout component that separates content by a draggable divider.
+ * Split - A layout component that creates a resizable split pane layout with a draggable divider.
  *
+ * Enables users to dynamically resize two content areas separated by an interactive divider.
+ * Supports both horizontal and vertical orientations, position locking, snapping, and keyboard navigation.
+ *
+ * @name SplitElement
  * @element mosaik-split
+ * @category Layout
+ *
+ * @slot start - The primary content panel positioned at the beginning of the split
+ * @slot end - The secondary content panel positioned at the end of the split
+ * @slot thumb - Custom grip icon for the draggable divider (defaults to three dots icon)
+ *
+ * @csspart panel - The container for each split panel content
+ * @csspart start - The start panel container
+ * @csspart end - The end panel container
+ * @csspart divider - The interactive draggable divider element
+ * @csspart thumb - The visual grip icon within the divider
+ *
+ * @cssprop --split-min - Minimum size constraint for the primary panel (default: 0%)
+ * @cssprop --split-max - Maximum size constraint for the primary panel (default: 100%)
+ * @cssprop --split-divider-width - Width/height of the divider based on orientation
+ *
+ * @dependency IconElement - For the default thumb grip icon
+ *
+ * @example
+ * ```html
+ * <!-- Basic split layout -->
+ * <mosaik-split position="30">
+ *   <div slot="start">Left Panel</div>
+ *   <div slot="end">Right Panel</div>
+ * </mosaik-split>
  *
- * @slot start - The start part.
- * @slot end - The end part.
- * @slot divider - The divider part.
+ * <!-- Vertical split with snapping -->
+ * <mosaik-split orientation="vertical" snaps="25% 50% 75%">
+ *   <div slot="start">Top Panel</div>
+ *   <div slot="end">Bottom Panel</div>
+ * </mosaik-split>
  *
- * @fires splitRepositioned - Fired when the split is repositioned.
+ * <!-- Locked split with custom thickness -->
+ * <mosaik-split lock="start" thickness="4" position="200px">
+ *   <nav slot="start">Navigation</nav>
+ *   <main slot="end">Content</main>
+ * </mosaik-split>
+ * ```
  *
- * @keyevent ArrowLeft - Moves the split to the left.
- * @keyevent ArrowRight - Moves the split to the right.
- * @keyevent ArrowUp - Moves the split up.
- * @keyevent ArrowDown - Moves the split down.
- * @keyevent Home - Moves the split to the start.
- * @keyevent End - Moves the split to the end.
+ * @fires splitRepositioned - Fired when the split position changes via user interaction
  *
  * @public
  */

package/Controls/Components/Layouts/Split/SplitElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SplitElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Layouts/Split/SplitElement.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"SplitElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Layouts/Split/SplitElement.ts"],"names":[],"mappings":"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"}

package/Controls/Components/Layouts/Split/SplitElement.js

@@ -34,22 +34,53 @@ import { Themeable } from '../../../Behaviors/Themeable';
 import { Slottable } from '../../../Behaviors/Slottable';
 // #endregion
 /**
- * Split - A layout component that separates content by a draggable divider.
+ * Split - A layout component that creates a resizable split pane layout with a draggable divider.
  *
+ * Enables users to dynamically resize two content areas separated by an interactive divider.
+ * Supports both horizontal and vertical orientations, position locking, snapping, and keyboard navigation.
+ *
+ * @name SplitElement
  * @element mosaik-split
+ * @category Layout
+ *
+ * @slot start - The primary content panel positioned at the beginning of the split
+ * @slot end - The secondary content panel positioned at the end of the split
+ * @slot thumb - Custom grip icon for the draggable divider (defaults to three dots icon)
+ *
+ * @csspart panel - The container for each split panel content
+ * @csspart start - The start panel container
+ * @csspart end - The end panel container
+ * @csspart divider - The interactive draggable divider element
+ * @csspart thumb - The visual grip icon within the divider
+ *
+ * @cssprop --split-min - Minimum size constraint for the primary panel (default: 0%)
+ * @cssprop --split-max - Maximum size constraint for the primary panel (default: 100%)
+ * @cssprop --split-divider-width - Width/height of the divider based on orientation
+ *
+ * @dependency IconElement - For the default thumb grip icon
+ *
+ * @example
+ * ```html
+ * <!-- Basic split layout -->
+ * <mosaik-split position="30">
+ *   <div slot="start">Left Panel</div>
+ *   <div slot="end">Right Panel</div>
+ * </mosaik-split>
  *
- * @slot start - The start part.
- * @slot end - The end part.
- * @slot divider - The divider part.
+ * <!-- Vertical split with snapping -->
+ * <mosaik-split orientation="vertical" snaps="25% 50% 75%">
+ *   <div slot="start">Top Panel</div>
+ *   <div slot="end">Bottom Panel</div>
+ * </mosaik-split>
  *
- * @fires splitRepositioned - Fired when the split is repositioned.
+ * <!-- Locked split with custom thickness -->
+ * <mosaik-split lock="start" thickness="4" position="200px">
+ *   <nav slot="start">Navigation</nav>
+ *   <main slot="end">Content</main>
+ * </mosaik-split>
+ * ```
  *
- * @keyevent ArrowLeft - Moves the split to the left.
- * @keyevent ArrowRight - Moves the split to the right.
- * @keyevent ArrowUp - Moves the split up.
- * @keyevent ArrowDown - Moves the split down.
- * @keyevent Home - Moves the split to the start.
- * @keyevent End - Moves the split to the end.
+ * @fires splitRepositioned - Fired when the split position changes via user interaction
  *
  * @public
  */