@bspk/ui 1.3.10 → 1.3.16

package/dist/components/Accordion/Accordion.d.ts

@@ -62,28 +62,30 @@ export type AccordionProps = {
  * @example
  *     import { Accordion } from '@bspk/ui/Accordion';
  *
- *     <Accordion
- *         singleOpen={true}
- *         items={[
- *             {
- *                 id: 1,
- *                 title: 'Lawrence Welk',
- *                 subtitle: 'The Champagne Music Maker',
- *                 children:
- *                     'Lawrence Welk was an American accordionist, bandleader, and television impresario, who hosted The Lawrence Welk Show from 1951 to 1982.',
- *             },
- *             {
- *                 id: 2,
- *                 title: 'Myron Floren',
- *                 subtitle: 'The Happy Norwegian',
- *                 children:
- *                     'Myron Floren was an American accordionist best known as the featured accordionist on The Lawrence Welk Show.',
- *             },
- *         ]}
- *     />;
+ *     <div style={{ width: 400 }}>
+ *         <Accordion
+ *             singleOpen={true}
+ *             items={[
+ *                 {
+ *                     id: 1,
+ *                     title: 'Lawrence Welk',
+ *                     subtitle: 'The Champagne Music Maker',
+ *                     children:
+ *                         'Lawrence Welk was an American accordionist, bandleader, and television impresario, who hosted The Lawrence Welk Show from 1951 to 1982.',
+ *                 },
+ *                 {
+ *                     id: 2,
+ *                     title: 'Myron Floren',
+ *                     subtitle: 'The Happy Norwegian',
+ *                     children:
+ *                         'Myron Floren was an American accordionist best known as the featured accordionist on The Lawrence Welk Show.',
+ *                 },
+ *             ]}
+ *         />
+ *     </div>;
  *
  * @name Accordion
- * @phase UXReview
+ * @phase Stable
  */
 export declare function Accordion({ items: itemsProp, singleOpen }: AccordionProps): import("react/jsx-runtime").JSX.Element;
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/Accordion/Accordion.js

@@ -12,28 +12,30 @@ import { randomString } from '../../utils/random';
  * @example
  *     import { Accordion } from '@bspk/ui/Accordion';
  *
- *     <Accordion
- *         singleOpen={true}
- *         items={[
- *             {
- *                 id: 1,
- *                 title: 'Lawrence Welk',
- *                 subtitle: 'The Champagne Music Maker',
- *                 children:
- *                     'Lawrence Welk was an American accordionist, bandleader, and television impresario, who hosted The Lawrence Welk Show from 1951 to 1982.',
- *             },
- *             {
- *                 id: 2,
- *                 title: 'Myron Floren',
- *                 subtitle: 'The Happy Norwegian',
- *                 children:
- *                     'Myron Floren was an American accordionist best known as the featured accordionist on The Lawrence Welk Show.',
- *             },
- *         ]}
- *     />;
+ *     <div style={{ width: 400 }}>
+ *         <Accordion
+ *             singleOpen={true}
+ *             items={[
+ *                 {
+ *                     id: 1,
+ *                     title: 'Lawrence Welk',
+ *                     subtitle: 'The Champagne Music Maker',
+ *                     children:
+ *                         'Lawrence Welk was an American accordionist, bandleader, and television impresario, who hosted The Lawrence Welk Show from 1951 to 1982.',
+ *                 },
+ *                 {
+ *                     id: 2,
+ *                     title: 'Myron Floren',
+ *                     subtitle: 'The Happy Norwegian',
+ *                     children:
+ *                         'Myron Floren was an American accordionist best known as the featured accordionist on The Lawrence Welk Show.',
+ *                 },
+ *             ]}
+ *         />
+ *     </div>;
  *
  * @name Accordion
- * @phase UXReview
+ * @phase Stable
  */
 export function Accordion({ items: itemsProp, singleOpen = true }) {
     const items = useMemo(() => itemsProp.map((item) => ({

package/dist/components/Accordion/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.js","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Accordion.js","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"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"}

package/dist/components/Accordion/AccordionExample.js

@@ -3,7 +3,7 @@ import { Avatar } from '../Avatar';
 const AccordionContent = () => (_jsx("p", { children: "Actualize the plan and markets. Going forward, we should harness the asset. Leverage skillsets to achieve maximum market share." }));
 export const presets = [
     {
-        label: 'Multiple Sections',
+        label: 'Default',
         propState: {
             items: [
                 {
@@ -28,7 +28,7 @@ export const presets = [
         },
     },
     {
-        label: 'Multiple Sections with 1 disabled',
+        label: '1 disabled',
         propState: {
             items: [
                 {
@@ -42,7 +42,8 @@ export const presets = [
         },
     },
     {
-        label: 'Multiple Sections with 1 disabled and open',
+        label: '1 disabled and open (but not showing)',
+        hideDemo: true,
         propState: {
             items: [
                 {
@@ -57,7 +58,7 @@ export const presets = [
     },
 ];
 export const AccordionExample = () => ({
-    containerStyle: { minHeight: 225 },
+    containerStyle: { width: 400, minHeight: 225 },
     defaultState: {
         items: [
             {

package/dist/components/Accordion/AccordionExample.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionExample.js","sourceRoot":"","sources":["../../../src/components/Accordion/AccordionExample.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAG7C,MAAM,gBAAgB,GAAG,GAAG,EAAE,CAAC,CAC3B,0JAGI,CACP,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAA6B;IAC7C;QACI,KAAK,EAAE,mBAAmB;QAC1B,SAAS,EAAE;YACP,KAAK,EAAE;gBACH;oBACI,EAAE,EAAE,GAAG;oBACP,KAAK,EAAE,WAAW;oBAClB,QAAQ,EAAE,UAAU;oBACpB,QAAQ,EAAE,KAAC,gBAAgB,KAAG;iBACjC;gBACD;oBACI,EAAE,EAAE,GAAG;oBACP,KAAK,EAAE,WAAW;oBAClB,QAAQ,EAAE,KAAC,gBAAgB,KAAG;oBAC9B,OAAO,EAAE,KAAC,MAAM,IAAC,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,GAAG;oBAC9C,QAAQ,EAAE,sCAAqB;iBAClC;gBACD;oBACI,EAAE,EAAE,GAAG;oBACP,KAAK,EAAE,WAAW;oBAClB,QAAQ,EAAE,KAAC,gBAAgB,KAAG;iBACjC;aACJ;SACJ;KACJ;IACD;QACI,KAAK,EAAE,mCAAmC;QAC1C,SAAS,EAAE;YACP,KAAK,EAAE;gBACH;oBACI,EAAE,EAAE,GAAG;oBACP,KAAK,EAAE,WAAW;oBAClB,QAAQ,EAAE,KAAC,gBAAgB,KAAG;iBACjC;gBACD,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAC,gBAAgB,KAAG,EAAE;gBAC/E,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,KAAC,gBAAgB,KAAG,EAAE;aAClE;SACJ;KACJ;IACD;QACI,KAAK,EAAE,4CAA4C;QACnD,SAAS,EAAE;YACP,KAAK,EAAE;gBACH;oBACI,EAAE,EAAE,GAAG;oBACP,KAAK,EAAE,WAAW;oBAClB,QAAQ,EAAE,KAAC,gBAAgB,KAAG;iBACjC;gBACD,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAC,gBAAgB,KAAG,EAAE;gBAC7F,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,KAAC,gBAAgB,KAAG,EAAE;aAClE;SACJ;KACJ;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAuC,GAAG,EAAE,CAAC,CAAC;IACvE,cAAc,EAAE,EAAE,SAAS,EAAE,GAAG,EAAE;IAClC,YAAY,EAAE;QACV,KAAK,EAAE;YACH;gBACI,EAAE,EAAE,GAAG;gBACP,KAAK,EAAE,WAAW;gBAClB,QAAQ,EAAE,KAAC,gBAAgB,KAAG;aACjC;YACD;gBACI,EAAE,EAAE,GAAG;gBACP,KAAK,EAAE,WAAW;gBAClB,QAAQ,EAAE,KAAC,gBAAgB,KAAG;gBAC9B,OAAO,EAAE,KAAC,MAAM,IAAC,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,GAAG;gBAC9C,QAAQ,EAAE,sCAAqB;aAClC;YACD;gBACI,EAAE,EAAE,GAAG;gBACP,KAAK,EAAE,WAAW;gBAClB,QAAQ,EAAE,KAAC,gBAAgB,KAAG;aACjC;SACJ;KACJ;IACD,OAAO;IACP,QAAQ,EAAE,KAAK;CAClB,CAAC,CAAC"}
+{"version":3,"file":"AccordionExample.js","sourceRoot":"","sources":["../../../src/components/Accordion/AccordionExample.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAG7C,MAAM,gBAAgB,GAAG,GAAG,EAAE,CAAC,CAC3B,0JAGI,CACP,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAA6B;IAC7C;QACI,KAAK,EAAE,SAAS;QAChB,SAAS,EAAE;YACP,KAAK,EAAE;gBACH;oBACI,EAAE,EAAE,GAAG;oBACP,KAAK,EAAE,WAAW;oBAClB,QAAQ,EAAE,UAAU;oBACpB,QAAQ,EAAE,KAAC,gBAAgB,KAAG;iBACjC;gBACD;oBACI,EAAE,EAAE,GAAG;oBACP,KAAK,EAAE,WAAW;oBAClB,QAAQ,EAAE,KAAC,gBAAgB,KAAG;oBAC9B,OAAO,EAAE,KAAC,MAAM,IAAC,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,GAAG;oBAC9C,QAAQ,EAAE,sCAAqB;iBAClC;gBACD;oBACI,EAAE,EAAE,GAAG;oBACP,KAAK,EAAE,WAAW;oBAClB,QAAQ,EAAE,KAAC,gBAAgB,KAAG;iBACjC;aACJ;SACJ;KACJ;IACD;QACI,KAAK,EAAE,YAAY;QACnB,SAAS,EAAE;YACP,KAAK,EAAE;gBACH;oBACI,EAAE,EAAE,GAAG;oBACP,KAAK,EAAE,WAAW;oBAClB,QAAQ,EAAE,KAAC,gBAAgB,KAAG;iBACjC;gBACD,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAC,gBAAgB,KAAG,EAAE;gBAC/E,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,KAAC,gBAAgB,KAAG,EAAE;aAClE;SACJ;KACJ;IACD;QACI,KAAK,EAAE,uCAAuC;QAC9C,QAAQ,EAAE,IAAI;QACd,SAAS,EAAE;YACP,KAAK,EAAE;gBACH;oBACI,EAAE,EAAE,GAAG;oBACP,KAAK,EAAE,WAAW;oBAClB,QAAQ,EAAE,KAAC,gBAAgB,KAAG;iBACjC;gBACD,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAC,gBAAgB,KAAG,EAAE;gBAC7F,EAAE,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,KAAC,gBAAgB,KAAG,EAAE;aAClE;SACJ;KACJ;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAuC,GAAG,EAAE,CAAC,CAAC;IACvE,cAAc,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,EAAE;IAC9C,YAAY,EAAE;QACV,KAAK,EAAE;YACH;gBACI,EAAE,EAAE,GAAG;gBACP,KAAK,EAAE,WAAW;gBAClB,QAAQ,EAAE,KAAC,gBAAgB,KAAG;aACjC;YACD;gBACI,EAAE,EAAE,GAAG;gBACP,KAAK,EAAE,WAAW;gBAClB,QAAQ,EAAE,KAAC,gBAAgB,KAAG;gBAC9B,OAAO,EAAE,KAAC,MAAM,IAAC,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,GAAG;gBAC9C,QAAQ,EAAE,sCAAqB;aAClC;YACD;gBACI,EAAE,EAAE,GAAG;gBACP,KAAK,EAAE,WAAW;gBAClB,QAAQ,EAAE,KAAC,gBAAgB,KAAG;aACjC;SACJ;KACJ;IACD,OAAO;IACP,QAAQ,EAAE,KAAK;CAClB,CAAC,CAAC"}

package/dist/components/Avatar/Avatar.d.ts

@@ -76,7 +76,6 @@ export type AvatarProps = CommonProps<'disabled'> & {
  *         image="/avatar-01.png"
  *         initials="AR"
  *         name="Andre Giant"
- *         hideTooltip
  *         size="large"
  *         disabled={false}
  *         onClick={() => action('Launch avatar popover')}
@@ -87,7 +86,7 @@ export type AvatarProps = CommonProps<'disabled'> & {
  * @exampleDescription The image if provided is displayed first, followed by the icon if provided, and finally the initials. If no initials are provided, the first two letters of the name will be used as initials.
  *
  * @name Avatar
- * @phase UXReview
+ * @phase Stable
  */
 export declare function Avatar({ initials: initialsProp, color, size, showIcon, image, name, hideTooltip, onClick, disabled, ...props }: AvatarProps): import("react/jsx-runtime").JSX.Element | null;
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/Avatar/Avatar.js

@@ -15,7 +15,6 @@ import { Tooltip } from '../Tooltip';
  *         image="/avatar-01.png"
  *         initials="AR"
  *         name="Andre Giant"
- *         hideTooltip
  *         size="large"
  *         disabled={false}
  *         onClick={() => action('Launch avatar popover')}
@@ -26,9 +25,9 @@ import { Tooltip } from '../Tooltip';
  * @exampleDescription The image if provided is displayed first, followed by the icon if provided, and finally the initials. If no initials are provided, the first two letters of the name will be used as initials.
  *
  * @name Avatar
- * @phase UXReview
+ * @phase Stable
  */
-export function Avatar({ initials: initialsProp, color = 'grey', size = 'small', showIcon, image, name, hideTooltip = false, onClick, disabled, ...props }) {
+export function Avatar({ initials: initialsProp, color = 'grey', size = 'small', showIcon, image, name, hideTooltip = false, onClick, disabled = false, ...props }) {
     const children = useMemo(() => {
         if (image)
             return _jsx("img", { alt: name, "aria-hidden": true, src: image });

package/dist/components/Avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":";AAAA,OAAO,eAAe,CAAC;AACvB,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,EAAE,OAAO,EAAuB,MAAM,sBAAsB,CAAC;AA8EpE;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,MAAM,UAAU,MAAM,CAAC,EACnB,QAAQ,EAAE,YAAY,EACtB,KAAK,GAAG,MAAM,EACd,IAAI,GAAG,OAAO,EACd,QAAQ,EACR,KAAK,EACL,IAAI,EACJ,WAAW,GAAG,KAAK,EACnB,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACE;IACV,MAAM,QAAQ,GAAG,OAAO,CAAC,GAAG,EAAE;QAC1B,IAAI,KAAK;YAAE,OAAO,cAAK,GAAG,EAAE,IAAI,iBAAe,IAAI,EAAE,GAAG,EAAE,KAAK,GAAI,CAAC;QAEpE,IAAI,QAAQ;YACR,OAAO,CACH,8BAAmB,IAAI,+BACnB,KAAC,SAAS,KAAG,GACV,CACV,CAAC;QAEN,IAAI,QAAQ,GAAG,YAAY,CAAC;QAE5B,IAAI,IAAI,IAAI,CAAC,QAAQ;YACjB,QAAQ,GAAG,IAAI;iBACV,KAAK,CAAC,GAAG,CAAC;iBACV,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;iBAC7B,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC;iBACX,IAAI,CAAC,EAAE,CAAC;iBACR,WAAW,EAAE,CAAC;QAEvB,IAAI,QAAQ;YACR,OAAO,CACH,8BAAmB,IAAI,mCAClB,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,GAClB,CACV,CAAC;QAEN,OAAO,IAAI,CAAC;IAChB,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC;IAE1C,IAAI,CAAC,QAAQ;QAAE,OAAO,IAAI,CAAC;IAE3B,MAAM,MAAM,GAAG,CAAC,YAAiC,EAAE,EAAE,CAAC,CAClD,iBACQ,KAAK,KACL,YAAY,mBACD,QAAQ,IAAI,SAAS,gBACxB,IAAI,0BACK,QAAQ,eACnB,QAAQ,gBACN,KAAK,eACN,IAAI,EACf,cAAc,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,EAC9C,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,EAChC,QAAQ,EAAE,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,YAE7C,QAAQ,GACP,CACT,CAAC;IAEF,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,KAAC,OAAO,IAAC,KAAK,EAAE,IAAI,YAAG,MAAM,GAAW,CAAC,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;AAChF,CAAC"}
+{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":";AAAA,OAAO,eAAe,CAAC;AACvB,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,EAAE,OAAO,EAAuB,MAAM,sBAAsB,CAAC;AA8EpE;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,MAAM,UAAU,MAAM,CAAC,EACnB,QAAQ,EAAE,YAAY,EACtB,KAAK,GAAG,MAAM,EACd,IAAI,GAAG,OAAO,EACd,QAAQ,EACR,KAAK,EACL,IAAI,EACJ,WAAW,GAAG,KAAK,EACnB,OAAO,EACP,QAAQ,GAAG,KAAK,EAChB,GAAG,KAAK,EACE;IACV,MAAM,QAAQ,GAAG,OAAO,CAAC,GAAG,EAAE;QAC1B,IAAI,KAAK;YAAE,OAAO,cAAK,GAAG,EAAE,IAAI,iBAAe,IAAI,EAAE,GAAG,EAAE,KAAK,GAAI,CAAC;QAEpE,IAAI,QAAQ;YACR,OAAO,CACH,8BAAmB,IAAI,+BACnB,KAAC,SAAS,KAAG,GACV,CACV,CAAC;QAEN,IAAI,QAAQ,GAAG,YAAY,CAAC;QAE5B,IAAI,IAAI,IAAI,CAAC,QAAQ;YACjB,QAAQ,GAAG,IAAI;iBACV,KAAK,CAAC,GAAG,CAAC;iBACV,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;iBAC7B,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC;iBACX,IAAI,CAAC,EAAE,CAAC;iBACR,WAAW,EAAE,CAAC;QAEvB,IAAI,QAAQ;YACR,OAAO,CACH,8BAAmB,IAAI,mCAClB,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,GAClB,CACV,CAAC;QAEN,OAAO,IAAI,CAAC;IAChB,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC;IAE1C,IAAI,CAAC,QAAQ;QAAE,OAAO,IAAI,CAAC;IAE3B,MAAM,MAAM,GAAG,CAAC,YAAiC,EAAE,EAAE,CAAC,CAClD,iBACQ,KAAK,KACL,YAAY,mBACD,QAAQ,IAAI,SAAS,gBACxB,IAAI,0BACK,QAAQ,eACnB,QAAQ,gBACN,KAAK,eACN,IAAI,EACf,cAAc,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,EAC9C,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,EAChC,QAAQ,EAAE,OAAO,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,YAE7C,QAAQ,GACP,CACT,CAAC;IAEF,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC,KAAC,OAAO,IAAC,KAAK,EAAE,IAAI,YAAG,MAAM,GAAW,CAAC,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;AAChF,CAAC"}

package/dist/components/Avatar/avatar.css

@@ -6,6 +6,12 @@
   --font: var(--labels-base);
   --svg-size: var(--spacing-sizing-10);
   border: var(--avatar-border);
+}
+[data-bspk=avatar]:not([data-color]) {
+  --foreground: var(--foreground-neutral-on-surface);
+  --background: var(--surface-neutral-t3-low);
+}
+[data-bspk=avatar] {
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -21,11 +27,6 @@
   flex-shrink: 0;
   flex-grow: 0;
   position: relative;
-  --state-background: transparent;
-}
-[data-bspk=avatar]:not([data-color]) {
-  --foreground: var(--foreground-neutral-on-surface);
-  --background: var(--surface-neutral-t3-low);
 }
 [data-bspk=avatar]:has(img) {
   overflow: hidden;
@@ -91,6 +92,9 @@
   --font: var(--display-regular-large);
   --svg-size: var(--spacing-sizing-18);
 }
+[data-bspk=avatar] {
+  --state-background: transparent;
+}
 [data-bspk=avatar]::after {
   content: "";
   position: absolute;
@@ -99,14 +103,15 @@
   border-radius: var(--radius-full);
   background: var(--state-background);
 }
-[data-bspk=avatar]:hover {
+[data-bspk=avatar]:not([aria-disabled]):hover {
   --state-background: var(--interactions-neutral-hover-opacity);
 }
-[data-bspk=avatar]:active {
+[data-bspk=avatar]:not([aria-disabled]):active {
   --state-background: var(--interactions-neutral-press-opacity);
 }
-[data-bspk=avatar][disabled] {
+[data-bspk=avatar][aria-disabled] {
   opacity: 0.5;
+  cursor: not-allowed;
 }
 [data-bspk=avatar]:focus:not(:active) {
   outline: 2px solid var(--stroke-neutral-focus);

package/dist/components/Avatar/avatar.css.js

@@ -9,6 +9,12 @@ style.appendChild(document.createTextNode(`[data-bspk=avatar] {
   --font: var(--labels-base);
   --svg-size: var(--spacing-sizing-10);
   border: var(--avatar-border);
+}
+[data-bspk=avatar]:not([data-color]) {
+  --foreground: var(--foreground-neutral-on-surface);
+  --background: var(--surface-neutral-t3-low);
+}
+[data-bspk=avatar] {
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -24,11 +30,6 @@ style.appendChild(document.createTextNode(`[data-bspk=avatar] {
   flex-shrink: 0;
   flex-grow: 0;
   position: relative;
-  --state-background: transparent;
-}
-[data-bspk=avatar]:not([data-color]) {
-  --foreground: var(--foreground-neutral-on-surface);
-  --background: var(--surface-neutral-t3-low);
 }
 [data-bspk=avatar]:has(img) {
   overflow: hidden;
@@ -94,6 +95,9 @@ style.appendChild(document.createTextNode(`[data-bspk=avatar] {
   --font: var(--display-regular-large);
   --svg-size: var(--spacing-sizing-18);
 }
+[data-bspk=avatar] {
+  --state-background: transparent;
+}
 [data-bspk=avatar]::after {
   content: "";
   position: absolute;
@@ -102,14 +106,15 @@ style.appendChild(document.createTextNode(`[data-bspk=avatar] {
   border-radius: var(--radius-full);
   background: var(--state-background);
 }
-[data-bspk=avatar]:hover {
+[data-bspk=avatar]:not([aria-disabled]):hover {
   --state-background: var(--interactions-neutral-hover-opacity);
 }
-[data-bspk=avatar]:active {
+[data-bspk=avatar]:not([aria-disabled]):active {
   --state-background: var(--interactions-neutral-press-opacity);
 }
-[data-bspk=avatar][disabled] {
+[data-bspk=avatar][aria-disabled] {
   opacity: 0.5;
+  cursor: not-allowed;
 }
 [data-bspk=avatar]:focus:not(:active) {
   outline: 2px solid var(--stroke-neutral-focus);

package/dist/components/AvatarGroup/AvatarGroup.d.ts

@@ -79,6 +79,6 @@ export type AvatarGroupProps = CommonProps<'style'> & {
  *     />;
  *
  * @name AvatarGroup
- * @phase UXReview
+ * @phase Stable
  */
 export declare function AvatarGroup({ items, size, max: maxProp, variant, style }: AvatarGroupProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/AvatarGroup/AvatarGroup.js

@@ -38,7 +38,7 @@ import { Avatar } from '../Avatar';
  *     />;
  *
  * @name AvatarGroup
- * @phase UXReview
+ * @phase Stable
  */
 export function AvatarGroup({ items, size = 'small', max: maxProp = 5, variant = 'stacked', style }) {
     const max = maxProp > items.length ? items.length : maxProp;

package/dist/components/Badge/Badge.d.ts

@@ -50,7 +50,7 @@ export type BadgeProps = {
  * @exampleDescription This example shows a badge with a count of 5, size small, and primary variant.
  *
  * @name Badge
- * @phase UXReview
+ * @phase Stable
  */
 export declare function Badge({ count: countProp, size, surfaceBorder, children, color }: BadgeProps): string | number | true | Iterable<ReactNode> | import("react/jsx-runtime").JSX.Element | null;
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/Badge/Badge.js

@@ -12,7 +12,7 @@ import { tryIntParse } from '../../utils/tryIntPsrse';
  * @exampleDescription This example shows a badge with a count of 5, size small, and primary variant.
  *
  * @name Badge
- * @phase UXReview
+ * @phase Stable
  */
 export function Badge({ count: countProp, size = 'small', surfaceBorder, children, color = 'primary' }) {
     const count = tryIntParse(countProp);

package/dist/components/Badge/BadgeExample.js

@@ -4,7 +4,6 @@ export const BadgeExample = {
     render: ({ props, Component }) => {
         return (_jsx(Component, { ...props, children: _jsx(Avatar, { image: "/avatar-01.png", name: "Andre Giant" }) }));
     },
-    containerStyle: { width: '100%' },
     variants: {
         surfaceBorder: { color: { options: ['primary', 'secondary'] } },
         size: { count: { options: [9, 99, 999] } },

package/dist/components/Badge/BadgeExample.js.map

@@ -1 +1 @@
-{"version":3,"file":"BadgeExample.js","sourceRoot":"","sources":["../../../src/components/Badge/BadgeExample.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAG7C,MAAM,CAAC,MAAM,YAAY,GAAiC;IACtD,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;QAC7B,OAAO,CACH,KAAC,SAAS,OAAK,KAAK,YAChB,KAAC,MAAM,IAAC,KAAK,EAAC,gBAAgB,EAAC,IAAI,EAAC,aAAa,GAAG,GAC5C,CACf,CAAC;IACN,CAAC;IACD,cAAc,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE;IACjC,QAAQ,EAAE;QACN,aAAa,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,CAAC,SAAS,EAAE,WAAW,CAAC,EAAE,EAAE;QAC/D,IAAI,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,GAAG,CAAC,EAAE,EAAE;KAC7C;CACJ,CAAC"}
+{"version":3,"file":"BadgeExample.js","sourceRoot":"","sources":["../../../src/components/Badge/BadgeExample.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAG7C,MAAM,CAAC,MAAM,YAAY,GAAiC;IACtD,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;QAC7B,OAAO,CACH,KAAC,SAAS,OAAK,KAAK,YAChB,KAAC,MAAM,IAAC,KAAK,EAAC,gBAAgB,EAAC,IAAI,EAAC,aAAa,GAAG,GAC5C,CACf,CAAC;IACN,CAAC;IACD,QAAQ,EAAE;QACN,aAAa,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,CAAC,SAAS,EAAE,WAAW,CAAC,EAAE,EAAE;QAC/D,IAAI,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,GAAG,CAAC,EAAE,EAAE;KAC7C;CACJ,CAAC"}

package/dist/components/BadgeDot/BadgeDot.d.ts

@@ -40,7 +40,7 @@ export type BadgeDotProps = {
  * @exampleDescription This example shows a badge-dot with a count of 5, size small, and primary variant.
  *
  * @name BadgeDot
- * @phase UXReview
+ * @phase Stable
  */
 export declare function BadgeDot({ children, color, size: sizeProp, outline }: BadgeDotProps): import("react/jsx-runtime").JSX.Element;
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/BadgeDot/BadgeDot.js

@@ -20,7 +20,7 @@ const OUTLINE_WIDTHS = {
  * @exampleDescription This example shows a badge-dot with a count of 5, size small, and primary variant.
  *
  * @name BadgeDot
- * @phase UXReview
+ * @phase Stable
  */
 export function BadgeDot({ children, color = 'primary', size: sizeProp = 6, outline = false }) {
     const size = sizeProp in OUTLINE_WIDTHS ? sizeProp : 6;

package/dist/components/BadgeDot/BadgeDotExample.js

@@ -2,7 +2,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Avatar } from '../Avatar';
 import { Button } from '../Button';
 export const BadgeDotExample = {
-    containerStyle: { width: '100%' },
     defaultState: {},
     disableProps: [],
     render: ({ props, Component }) => {

package/dist/components/BadgeDot/BadgeDotExample.js.map

@@ -1 +1 @@
-{"version":3,"file":"BadgeDotExample.js","sourceRoot":"","sources":["../../../src/components/BadgeDot/BadgeDotExample.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAG7C,MAAM,CAAC,MAAM,eAAe,GAAoC;IAC5D,cAAc,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE;IACjC,YAAY,EAAE,EAAE;IAChB,YAAY,EAAE,EAAE;IAChB,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;QAC7B,OAAO,CACH,KAAC,SAAS,OAAK,KAAK,YACf,KAAK,CAAC,OAAO,KAAK,IAAI,CAAC,CAAC,CAAC,CACtB,KAAC,MAAM,IAAC,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,GAAG,CACzC,CAAC,CAAC,CAAC,CACA,KAAC,MAAM,IAAC,KAAK,EAAC,gBAAgB,EAAC,IAAI,EAAC,aAAa,GAAG,CACvD,GACO,CACf,CAAC;IACN,CAAC;IACD,QAAQ,EAAE,EAAE;IACZ,QAAQ,EAAE;QACN,OAAO,EAAE,EAAE,IAAI,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE;KACjD;CACJ,CAAC"}
+{"version":3,"file":"BadgeDotExample.js","sourceRoot":"","sources":["../../../src/components/BadgeDot/BadgeDotExample.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAG7C,MAAM,CAAC,MAAM,eAAe,GAAoC;IAC5D,YAAY,EAAE,EAAE;IAChB,YAAY,EAAE,EAAE;IAChB,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;QAC7B,OAAO,CACH,KAAC,SAAS,OAAK,KAAK,YACf,KAAK,CAAC,OAAO,KAAK,IAAI,CAAC,CAAC,CAAC,CACtB,KAAC,MAAM,IAAC,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,GAAG,CACzC,CAAC,CAAC,CAAC,CACA,KAAC,MAAM,IAAC,KAAK,EAAC,gBAAgB,EAAC,IAAI,EAAC,aAAa,GAAG,CACvD,GACO,CACf,CAAC;IACN,CAAC;IACD,QAAQ,EAAE,EAAE;IACZ,QAAQ,EAAE;QACN,OAAO,EAAE,EAAE,IAAI,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE;KACjD;CACJ,CAAC"}

package/dist/components/BannerAlert/BannerAlert.d.ts

@@ -46,17 +46,19 @@ export type BannerAlertProps = {
  * @example
  *     import { BannerAlert } from '@bspk/ui/BannerAlert';
  *
- *     <BannerAlert
- *         elevated={true}
- *         variant="success"
- *         header="Success"
- *         body="Your request was processed successfully."
- *         onClose={() => sendSnackbar('Alert closed')}
- *         callToAction={{
- *             label: 'Click me',
- *             onClick: () => action('Call to action clicked!'),
- *         }}
- *     />;
+ *     <div style={{ width: '100%', padding: '0 20px' }}>
+ *         <BannerAlert
+ *             elevated={true}
+ *             variant="success"
+ *             header="Success"
+ *             body="Your request was processed successfully."
+ *             onClose={() => sendSnackbar('Alert closed')}
+ *             callToAction={{
+ *                 label: 'Click me',
+ *                 onClick: () => action('Call to action clicked!'),
+ *             }}
+ *         />
+ *     </div>;
  *
  * @exampleDescription This example shows how to use the BannerAlert component with an error variant, a header, and a body message.
  *
@@ -64,7 +66,7 @@ export type BannerAlertProps = {
  *
  *
  * @name BannerAlert
- * @phase UXReview
+ * @phase Stable
  */
 export declare function BannerAlert({ variant, onClose, header, callToAction, body, elevated, }: ElementProps<BannerAlertProps, 'div'>): import("react/jsx-runtime").JSX.Element;
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/BannerAlert/BannerAlert.js

@@ -13,17 +13,19 @@ import { Button } from '../Button';
  * @example
  *     import { BannerAlert } from '@bspk/ui/BannerAlert';
  *
- *     <BannerAlert
- *         elevated={true}
- *         variant="success"
- *         header="Success"
- *         body="Your request was processed successfully."
- *         onClose={() => sendSnackbar('Alert closed')}
- *         callToAction={{
- *             label: 'Click me',
- *             onClick: () => action('Call to action clicked!'),
- *         }}
- *     />;
+ *     <div style={{ width: '100%', padding: '0 20px' }}>
+ *         <BannerAlert
+ *             elevated={true}
+ *             variant="success"
+ *             header="Success"
+ *             body="Your request was processed successfully."
+ *             onClose={() => sendSnackbar('Alert closed')}
+ *             callToAction={{
+ *                 label: 'Click me',
+ *                 onClick: () => action('Call to action clicked!'),
+ *             }}
+ *         />
+ *     </div>;
  *
  * @exampleDescription This example shows how to use the BannerAlert component with an error variant, a header, and a body message.
  *
@@ -31,7 +33,7 @@ import { Button } from '../Button';
  *
  *
  * @name BannerAlert
- * @phase UXReview
+ * @phase Stable
  */
 export function BannerAlert({ variant = 'informational', onClose, header, callToAction, body, elevated = false, }) {
     return (_jsxs("div", { "data-bspk": "banner-alert", "data-elevated": elevated || undefined, "data-variant": variant, role: "alert", children: [_jsxs("div", { "data-icon-bar": true, children: [variant === 'error' && _jsx(SvgErrorFill, {}), variant === 'informational' && _jsx(SvgInfoFill, {}), variant === 'success' && _jsx(SvgCheckCircleFill, {}), variant === 'warning' && _jsx(SvgWarningFill, {})] }), _jsxs("div", { "data-content": true, children: [(header || onClose) && (_jsxs("header", { children: [_jsx("span", { children: header }), typeof onClose === 'function' && (_jsx(Button, { icon: _jsx(SvgClose, {}), iconOnly: true, label: "Close", onClick: onClose, size: "small", variant: "tertiary" }))] })), _jsxs("div", { "data-body": true, children: [_jsx("span", { children: body }), callToAction?.label && callToAction?.onClick && (_jsx(Button, { label: callToAction.label, onClick: callToAction.onClick, size: "small", variant: "tertiary" }))] })] })] }));

package/dist/components/BannerAlert/BannerAlert.js.map

@@ -1 +1 @@
-{"version":3,"file":"BannerAlert.js","sourceRoot":"","sources":["../../../src/components/BannerAlert/BannerAlert.tsx"],"names":[],"mappings":";AAAA,OAAO,qBAAqB,CAAC;AAC7B,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AA2C7C;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,UAAU,WAAW,CAAC,EACxB,OAAO,GAAG,eAAe,EACzB,OAAO,EACP,MAAM,EACN,YAAY,EACZ,IAAI,EACJ,QAAQ,GAAG,KAAK,GACoB;IACpC,OAAO,CACH,4BAAe,cAAc,mBAAgB,QAAQ,IAAI,SAAS,kBAAgB,OAAO,EAAE,IAAI,EAAC,OAAO,aACnG,iDACK,OAAO,KAAK,OAAO,IAAI,KAAC,YAAY,KAAG,EACvC,OAAO,KAAK,eAAe,IAAI,KAAC,WAAW,KAAG,EAC9C,OAAO,KAAK,SAAS,IAAI,KAAC,kBAAkB,KAAG,EAC/C,OAAO,KAAK,SAAS,IAAI,KAAC,cAAc,KAAG,IAC1C,EACN,gDACK,CAAC,MAAM,IAAI,OAAO,CAAC,IAAI,CACpB,6BACI,yBAAO,MAAM,GAAQ,EACpB,OAAO,OAAO,KAAK,UAAU,IAAI,CAC9B,KAAC,MAAM,IACH,IAAI,EAAE,KAAC,QAAQ,KAAG,EAClB,QAAQ,QACR,KAAK,EAAC,OAAO,EACb,OAAO,EAAE,OAAO,EAChB,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,UAAU,GACpB,CACL,IACI,CACZ,EACD,6CACI,yBAAO,IAAI,GAAQ,EAClB,YAAY,EAAE,KAAK,IAAI,YAAY,EAAE,OAAO,IAAI,CAC7C,KAAC,MAAM,IACH,KAAK,EAAE,YAAY,CAAC,KAAK,EACzB,OAAO,EAAE,YAAY,CAAC,OAAO,EAC7B,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,UAAU,GACpB,CACL,IACC,IACJ,IACJ,CACT,CAAC;AACN,CAAC"}
+{"version":3,"file":"BannerAlert.js","sourceRoot":"","sources":["../../../src/components/BannerAlert/BannerAlert.tsx"],"names":[],"mappings":";AAAA,OAAO,qBAAqB,CAAC;AAC7B,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AA2C7C;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,MAAM,UAAU,WAAW,CAAC,EACxB,OAAO,GAAG,eAAe,EACzB,OAAO,EACP,MAAM,EACN,YAAY,EACZ,IAAI,EACJ,QAAQ,GAAG,KAAK,GACoB;IACpC,OAAO,CACH,4BAAe,cAAc,mBAAgB,QAAQ,IAAI,SAAS,kBAAgB,OAAO,EAAE,IAAI,EAAC,OAAO,aACnG,iDACK,OAAO,KAAK,OAAO,IAAI,KAAC,YAAY,KAAG,EACvC,OAAO,KAAK,eAAe,IAAI,KAAC,WAAW,KAAG,EAC9C,OAAO,KAAK,SAAS,IAAI,KAAC,kBAAkB,KAAG,EAC/C,OAAO,KAAK,SAAS,IAAI,KAAC,cAAc,KAAG,IAC1C,EACN,gDACK,CAAC,MAAM,IAAI,OAAO,CAAC,IAAI,CACpB,6BACI,yBAAO,MAAM,GAAQ,EACpB,OAAO,OAAO,KAAK,UAAU,IAAI,CAC9B,KAAC,MAAM,IACH,IAAI,EAAE,KAAC,QAAQ,KAAG,EAClB,QAAQ,QACR,KAAK,EAAC,OAAO,EACb,OAAO,EAAE,OAAO,EAChB,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,UAAU,GACpB,CACL,IACI,CACZ,EACD,6CACI,yBAAO,IAAI,GAAQ,EAClB,YAAY,EAAE,KAAK,IAAI,YAAY,EAAE,OAAO,IAAI,CAC7C,KAAC,MAAM,IACH,KAAK,EAAE,YAAY,CAAC,KAAK,EACzB,OAAO,EAAE,YAAY,CAAC,OAAO,EAC7B,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,UAAU,GACpB,CACL,IACC,IACJ,IACJ,CACT,CAAC;AACN,CAAC"}

package/dist/components/BannerAlert/BannerAlertExample.js

@@ -1,6 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 export const BannerAlertExample = ({ action }) => ({
-    containerStyle: { width: '100%' },
     render: ({ props, variant, Component }) => {
         let nextHeader = props.header || 'This is a banner alert';
         if (variant && variant.name === 'variant') {

package/dist/components/BannerAlert/BannerAlertExample.js.map

@@ -1 +1 @@
-{"version":3,"file":"BannerAlertExample.js","sourceRoot":"","sources":["../../../src/components/BannerAlert/BannerAlertExample.tsx"],"names":[],"mappings":";AAGA,MAAM,CAAC,MAAM,kBAAkB,GAAyC,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC;IACrF,cAAc,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE;IACjC,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,EAAE;QACtC,IAAI,UAAU,GAAG,KAAK,CAAC,MAAM,IAAI,wBAAwB,CAAC;QAC1D,IAAI,OAAO,IAAI,OAAO,CAAC,IAAI,KAAK,SAAS,EAAE,CAAC;YACxC,IAAI,OAAO,CAAC,KAAK,KAAK,eAAe;gBAAE,UAAU,GAAG,8BAA8B,CAAC;YACnF,IAAI,OAAO,CAAC,KAAK,KAAK,SAAS;gBAAE,UAAU,GAAG,wBAAwB,CAAC;YACvE,IAAI,OAAO,CAAC,KAAK,KAAK,SAAS;gBAAE,UAAU,GAAG,wBAAwB,CAAC;YACvE,IAAI,OAAO,CAAC,KAAK,KAAK,OAAO;gBAAE,UAAU,GAAG,sBAAsB,CAAC;QACvE,CAAC;QACD,OAAO,KAAC,SAAS,OAAK,KAAK,EAAE,MAAM,EAAE,UAAU,GAAI,CAAC;IACxD,CAAC;IACD,OAAO,EAAE;QACL;YACI,KAAK,EAAE,mBAAmB;YAC1B,SAAS,EAAE;gBACP,MAAM,EAAE,0BAA0B;gBAClC,IAAI,EAAE,wBAAwB;gBAC9B,YAAY,EAAE;oBACV,KAAK,EAAE,UAAU;oBACjB,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,yBAAyB,CAAC;iBACnD;aACJ;SACJ;QACD;YACI,KAAK,EAAE,iBAAiB;YACxB,SAAS,EAAE;gBACP,MAAM,EAAE,wBAAwB;gBAChC,IAAI,EAAE,sBAAsB;gBAC5B,OAAO,EAAE,SAAS;aACrB;SACJ;KACJ;CACJ,CAAC,CAAC"}
+{"version":3,"file":"BannerAlertExample.js","sourceRoot":"","sources":["../../../src/components/BannerAlert/BannerAlertExample.tsx"],"names":[],"mappings":";AAGA,MAAM,CAAC,MAAM,kBAAkB,GAAyC,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC;IACrF,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,EAAE;QACtC,IAAI,UAAU,GAAG,KAAK,CAAC,MAAM,IAAI,wBAAwB,CAAC;QAC1D,IAAI,OAAO,IAAI,OAAO,CAAC,IAAI,KAAK,SAAS,EAAE,CAAC;YACxC,IAAI,OAAO,CAAC,KAAK,KAAK,eAAe;gBAAE,UAAU,GAAG,8BAA8B,CAAC;YACnF,IAAI,OAAO,CAAC,KAAK,KAAK,SAAS;gBAAE,UAAU,GAAG,wBAAwB,CAAC;YACvE,IAAI,OAAO,CAAC,KAAK,KAAK,SAAS;gBAAE,UAAU,GAAG,wBAAwB,CAAC;YACvE,IAAI,OAAO,CAAC,KAAK,KAAK,OAAO;gBAAE,UAAU,GAAG,sBAAsB,CAAC;QACvE,CAAC;QACD,OAAO,KAAC,SAAS,OAAK,KAAK,EAAE,MAAM,EAAE,UAAU,GAAI,CAAC;IACxD,CAAC;IACD,OAAO,EAAE;QACL;YACI,KAAK,EAAE,mBAAmB;YAC1B,SAAS,EAAE;gBACP,MAAM,EAAE,0BAA0B;gBAClC,IAAI,EAAE,wBAAwB;gBAC9B,YAAY,EAAE;oBACV,KAAK,EAAE,UAAU;oBACjB,OAAO,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,yBAAyB,CAAC;iBACnD;aACJ;SACJ;QACD;YACI,KAAK,EAAE,iBAAiB;YACxB,SAAS,EAAE;gBACP,MAAM,EAAE,wBAAwB;gBAChC,IAAI,EAAE,sBAAsB;gBAC5B,OAAO,EAAE,SAAS;aACrB;SACJ;KACJ;CACJ,CAAC,CAAC"}

package/dist/components/Breadcrumb/Breadcrumb.d.ts

@@ -33,26 +33,28 @@ export type BreadcrumbProps = CommonProps<'id'> & ScrollListItemsStyleProps & {
  * @example
  *     import { Breadcrumb } from '@bspk/ui/breadcrumb';
  *
- *     <Breadcrumb
- *         id="example-breadcrumb"
- *         scrollLimit={5}
- *         items={[
- *             { label: 'Brioche', href: '#brioche' },
- *             { label: 'Whole Wheat', href: '#whole-wheat' },
- *             { label: 'Sourdough', href: '#sourdough' },
- *             { label: 'Rye', href: '#rye' },
- *             { label: 'Multigrain', href: '#multigrain' },
- *             { label: 'Baguette', href: '#baguette' },
- *             { label: 'Focaccia', href: '#focaccia' },
- *             { label: 'Ciabatta', href: '#ciabatta' },
- *             { label: 'Pita', href: '#pita' },
- *             { label: 'Naan', href: '#naan' },
- *             { label: 'Flatbread', href: '#flatbread' },
- *         ]}
- *     />;
+ *     <div style={{ padding: '0px 20px', width: '100%' }}>
+ *         <Breadcrumb
+ *             id="example-breadcrumb"
+ *             scrollLimit={5}
+ *             items={[
+ *                 { label: 'Brioche', href: '#brioche' },
+ *                 { label: 'Whole Wheat', href: '#whole-wheat' },
+ *                 { label: 'Sourdough', href: '#sourdough' },
+ *                 { label: 'Rye', href: '#rye' },
+ *                 { label: 'Multigrain', href: '#multigrain' },
+ *                 { label: 'Baguette', href: '#baguette' },
+ *                 { label: 'Focaccia', href: '#focaccia' },
+ *                 { label: 'Ciabatta', href: '#ciabatta' },
+ *                 { label: 'Pita', href: '#pita' },
+ *                 { label: 'Naan', href: '#naan' },
+ *                 { label: 'Flatbread', href: '#flatbread' },
+ *             ]}
+ *         />
+ *     </div>;
  *
  * @name Breadcrumb
- * @phase UXReview
+ * @phase Stable
  */
 export declare function Breadcrumb({ id: propId, items, scrollLimit }: BreadcrumbProps): import("react/jsx-runtime").JSX.Element | null;
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/Breadcrumb/Breadcrumb.js

@@ -11,26 +11,28 @@ import { useId } from '../../hooks/useId';
  * @example
  *     import { Breadcrumb } from '@bspk/ui/breadcrumb';
  *
- *     <Breadcrumb
- *         id="example-breadcrumb"
- *         scrollLimit={5}
- *         items={[
- *             { label: 'Brioche', href: '#brioche' },
- *             { label: 'Whole Wheat', href: '#whole-wheat' },
- *             { label: 'Sourdough', href: '#sourdough' },
- *             { label: 'Rye', href: '#rye' },
- *             { label: 'Multigrain', href: '#multigrain' },
- *             { label: 'Baguette', href: '#baguette' },
- *             { label: 'Focaccia', href: '#focaccia' },
- *             { label: 'Ciabatta', href: '#ciabatta' },
- *             { label: 'Pita', href: '#pita' },
- *             { label: 'Naan', href: '#naan' },
- *             { label: 'Flatbread', href: '#flatbread' },
- *         ]}
- *     />;
+ *     <div style={{ padding: '0px 20px', width: '100%' }}>
+ *         <Breadcrumb
+ *             id="example-breadcrumb"
+ *             scrollLimit={5}
+ *             items={[
+ *                 { label: 'Brioche', href: '#brioche' },
+ *                 { label: 'Whole Wheat', href: '#whole-wheat' },
+ *                 { label: 'Sourdough', href: '#sourdough' },
+ *                 { label: 'Rye', href: '#rye' },
+ *                 { label: 'Multigrain', href: '#multigrain' },
+ *                 { label: 'Baguette', href: '#baguette' },
+ *                 { label: 'Focaccia', href: '#focaccia' },
+ *                 { label: 'Ciabatta', href: '#ciabatta' },
+ *                 { label: 'Pita', href: '#pita' },
+ *                 { label: 'Naan', href: '#naan' },
+ *                 { label: 'Flatbread', href: '#flatbread' },
+ *             ]}
+ *         />
+ *     </div>;
  *
  * @name Breadcrumb
- * @phase UXReview
+ * @phase Stable
  */
 export function Breadcrumb({ id: propId, items = [], scrollLimit }) {
     const id = useId(propId);