@bspk/ui 1.1.34 → 1.3.0

package/dist/components/ToggleOption/ToggleOption.d.ts

@@ -1,8 +1,12 @@
-import { ReactElement } from 'react';
 import './toggle-option.scss';
-export type ToggleOptionProps = {
+import { ReactElement } from 'react';
+import { CommonProps } from '-/types/common';
+export type ToggleOptionControlProps<T extends {
+    'aria-label'?: string;
+}> = Omit<T, 'aria-label'> & Pick<ToggleOptionProps, 'description' | 'label'>;
+export type ToggleOptionProps = CommonProps<'disabled'> & {
     /**
-     * The label of the option. Also used as the aria-label of the checkbox.
+     * The label of the option. Also used as the aria-label of the control.
      *
      * @required
      */
@@ -23,9 +27,5 @@ export type ToggleOptionProps = {
  * @name ToggleOption
  * @phase Utility
  */
-declare function ToggleOption({ label, description, children }: ToggleOptionProps): import("react/jsx-runtime").JSX.Element;
-declare namespace ToggleOption {
-    var bspkName: string;
-}
-export { ToggleOption };
+export declare function ToggleOption({ label, description, children, disabled }: ToggleOptionProps): import("react/jsx-runtime").JSX.Element;
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/ToggleOption/ToggleOption.js

@@ -6,9 +6,7 @@ import './toggle-option.css.js';
  * @name ToggleOption
  * @phase Utility
  */
-function ToggleOption({ label, description, children }) {
-    return (_jsxs("label", { "data-bspk": "toggle-option", children: [_jsx("span", { "data-control": true, children: children }), _jsxs("span", { "data-content": true, children: [_jsx("span", { "data-label": true, children: label }), description && _jsx("span", { "data-description": true, children: description })] })] }));
+export function ToggleOption({ label, description, children, disabled }) {
+    return (_jsxs("label", { "aria-disabled": !!disabled || undefined, "data-bspk": "toggle-option", children: [_jsx("span", { "data-control": true, children: children }), _jsx("span", { "data-label": true, children: label }), description && _jsx("span", { "data-description": true, children: description })] }));
 }
-ToggleOption.bspkName = 'ToggleOption';
-export { ToggleOption };
 //# sourceMappingURL=ToggleOption.js.map

package/dist/components/ToggleOption/ToggleOption.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleOption.js","sourceRoot":"","sources":["../../../src/components/ToggleOption/ToggleOption.tsx"],"names":[],"mappings":";AACA,OAAO,sBAAsB,CAAC;AAoB9B;;;;;GAKG;AACH,SAAS,YAAY,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAqB;IACrE,OAAO,CACH,8BAAiB,eAAe,aAC5B,+CAAoB,QAAQ,GAAQ,EACpC,iDACI,6CAAkB,KAAK,GAAQ,EAC9B,WAAW,IAAI,mDAAwB,WAAW,GAAQ,IACxD,IACH,CACX,CAAC;AACN,CAAC;AAED,YAAY,CAAC,QAAQ,GAAG,cAAc,CAAC;AAEvC,OAAO,EAAE,YAAY,EAAE,CAAC"}
+{"version":3,"file":"ToggleOption.js","sourceRoot":"","sources":["../../../src/components/ToggleOption/ToggleOption.tsx"],"names":[],"mappings":";AAAA,OAAO,sBAAsB,CAAC;AAyB9B;;;;;GAKG;AACH,MAAM,UAAU,YAAY,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAqB;IACtF,OAAO,CACH,kCAAsB,CAAC,CAAC,QAAQ,IAAI,SAAS,eAAY,eAAe,aACpE,+CAAoB,QAAQ,GAAQ,EACpC,6CAAkB,KAAK,GAAQ,EAC9B,WAAW,IAAI,mDAAwB,WAAW,GAAQ,IACvD,CACX,CAAC;AACN,CAAC"}

package/dist/components/ToggleOption/toggle-option.css

@@ -1,17 +1,15 @@
 [data-bspk=toggle-option] {
-  display: flex;
+  display: grid;
   width: 100%;
-  flex-direction: row;
-  padding: var(--spacing-sizing-03) var(--spacing-sizing-01) 0 0;
-  gap: var(--spacing-sizing-02);
+  grid-template-columns: auto 1fr;
+  grid-column-gap: var(--spacing-sizing-02);
   user-select: none;
   background: unset;
   border: unset;
   cursor: pointer;
   min-height: var(--spacing-sizing-08);
-  align-items: flex-start;
-  justify-content: flex-start;
   max-width: 100%;
+  padding: var(--spacing-sizing-01);
 }
 [data-bspk=toggle-option]:has([data-description]) {
   align-items: unset;
@@ -21,26 +19,33 @@
     min-height: var(--spacing-sizing-12);
   }
 }
-[data-bspk=toggle-option] [data-content] {
+[data-bspk=toggle-option] [data-control],
+[data-bspk=toggle-option] [data-label],
+[data-bspk=toggle-option] [data-description] {
   display: flex;
-  flex-direction: column;
-  padding: 2px 0;
+  flex-direction: row;
+  align-items: center;
+  justify-content: start;
 }
 [data-bspk=toggle-option] [data-label] {
   color: var(--foreground-neutral-on-surface);
   font: var(--labels-base);
 }
 [data-bspk=toggle-option] [data-description] {
+  grid-column-start: 2;
   font: var(--body-small);
   color: var(--foreground-neutral-on-surface-variant-01);
 }
-[data-pseudo=focus] [data-bspk=toggle-option]:not(:has(:disabled)), [data-bspk=toggle-option]:not(:has(:disabled)):focus-visible, [data-bspk=toggle-option]:not(:has(:disabled)):has(*:focus-visible) {
+[data-pseudo=focus] [data-bspk=toggle-option]:not([aria-disabled]), [data-bspk=toggle-option]:not([aria-disabled]):focus-visible, [data-bspk=toggle-option]:not([aria-disabled]):has(*:focus-visible) {
   outline: var(--stroke-neutral-focus) 2px solid;
 }
-[data-bspk=toggle-option]:has(:disabled) [data-label] {
+[data-bspk=toggle-option][aria-disabled] {
+  cursor: not-allowed;
+}
+[data-bspk=toggle-option][aria-disabled] [data-label] {
   color: var(--foreground-neutral-disabled-on-surface);
 }
-[data-bspk=toggle-option]:has(:disabled) [data-description] {
+[data-bspk=toggle-option][aria-disabled] [data-description] {
   color: var(--foreground-neutral-disabled-on-surface);
 }
 

package/dist/components/ToggleOption/toggle-option.css.js

@@ -2,19 +2,17 @@
 * Do not edit this file directly. */
 const style = document.createElement('style');
 style.appendChild(document.createTextNode(`[data-bspk=toggle-option] {
-  display: flex;
+  display: grid;
   width: 100%;
-  flex-direction: row;
-  padding: var(--spacing-sizing-03) var(--spacing-sizing-01) 0 0;
-  gap: var(--spacing-sizing-02);
+  grid-template-columns: auto 1fr;
+  grid-column-gap: var(--spacing-sizing-02);
   user-select: none;
   background: unset;
   border: unset;
   cursor: pointer;
   min-height: var(--spacing-sizing-08);
-  align-items: flex-start;
-  justify-content: flex-start;
   max-width: 100%;
+  padding: var(--spacing-sizing-01);
 }
 [data-bspk=toggle-option]:has([data-description]) {
   align-items: unset;
@@ -24,30 +22,36 @@ style.appendChild(document.createTextNode(`[data-bspk=toggle-option] {
     min-height: var(--spacing-sizing-12);
   }
 }
-[data-bspk=toggle-option] [data-content] {
+[data-bspk=toggle-option] [data-control],
+[data-bspk=toggle-option] [data-label],
+[data-bspk=toggle-option] [data-description] {
   display: flex;
-  flex-direction: column;
-  padding: 2px 0;
+  flex-direction: row;
+  align-items: center;
+  justify-content: start;
 }
 [data-bspk=toggle-option] [data-label] {
   color: var(--foreground-neutral-on-surface);
   font: var(--labels-base);
 }
 [data-bspk=toggle-option] [data-description] {
+  grid-column-start: 2;
   font: var(--body-small);
   color: var(--foreground-neutral-on-surface-variant-01);
 }
-[data-pseudo=focus] [data-bspk=toggle-option]:not(:has(:disabled)), [data-bspk=toggle-option]:not(:has(:disabled)):focus-visible, [data-bspk=toggle-option]:not(:has(:disabled)):has(*:focus-visible) {
+[data-pseudo=focus] [data-bspk=toggle-option]:not([aria-disabled]), [data-bspk=toggle-option]:not([aria-disabled]):focus-visible, [data-bspk=toggle-option]:not([aria-disabled]):has(*:focus-visible) {
   outline: var(--stroke-neutral-focus) 2px solid;
 }
-[data-bspk=toggle-option]:has(:disabled) [data-label] {
+[data-bspk=toggle-option][aria-disabled] {
+  cursor: not-allowed;
+}
+[data-bspk=toggle-option][aria-disabled] [data-label] {
   color: var(--foreground-neutral-disabled-on-surface);
 }
-[data-bspk=toggle-option]:has(:disabled) [data-description] {
+[data-bspk=toggle-option][aria-disabled] [data-description] {
   color: var(--foreground-neutral-disabled-on-surface);
 }
 
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
 `));
 document.head.appendChild(style);
-

package/dist/components/Tooltip/Tooltip.d.ts

@@ -1,6 +1,13 @@
-import { ReactElement } from 'react';
-import { Placement } from '../../hooks/useFloating';
 import './tooltip.scss';
+import { ReactElement } from 'react';
+import { Placement } from '-/hooks/useFloating';
+export type TooltipTriggerProps = {
+    onMouseOver?: () => void;
+    onMouseLeave?: () => void;
+    onFocus?: () => void;
+    onBlur?: () => void;
+    'aria-labelledby'?: string;
+};
 export type TooltipProps = {
     /**
      * The placement of the tooltip.
@@ -11,12 +18,11 @@ export type TooltipProps = {
     /** The tooltip content. */
     label: string;
     /**
-     * A single element that will trigger the tooltip when hovered over.
+     * A callback to render the trigger element.
      *
-     * @type ReactElement
      * @required
      */
-    children: ReactElement;
+    children: (triggerProps: TooltipTriggerProps) => ReactElement;
     /** Determines if the tooltip is disabled. */
     disabled?: boolean;
     /**
@@ -36,17 +42,13 @@ export type TooltipProps = {
  *     export function Example() {
  *         return (
  *             <Tooltip label="I explain what this button does" placement="top">
- *                 <Button>Click me</Button>
+ *                 {(triggerProps) => <Button {...triggerProps}>Click me</Button>}
  *             </Tooltip>
  *         );
  *     }
  *
  * @name Tooltip
- * @phase DesignReview
+ * @phase UXReview
  */
-declare function Tooltip({ placement, label, children, disabled, showTail, }: TooltipProps): import("react/jsx-runtime").JSX.Element;
-declare namespace Tooltip {
-    var bspkName: string;
-}
-export { Tooltip };
+export declare function Tooltip({ placement, label, children, disabled, showTail }: TooltipProps): import("react/jsx-runtime").JSX.Element;
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/Tooltip/Tooltip.js

@@ -1,13 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { cloneElement, useId, useMemo, useRef, useState } from 'react';
+import './tooltip.css.js';
+import { useRef, useState } from 'react';
 import { Portal } from '../Portal';
 import { useFloating } from '../../hooks/useFloating';
-import './tooltip.css.js';
-const DEFAULT = {
-    placement: 'top',
-    showTail: true,
-    disabled: false,
-};
+import { useId } from '../../hooks/useId';
 /**
  * Brief message that provide additional guidance and helps users perform an action if needed.
  *
@@ -18,24 +14,17 @@ const DEFAULT = {
  *     export function Example() {
  *         return (
  *             <Tooltip label="I explain what this button does" placement="top">
- *                 <Button>Click me</Button>
+ *                 {(triggerProps) => <Button {...triggerProps}>Click me</Button>}
  *             </Tooltip>
  *         );
  *     }
  *
  * @name Tooltip
- * @phase DesignReview
+ * @phase UXReview
  */
-function Tooltip({ placement = DEFAULT.placement, label, children, disabled = DEFAULT.disabled, showTail = DEFAULT.showTail, }) {
+export function Tooltip({ placement = 'top', label, children, disabled = false, showTail = true }) {
     const id = useId();
     const [show, setShow] = useState(false);
-    const child = useMemo(() => !disabled &&
-        children &&
-        cloneElement(children, {
-            onMouseOver: () => setShow(true),
-            onMouseLeave: () => setShow(false),
-            'aria-describedby': id,
-        }), [children, disabled, id]);
     const arrowRef = useRef(null);
     const { floatingStyles, middlewareData, elements } = useFloating({
         placement,
@@ -43,19 +32,26 @@ function Tooltip({ placement = DEFAULT.placement, label, children, disabled = DE
         offsetOptions: showTail ? 8 : 4,
         arrowRef,
         hide: !show,
+        refWidth: false,
     });
-    return disabled ? (children) : (_jsxs(_Fragment, { children: [child, label && (_jsx(Portal, { children: _jsxs("div", { "data-bspk": "tooltip", "data-placement": middlewareData?.offset?.placement, id: id, ref: (node) => {
+    if (disabled)
+        return children({});
+    return (_jsxs(_Fragment, { children: [children({
+                onMouseOver: () => setShow(true),
+                onMouseLeave: () => setShow(false),
+                onFocus: () => setShow(true),
+                onBlur: () => setShow(false),
+                'aria-labelledby': id,
+            }), label && (_jsx(Portal, { children: _jsxs("div", { "data-bspk": "tooltip", "data-placement": middlewareData?.offset?.placement, id: id, ref: (node) => {
                         elements.setFloating(node);
-                        elements.setReference(document.querySelector(`[aria-describedby="${id}"]`));
+                        elements.setReference(document.querySelector(`[aria-labelledby="${id}"]`));
                     }, role: "tooltip", style: floatingStyles, children: [_jsx("span", { "data-text": true, children: label }), _jsx("span", { "aria-hidden": true, "data-arrow": true, ref: (node) => {
                                 arrowRef.current = node;
                             }, style: {
-                                zIndex: 1000,
+                                zIndex: 'var(--z-index-tooltip-popover)',
                                 opacity: showTail ? 1 : 0,
                                 left: middlewareData.arrow?.x != null ? `${middlewareData.arrow?.x}px` : '',
                                 top: middlewareData.arrow?.y != null ? `${middlewareData.arrow?.y}px` : '',
                             } })] }) }))] }));
 }
-Tooltip.bspkName = 'Tooltip';
-export { Tooltip };
 //# sourceMappingURL=Tooltip.js.map

package/dist/components/Tooltip/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAgB,YAAY,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAErF,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAa,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAC7D,OAAO,gBAAgB,CAAC;AAExB,MAAM,OAAO,GAAG;IACZ,SAAS,EAAE,KAAK;IAChB,QAAQ,EAAE,IAAI;IACd,QAAQ,EAAE,KAAK;CACT,CAAC;AA4BX;;;;;;;;;;;;;;;;;GAiBG;AACH,SAAS,OAAO,CAAC,EACb,SAAS,GAAG,OAAO,CAAC,SAAS,EAC7B,KAAK,EACL,QAAQ,EACR,QAAQ,GAAG,OAAO,CAAC,QAAQ,EAC3B,QAAQ,GAAG,OAAO,CAAC,QAAQ,GAChB;IACX,MAAM,EAAE,GAAG,KAAK,EAAE,CAAC;IACnB,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAExC,MAAM,KAAK,GAAG,OAAO,CACjB,GAAG,EAAE,CACD,CAAC,QAAQ;QACT,QAAQ;QACR,YAAY,CAAC,QAAQ,EAAE;YACnB,WAAW,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC;YAChC,YAAY,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC;YAClC,kBAAkB,EAAE,EAAE;SACzB,CAAC,EACN,CAAC,QAAQ,EAAE,QAAQ,EAAE,EAAE,CAAC,CAC3B,CAAC;IAEF,MAAM,QAAQ,GAAG,MAAM,CAAqB,IAAI,CAAC,CAAC;IAElD,MAAM,EAAE,cAAc,EAAE,cAAc,EAAE,QAAQ,EAAE,GAAG,WAAW,CAAC;QAC7D,SAAS;QACT,QAAQ,EAAE,OAAO;QACjB,aAAa,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC/B,QAAQ;QACR,IAAI,EAAE,CAAC,IAAI;KACd,CAAC,CAAC;IAEH,OAAO,QAAQ,CAAC,CAAC,CAAC,CACd,QAAQ,CACX,CAAC,CAAC,CAAC,CACA,8BACK,KAAK,EACL,KAAK,IAAI,CACN,KAAC,MAAM,cACH,4BACc,SAAS,oBACH,cAAc,EAAE,MAAM,EAAE,SAAS,EACjD,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,CAAC,IAAI,EAAE,EAAE;wBACV,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;wBAC3B,QAAQ,CAAC,YAAY,CAAC,QAAQ,CAAC,aAAa,CAAc,sBAAsB,EAAE,IAAI,CAAC,CAAC,CAAC;oBAC7F,CAAC,EACD,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,cAAc,aAErB,4CAAiB,KAAK,GAAQ,EAC9B,wDAGI,GAAG,EAAE,CAAC,IAAI,EAAE,EAAE;gCACV,QAAQ,CAAC,OAAO,GAAG,IAAI,CAAC;4BAC5B,CAAC,EACD,KAAK,EAAE;gCACH,MAAM,EAAE,IAAI;gCACZ,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;gCACzB,IAAI,EAAE,cAAc,CAAC,KAAK,EAAE,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,GAAG,cAAc,CAAC,KAAK,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE;gCAC3E,GAAG,EAAE,cAAc,CAAC,KAAK,EAAE,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,GAAG,cAAc,CAAC,KAAK,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE;6BAC7E,GACH,IACA,GACD,CACZ,IACF,CACN,CAAC;AACN,CAAC;AAED,OAAO,CAAC,QAAQ,GAAG,SAAS,CAAC;AAE7B,OAAO,EAAE,OAAO,EAAE,CAAC"}
+{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"names":[],"mappings":";AAAA,OAAO,gBAAgB,CAAC;AACxB,OAAO,EAAgB,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAC7C,OAAO,EAAa,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAC7D,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAmCtC;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,UAAU,OAAO,CAAC,EAAE,SAAS,GAAG,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,GAAG,KAAK,EAAE,QAAQ,GAAG,IAAI,EAAgB;IAC3G,MAAM,EAAE,GAAG,KAAK,EAAE,CAAC;IACnB,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAExC,MAAM,QAAQ,GAAG,MAAM,CAAqB,IAAI,CAAC,CAAC;IAElD,MAAM,EAAE,cAAc,EAAE,cAAc,EAAE,QAAQ,EAAE,GAAG,WAAW,CAAC;QAC7D,SAAS;QACT,QAAQ,EAAE,OAAO;QACjB,aAAa,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAC/B,QAAQ;QACR,IAAI,EAAE,CAAC,IAAI;QACX,QAAQ,EAAE,KAAK;KAClB,CAAC,CAAC;IAEH,IAAI,QAAQ;QAAE,OAAO,QAAQ,CAAC,EAAE,CAAC,CAAC;IAElC,OAAO,CACH,8BACK,QAAQ,CAAC;gBACN,WAAW,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC;gBAChC,YAAY,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC;gBAClC,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC;gBAC5B,MAAM,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC;gBAC5B,iBAAiB,EAAE,EAAE;aACxB,CAAC,EACD,KAAK,IAAI,CACN,KAAC,MAAM,cACH,4BACc,SAAS,oBACH,cAAc,EAAE,MAAM,EAAE,SAAS,EACjD,EAAE,EAAE,EAAE,EACN,GAAG,EAAE,CAAC,IAAI,EAAE,EAAE;wBACV,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;wBAC3B,QAAQ,CAAC,YAAY,CAAC,QAAQ,CAAC,aAAa,CAAc,qBAAqB,EAAE,IAAI,CAAC,CAAC,CAAC;oBAC5F,CAAC,EACD,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,cAAc,aAErB,4CAAiB,KAAK,GAAQ,EAC9B,wDAGI,GAAG,EAAE,CAAC,IAAI,EAAE,EAAE;gCACV,QAAQ,CAAC,OAAO,GAAG,IAAI,CAAC;4BAC5B,CAAC,EACD,KAAK,EAAE;gCACH,MAAM,EAAE,gCAAgC;gCACxC,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;gCACzB,IAAI,EAAE,cAAc,CAAC,KAAK,EAAE,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,GAAG,cAAc,CAAC,KAAK,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE;gCAC3E,GAAG,EAAE,cAAc,CAAC,KAAK,EAAE,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,GAAG,cAAc,CAAC,KAAK,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE;6BAC7E,GACH,IACA,GACD,CACZ,IACF,CACN,CAAC;AACN,CAAC"}

package/dist/components/Tooltip/TooltipExample.d.ts

@@ -1,2 +1,3 @@
-import { ComponentExample } from '../../utils/demo';
-export declare const TooltipExample: ComponentExample;
+import { TooltipProps } from './Tooltip';
+import { ComponentExample } from '-/utils/demo';
+export declare const TooltipExample: ComponentExample<TooltipProps>;

package/dist/components/Tooltip/TooltipExample.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import { Button } from '../Button';
 export const TooltipExample = {
     render: ({ props: state, Component }) => {
-        return (_jsx(_Fragment, { children: _jsx(Component, { label: "Tooltip text", ...state, placement: [state.placement].flat()[0] || 'top', children: _jsx(Button, { label: `Hover over me ${'data-variant-value' in state ? `(${state['data-variant-value']})` : ''}`, variant: "secondary" }) }) }));
+        return (_jsx(_Fragment, { children: _jsx(Component, { ...state, label: `Hover over me ${state.label || ''}`, placement: [state.placement].flat()[0] || 'top', children: (triggerProps) => _jsx(Button, { ...triggerProps, label: "Hover over me", variant: "secondary" }) }) }));
     },
 };
 //# sourceMappingURL=TooltipExample.js.map

package/dist/components/Tooltip/TooltipExample.js.map

@@ -1 +1 @@
-{"version":3,"file":"TooltipExample.js","sourceRoot":"","sources":["../../../src/components/Tooltip/TooltipExample.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAG7C,MAAM,CAAC,MAAM,cAAc,GAAqB;IAC5C,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;QACpC,OAAO,CACH,4BACI,KAAC,SAAS,IAAC,KAAK,EAAC,cAAc,KAAK,KAAK,EAAE,SAAS,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,YACtF,KAAC,MAAM,IACH,KAAK,EAAE,iBAAiB,oBAAoB,IAAI,KAAK,CAAC,CAAC,CAAC,IAAI,KAAK,CAAC,oBAAoB,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,EACjG,OAAO,EAAC,WAAW,GACrB,GACM,GACb,CACN,CAAC;IACN,CAAC;CACJ,CAAC"}
+{"version":3,"file":"TooltipExample.js","sourceRoot":"","sources":["../../../src/components/Tooltip/TooltipExample.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAG7C,MAAM,CAAC,MAAM,cAAc,GAAmC;IAC1D,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE;QACpC,OAAO,CACH,4BACI,KAAC,SAAS,OACF,KAAK,EACT,KAAK,EAAE,iBAAiB,KAAK,CAAC,KAAK,IAAI,EAAE,EAAE,EAC3C,SAAS,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,YAE9C,CAAC,YAAY,EAAE,EAAE,CAAC,KAAC,MAAM,OAAK,YAAY,EAAE,KAAK,EAAC,eAAe,EAAC,OAAO,EAAC,WAAW,GAAG,GACjF,GACb,CACN,CAAC;IACN,CAAC;CACJ,CAAC"}

package/dist/components/Tooltip/tooltip.css

@@ -2,7 +2,6 @@
   position: fixed;
   pointer-events: none;
   z-index: var(--z-index-tooltip-popover);
-  width: max-content !important;
   --arrow-size: var(--spacing-sizing-01);
   --arrow-offset: calc(var(--arrow-size) * -2);
   --arrow-color: var(--surface-neutral-inverse);
@@ -19,7 +18,6 @@
   padding: var(--spacing-sizing-01) var(--spacing-sizing-02);
   border: none;
   transition: opacity 0.2s ease-in-out;
-  width: max-content;
 }
 [data-bspk=tooltip] [data-arrow] {
   display: block;

package/dist/components/Tooltip/tooltip.css.js

@@ -5,7 +5,6 @@ style.appendChild(document.createTextNode(`[data-bspk=tooltip] {
   position: fixed;
   pointer-events: none;
   z-index: var(--z-index-tooltip-popover);
-  width: max-content !important;
   --arrow-size: var(--spacing-sizing-01);
   --arrow-offset: calc(var(--arrow-size) * -2);
   --arrow-color: var(--surface-neutral-inverse);
@@ -22,7 +21,6 @@ style.appendChild(document.createTextNode(`[data-bspk=tooltip] {
   padding: var(--spacing-sizing-01) var(--spacing-sizing-02);
   border: none;
   transition: opacity 0.2s ease-in-out;
-  width: max-content;
 }
 [data-bspk=tooltip] [data-arrow] {
   display: block;
@@ -53,4 +51,3 @@ style.appendChild(document.createTextNode(`[data-bspk=tooltip] {
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
 `));
 document.head.appendChild(style);
-

package/dist/components/TopNavigation/TopNavigation.d.ts

@@ -9,9 +9,5 @@ export type TopNavigationProps = {
  * @name TopNavigation
  * @phase Backlog
  */
-declare function TopNavigation({ children }: TopNavigationProps): import("react/jsx-runtime").JSX.Element;
-declare namespace TopNavigation {
-    var bspkName: string;
-}
-export { TopNavigation };
+export declare function TopNavigation({ children }: TopNavigationProps): import("react/jsx-runtime").JSX.Element;
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/TopNavigation/TopNavigation.js

@@ -6,9 +6,7 @@ import './top-navigation.css.js';
  * @name TopNavigation
  * @phase Backlog
  */
-function TopNavigation({ children }) {
+export function TopNavigation({ children }) {
     return _jsx("div", { "data-bspk": "top-navigation", children: children });
 }
-TopNavigation.bspkName = 'TopNavigation';
-export { TopNavigation };
 //# sourceMappingURL=TopNavigation.js.map

package/dist/components/TopNavigation/TopNavigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"TopNavigation.js","sourceRoot":"","sources":["../../../src/components/TopNavigation/TopNavigation.tsx"],"names":[],"mappings":";AAAA,OAAO,uBAAuB,CAAC;AAO/B;;;;;GAKG;AACH,SAAS,aAAa,CAAC,EAAE,QAAQ,EAAsB;IACnD,OAAO,2BAAe,gBAAgB,YAAE,QAAQ,GAAO,CAAC;AAC5D,CAAC;AAED,aAAa,CAAC,QAAQ,GAAG,eAAe,CAAC;AAEzC,OAAO,EAAE,aAAa,EAAE,CAAC"}
+{"version":3,"file":"TopNavigation.js","sourceRoot":"","sources":["../../../src/components/TopNavigation/TopNavigation.tsx"],"names":[],"mappings":";AAAA,OAAO,uBAAuB,CAAC;AAO/B;;;;;GAKG;AACH,MAAM,UAAU,aAAa,CAAC,EAAE,QAAQ,EAAsB;IAC1D,OAAO,2BAAe,gBAAgB,YAAE,QAAQ,GAAO,CAAC;AAC5D,CAAC"}

package/dist/components/TopNavigation/top-navigation.css.js

@@ -8,4 +8,3 @@ style.appendChild(document.createTextNode(`[data-bspk=top-navigation] {
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */
 `));
 document.head.appendChild(style);
-

package/dist/components/Truncated/Truncated.d.ts

@@ -1,6 +1,7 @@
+import './truncated.scss';
 import { ElementType } from 'react';
-import { ElementConstructorProps } from '../../index.js';
-export type TruncatedProps<As extends ElementType = 'span'> = ElementConstructorProps<'span', 'children'> & {
+import { ElementConstructorProps } from '-/types/common';
+export type TruncatedProps<As extends ElementType = 'span'> = {
     /**
      * The element type to render as.
      *
@@ -10,6 +11,9 @@ export type TruncatedProps<As extends ElementType = 'span'> = ElementConstructor
     /**
      * The content to render.
      *
+     * @example
+     *     Some really long text that might be truncated when displayed in a small container.
+     *
      * @type string
      * @required
      */
@@ -25,10 +29,6 @@ export type TruncatedProps<As extends ElementType = 'span'> = ElementConstructor
  * A utility component that displays a tooltip with the full text when hovered when text is truncated.
  *
  * @name Truncated
- * @phase WorkInProgress
+ * @phase Utility
  */
-declare function Truncated({ children, label, ...props }: TruncatedProps): import("react/jsx-runtime").JSX.Element;
-declare namespace Truncated {
-    var bspkName: string;
-}
-export { Truncated };
+export declare function Truncated<As extends ElementType = 'span'>({ children, label, ...props }: ElementConstructorProps<As, 'children'> & TruncatedProps<As>): import("react/jsx-runtime").JSX.Element;

package/dist/components/Truncated/Truncated.js

@@ -1,17 +1,16 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+import './truncated.css.js';
 import { Tooltip } from '../Tooltip';
 import { useTruncatedText } from '../../hooks/useTruncatedText';
 /**
  * A utility component that displays a tooltip with the full text when hovered when text is truncated.
  *
  * @name Truncated
- * @phase WorkInProgress
+ * @phase Utility
  */
-function Truncated({ children, label, ...props }) {
+export function Truncated({ children, label, ...props }) {
     const { setElement, isTruncated } = useTruncatedText();
-    const span = (_jsx("span", { ...props, "data-bspk": "truncated", ref: (node) => setElement(node), style: { overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }, children: children }));
-    return isTruncated ? _jsx(Tooltip, { label: label || children, children: span }) : span;
+    const span = (triggerProps) => (_jsx("span", { ...props, "data-bspk-utility": "truncated", ref: (node) => setElement(node), ...triggerProps, role: isTruncated ? 'note' : props.role, children: children }));
+    return isTruncated ? _jsx(Tooltip, { label: label || children, children: span }) : span({});
 }
-Truncated.bspkName = 'Truncated';
-export { Truncated };
 //# sourceMappingURL=Truncated.js.map

package/dist/components/Truncated/Truncated.js.map

@@ -1 +1 @@
-{"version":3,"file":"Truncated.js","sourceRoot":"","sources":["../../../src/components/Truncated/Truncated.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAwB5D;;;;;GAKG;AACH,SAAS,SAAS,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,EAAkB;IAC5D,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAEvD,MAAM,IAAI,GAAG,CACT,kBACQ,KAAK,eACC,WAAW,EACrB,GAAG,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,EAC/B,KAAK,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,YAAY,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,YAE5E,QAAQ,GACN,CACV,CAAC;IAEF,OAAO,WAAW,CAAC,CAAC,CAAC,KAAC,OAAO,IAAC,KAAK,EAAE,KAAK,IAAI,QAAQ,YAAG,IAAI,GAAW,CAAC,CAAC,CAAC,IAAI,CAAC;AACpF,CAAC;AAED,SAAS,CAAC,QAAQ,GAAG,WAAW,CAAC;AAEjC,OAAO,EAAE,SAAS,EAAE,CAAC"}
+{"version":3,"file":"Truncated.js","sourceRoot":"","sources":["../../../src/components/Truncated/Truncated.tsx"],"names":[],"mappings":";AAAA,OAAO,kBAAkB,CAAC;AAE1B,OAAO,EAAE,OAAO,EAAuB,MAAM,sBAAsB,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AA4B5D;;;;;GAKG;AACH,MAAM,UAAU,SAAS,CAAkC,EACvD,QAAQ,EACR,KAAK,EACL,GAAG,KAAK,EACmD;IAC3D,MAAM,EAAE,UAAU,EAAE,WAAW,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAEvD,MAAM,IAAI,GAAG,CAAC,YAAiC,EAAE,EAAE,CAAC,CAChD,kBACQ,KAAK,uBACS,WAAW,EAC7B,GAAG,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,KAC3B,YAAY,EAChB,IAAI,EAAE,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,YAEtC,QAAQ,GACN,CACV,CAAC;IAEF,OAAO,WAAW,CAAC,CAAC,CAAC,KAAC,OAAO,IAAC,KAAK,EAAE,KAAK,IAAI,QAAQ,YAAG,IAAI,GAAW,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACxF,CAAC"}

package/dist/components/Truncated/truncated.css

@@ -0,0 +1,8 @@
+[data-bspk-utility=truncated] {
+  max-width: 100%;
+  display: inline-block;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  background-color: transparent;
+}

package/dist/components/Truncated/truncated.css.js

@@ -0,0 +1,13 @@
+/** * This file is generated by the build script.
+* Do not edit this file directly. */
+const style = document.createElement('style');
+style.appendChild(document.createTextNode(`[data-bspk-utility=truncated] {
+  max-width: 100%;
+  display: inline-block;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  background-color: transparent;
+}
+`));
+document.head.appendChild(style);

package/dist/components/Txt/Txt.d.ts

@@ -1,6 +1,6 @@
 import { ElementType } from 'react';
-import { ElementProps } from '../../index.js';
-import { TxtVariant } from '../../utils/txtVariants';
+import { ElementProps } from '-/types/common';
+import { TxtVariant } from '-/utils/txtVariants';
 export type TxtProps<As extends ElementType = 'span'> = {
     /**
      * The element type to render as.
@@ -50,11 +50,7 @@ export type TxtProps<As extends ElementType = 'span'> = {
  *     }
  *
  * @name Txt
- * @phase DesignReview
+ * @phase UXReview
  */
-declare function Txt<As extends ElementType = 'span'>({ children, as, variant, style: styleProp, skeletonLines, inherit, ...containerProps }: ElementProps<TxtProps<As>, As>): import("react/jsx-runtime").JSX.Element | null;
-declare namespace Txt {
-    var bspkName: string;
-}
-export { Txt };
+export declare function Txt<As extends ElementType = 'span'>({ children, as, variant, style: styleProp, skeletonLines, inherit, ...containerProps }: ElementProps<TxtProps<As>, As>): import("react/jsx-runtime").JSX.Element | null;
 /** Copyright 2025 Anywhere Real Estate - CC BY 4.0 */

package/dist/components/Txt/Txt.js

@@ -11,9 +11,9 @@ import { SkeletonText } from '../SkeletonText';
  *     }
  *
  * @name Txt
- * @phase DesignReview
+ * @phase UXReview
  */
-function Txt({ children, as, variant = 'body-base', style: styleProp, skeletonLines = 0, inherit, ...containerProps }) {
+export function Txt({ children, as, variant = 'body-base', style: styleProp, skeletonLines = 0, inherit, ...containerProps }) {
     const content = children?.toString();
     if (!content)
         return skeletonLines ? _jsx(SkeletonText, { lines: skeletonLines, variant: variant }) : null;
@@ -23,6 +23,4 @@ function Txt({ children, as, variant = 'body-base', style: styleProp, skeletonLi
             font: inherit ? undefined : `var(--${variant})`,
         }, children: content }));
 }
-Txt.bspkName = 'Txt';
-export { Txt };
 //# sourceMappingURL=Txt.js.map

package/dist/components/Txt/Txt.js.map

@@ -1 +1 @@
-{"version":3,"file":"Txt.js","sourceRoot":"","sources":["../../../src/components/Txt/Txt.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AA0CzD;;;;;;;;;;;;GAYG;AACH,SAAS,GAAG,CAAkC,EAC1C,QAAQ,EACR,EAAE,EACF,OAAO,GAAG,WAAW,EACrB,KAAK,EAAE,SAAS,EAChB,aAAa,GAAG,CAAC,EACjB,OAAO,EACP,GAAG,cAAc,EACY;IAC7B,MAAM,OAAO,GAAG,QAAQ,EAAE,QAAQ,EAAE,CAAC;IAErC,IAAI,CAAC,OAAO;QAAE,OAAO,aAAa,CAAC,CAAC,CAAC,KAAC,YAAY,IAAC,KAAK,EAAE,aAAa,EAAE,OAAO,EAAE,OAAO,GAAI,CAAC,CAAC,CAAC,IAAI,CAAC;IAErG,MAAM,EAAE,GAAgB,EAAE,IAAI,MAAM,CAAC;IAErC,OAAO,CACH,KAAC,EAAE,OACK,cAAc,eACR,KAAK,EACf,KAAK,EAAE;YACH,GAAG,SAAS;YACZ,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,OAAO,GAAG;SAClD,YAEA,OAAO,GACP,CACR,CAAC;AACN,CAAC;AAED,GAAG,CAAC,QAAQ,GAAG,KAAK,CAAC;AAErB,OAAO,EAAE,GAAG,EAAE,CAAC"}
+{"version":3,"file":"Txt.js","sourceRoot":"","sources":["../../../src/components/Txt/Txt.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AA2CzD;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,GAAG,CAAkC,EACjD,QAAQ,EACR,EAAE,EACF,OAAO,GAAG,WAAW,EACrB,KAAK,EAAE,SAAS,EAChB,aAAa,GAAG,CAAC,EACjB,OAAO,EACP,GAAG,cAAc,EACY;IAC7B,MAAM,OAAO,GAAG,QAAQ,EAAE,QAAQ,EAAE,CAAC;IAErC,IAAI,CAAC,OAAO;QAAE,OAAO,aAAa,CAAC,CAAC,CAAC,KAAC,YAAY,IAAC,KAAK,EAAE,aAAa,EAAE,OAAO,EAAE,OAAO,GAAI,CAAC,CAAC,CAAC,IAAI,CAAC;IAErG,MAAM,EAAE,GAAgB,EAAE,IAAI,MAAM,CAAC;IAErC,OAAO,CACH,KAAC,EAAE,OACK,cAAc,eACR,KAAK,EACf,KAAK,EAAE;YACH,GAAG,SAAS;YACZ,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,OAAO,GAAG;SAClD,YAEA,OAAO,GACP,CACR,CAAC;AACN,CAAC"}

package/dist/components/UIProvider/AriaLiveMessageHandler.d.ts

@@ -0,0 +1,13 @@
+export declare function sendAriaLiveMessage(message: string, live?: 'assertive' | 'polite'): void;
+/**
+ * AriaLiveMessageHandler is a single use component that listens for aria-live messages and displays them to the user.
+ *
+ * We use a custom event to communicate between components and this handler.
+ *
+ * We don't store the message in context to avoid unnecessary re-renders of all components that consume the context. :)
+ *
+ * We queue messages to ensure that they are read by screen readers.
+ *
+ * After the message is read, we clear it after a short delay to allow for subsequent messages to be read.
+ */
+export declare function AriaLiveMessageHandler(): import("react/jsx-runtime").JSX.Element | undefined;

package/dist/components/UIProvider/AriaLiveMessageHandler.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState } from 'react';
+import { useEventListener } from '../../hooks/useAddEventListener';
+import { useTimeout } from '../../hooks/useTimeout';
+export function sendAriaLiveMessage(message, live = 'polite') {
+    document.dispatchEvent(new CustomEvent('aria-live', { detail: { message, live } }));
+}
+/**
+ * AriaLiveMessageHandler is a single use component that listens for aria-live messages and displays them to the user.
+ *
+ * We use a custom event to communicate between components and this handler.
+ *
+ * We don't store the message in context to avoid unnecessary re-renders of all components that consume the context. :)
+ *
+ * We queue messages to ensure that they are read by screen readers.
+ *
+ * After the message is read, we clear it after a short delay to allow for subsequent messages to be read.
+ */
+export function AriaLiveMessageHandler() {
+    const [ariaLiveMessage, setAriaLiveMessage] = useState(undefined);
+    const timeout = useTimeout();
+    useEventListener('aria-live', (event) => {
+        const { message, live } = event.detail;
+        // Clear any existing message to ensure that screen readers read the new message
+        setAriaLiveMessage(undefined);
+        timeout.set(() => setAriaLiveMessage({ message, live: live || 'polite' }), 10);
+    }, document);
+    return (ariaLiveMessage && (_jsx("div", { "aria-live": ariaLiveMessage?.live || 'polite', "data-sr-only": true, role: "alert", children: ariaLiveMessage?.message })));
+}
+//# sourceMappingURL=AriaLiveMessageHandler.js.map

package/dist/components/UIProvider/AriaLiveMessageHandler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AriaLiveMessageHandler.js","sourceRoot":"","sources":["../../../src/components/UIProvider/AriaLiveMessageHandler.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAGhD,MAAM,UAAU,mBAAmB,CAAC,OAAe,EAAE,OAA+B,QAAQ;IACxF,QAAQ,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,WAAW,EAAE,EAAE,MAAM,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC;AACxF,CAAC;AAED;;;;;;;;;;GAUG;AACH,MAAM,UAAU,sBAAsB;IAClC,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAA8B,SAAS,CAAC,CAAC;IAE/F,MAAM,OAAO,GAAG,UAAU,EAAE,CAAC;IAE7B,gBAAgB,CACZ,WAAW,EACX,CAAC,KAAkB,EAAE,EAAE;QACnB,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC,MAAM,CAAC;QACvC,gFAAgF;QAChF,kBAAkB,CAAC,SAAS,CAAC,CAAC;QAC9B,OAAO,CAAC,GAAG,CAAC,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,IAAI,QAAQ,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC;IACnF,CAAC,EACD,QAAQ,CACX,CAAC;IAEF,OAAO,CACH,eAAe,IAAI,CACf,2BAAgB,eAAe,EAAE,IAAI,IAAI,QAAQ,wBAAe,IAAI,EAAC,OAAO,YACvE,eAAe,EAAE,OAAO,GACvB,CACT,CACJ,CAAC;AACN,CAAC"}