se-design 1.0.90-dev.0 → 1.0.90

package/dist/index217.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index217.js","sources":["../src/utils/a11y/useFocusSentinel.ts"],"sourcesContent":["import { useRef, useEffect, useLayoutEffect } from 'react';\n\nimport { getFirstFocusableElement, getLastFocusableElement } from './focusableElements';\nimport { consumeLastInteractedElement, consumeFocusAnchor } from './useFocusTrap';\n\nconst SENTINEL_STYLE: React.CSSProperties = {\n  position: 'absolute',\n  opacity: 0,\n  pointerEvents: 'none',\n  width: 0,\n  height: 0,\n};\n\nexport interface UseFocusSentinelOptions {\n  /** Whether the panel is currently open. */\n  isOpen: boolean | undefined;\n  /**\n   * When true the hook is a no-op — dialog mode (focus trap) handles focus management instead.\n   */\n  isModal: boolean;\n  /** Ref to the panel container element. */\n  containerRef: React.RefObject<HTMLElement | null>;\n  /**\n   * Explicit element to restore focus to on close.\n   * Overrides the automatic trigger capture.\n   */\n  returnFocusRef?: React.RefObject<HTMLElement | null>;\n}\n\nexport interface SentinelProps {\n  ref: React.RefObject<HTMLDivElement | null>;\n  tabIndex: number;\n  style: React.CSSProperties;\n  'aria-hidden': true;\n  'data-focus-sentinel': 'start' | 'end';\n  onFocus: (e: React.FocusEvent) => void;\n}\n\nexport interface UseFocusSentinelReturn {\n  /** Spread onto an invisible div placed before the panel content. */\n  startSentinelProps: SentinelProps;\n  /** Spread onto an invisible div placed after the panel content. */\n  endSentinelProps: SentinelProps;\n}\n\n/**\n * Focus management for complementary (non-modal) side panels.\n *\n * Moves focus into the panel on open, restores it to the trigger on close,\n * and wraps Tab / Shift+Tab back to the trigger when focus reaches either end.\n *\n * Sentinel tabIndex values are mutated imperatively (no state) to avoid\n * re-renders. React does not touch a DOM attribute unless the JSX prop value\n * changes, so the initial tabIndex={-1} in the returned props is safe.\n */\nexport function useFocusSentinel({\n  isOpen,\n  isModal,\n  containerRef,\n  returnFocusRef,\n}: UseFocusSentinelOptions): UseFocusSentinelReturn {\n  const triggerRef = useRef<HTMLElement | null>(null);\n  const startSentinelRef = useRef<HTMLDivElement>(null);\n  const endSentinelRef = useRef<HTMLDivElement>(null);\n\n  // Capture trigger before React commits (document.activeElement is still the opener).\n  // Body focus = page-load open → skip so sentinels stay inert.\n  useLayoutEffect(() => {\n    if (isModal || !isOpen) return;\n    const trigger =\n      returnFocusRef?.current ??\n      consumeFocusAnchor() ??\n      consumeLastInteractedElement() ??\n      (document.activeElement as HTMLElement);\n    if (!trigger || trigger === document.body) return;\n    // iframes manage their own internal focus. The parent doc only sees the\n    // <iframe> element. Calling .focus() on any parent-doc element while the\n    // user is inside an iframe forcibly blurs the iframe content (kills caret\n    // on textareas, cancels native <select> dropdowns). Skip capture so the\n    // auto-focus on open and focus-restore on close don't run.\n    if (trigger.tagName === 'IFRAME') return;\n    triggerRef.current = trigger;\n    if (endSentinelRef.current) endSentinelRef.current.tabIndex = 0;\n    return () => {\n      if (endSentinelRef.current) endSentinelRef.current.tabIndex = -1;\n    };\n  }, [isOpen, isModal]);\n\n  // Move focus into panel on open; restore to trigger on close.\n  useEffect(() => {\n    if (isModal || !isOpen || !triggerRef.current) return;\n\n    const rafId = requestAnimationFrame(() => {\n      const first = getFirstFocusableElement({ container: containerRef.current });\n      (first ?? containerRef.current)?.focus();\n      // Activate start sentinel so Shift+Tab from first content returns to trigger.\n      if (startSentinelRef.current) startSentinelRef.current.tabIndex = 0;\n    });\n\n    return () => {\n      cancelAnimationFrame(rafId);\n      if (startSentinelRef.current) startSentinelRef.current.tabIndex = -1;\n      const trigger = triggerRef.current;\n      triggerRef.current = null;\n      if (trigger?.isConnected) {\n        requestAnimationFrame(() => trigger.focus());\n      }\n    };\n  }, [isOpen, isModal]);\n\n  const handleStartFocus = (e: React.FocusEvent) => {\n    const fromInside =\n      containerRef.current?.contains(e.relatedTarget as Node) &&\n      e.relatedTarget !== containerRef.current;\n    if (fromInside) {\n      // Shift+Tab from first content → restore trigger\n      const trigger = triggerRef.current;\n      if (trigger?.isConnected) trigger.focus();\n    } else {\n      // Natural Tab entry from outside → forward to first content,\n      // deactivate so next Shift+Tab exits naturally.\n      if (startSentinelRef.current) startSentinelRef.current.tabIndex = -1;\n      const first = getFirstFocusableElement({ container: containerRef.current });\n      (first ?? containerRef.current)?.focus();\n    }\n  };\n\n  const handleEndFocus = (e: React.FocusEvent) => {\n    const fromInside =\n      containerRef.current?.contains(e.relatedTarget as Node) &&\n      e.relatedTarget !== containerRef.current;\n    if (fromInside) {\n      // Tab from last content → restore trigger\n      const trigger = triggerRef.current;\n      if (trigger?.isConnected) trigger.focus();\n    } else {\n      // Shift+Tab entry from outside → back to last content\n      const last = getLastFocusableElement({ container: containerRef.current });\n      (last ?? containerRef.current)?.focus();\n    }\n  };\n\n  return {\n    startSentinelProps: {\n      ref: startSentinelRef,\n      tabIndex: -1,\n      style: SENTINEL_STYLE,\n      'aria-hidden': true as const,\n      'data-focus-sentinel': 'start' as const,\n      onFocus: handleStartFocus,\n    },\n    endSentinelProps: {\n      ref: endSentinelRef,\n      tabIndex: -1,\n      style: SENTINEL_STYLE,\n      'aria-hidden': true as const,\n      'data-focus-sentinel': 'end' as const,\n      onFocus: handleEndFocus,\n    },\n  };\n}\n"],"names":["useRef","useLayoutEffect","useEffect","getFirstFocusableElement","getLastFocusableElement","consumeFocusAnchor","consumeLastInteractedElement","SENTINEL_STYLE","position","opacity","pointerEvents","width","height","useFocusSentinel","isOpen","isModal","containerRef","returnFocusRef","triggerRef","startSentinelRef","endSentinelRef","trigger","current","document","activeElement","body","tagName","tabIndex","rafId","requestAnimationFrame","container","focus","cancelAnimationFrame","isConnected","startSentinelProps","ref","style","onFocus","handleStartFocus","e","contains","relatedTarget","endSentinelProps","handleEndFocus"],"mappings":"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"}

package/dist/index22.js

@@ -1,69 +1,36 @@
-import t, { useRef as i, useEffect as L } from "react";
-import { TableContentLoader as O } from "./index27.js";
-import { announce as b } from "./index75.js";
-function f() {
-  return f = Object.assign ? Object.assign.bind() : function(r) {
-    for (var l = 1; l < arguments.length; l++) {
-      var e = arguments[l];
-      for (var a in e) ({}).hasOwnProperty.call(e, a) && (r[a] = e[a]);
-    }
-    return r;
-  }, f.apply(null, arguments);
-}
-const _ = ({
-  className: r = "",
-  automationId: l = "",
-  loading: e,
-  headerColSpan: a = [],
-  headerData: c,
-  tableData: o,
-  renderTableContentLoader: R,
-  getTableHeaders: m,
-  getTableBody: p,
-  getTableFooter: v,
-  onSortUiUpdate: d,
-  onRowClick: h,
-  tableId: E,
-  ariaDescribedBy: x,
-  ariaLabel: w,
-  loadingAnnouncement: s,
-  loadedAnnouncement: n,
-  ...y
-}) => {
-  const g = i(null), u = i(!1);
-  return L(() => {
-    e !== u.current && (u.current = e, e && s ? b(s) : !e && n && b(n));
-  }, [e, s, n]), /* @__PURE__ */ t.createElement("div", f({
-    className: "se-design-table-layout-wrapper flex flex-col flex-1 min-h-0" + (r.length > 0 ? ` ${r}` : "") + (e ? " table-data-loading" : "")
-  }, y), /* @__PURE__ */ t.createElement("div", {
-    className: "se-design-table-scroll-area flex-1 min-h-0 overflow-y-auto"
-  }, /* @__PURE__ */ t.createElement("table", {
-    className: "se-design-table w-full bg-[var(--color-white)] border-collapse table-fixed",
-    ref: g,
-    "data-automation-id": l,
-    id: E,
-    "aria-describedby": x,
-    "aria-label": w
-  }, /* @__PURE__ */ t.createElement("thead", null, /* @__PURE__ */ t.createElement("tr", null, m({
-    headerData: c,
-    sortData: {},
-    onSortUiUpdate: d,
-    loading: e
-  }))), /* @__PURE__ */ t.createElement("tbody", null, e ? /* @__PURE__ */ t.createElement(O, {
-    noOfColumns: c?.length,
-    colSpan: a
-  }) : p({
-    tableData: o,
-    onRowClick: h,
-    loading: e
-  })))), /* @__PURE__ */ t.createElement("div", {
-    className: "se-design-table-footer w-full bg-[var(--color-white)] flex-shrink-0"
-  }, v({
-    tableData: o,
-    loading: e
-  })));
-};
+import e from "react";
+import { Popover as l } from "./index19.js";
+import { Icon as s } from "./index6.js";
+const t = {
+  base: "se-design-hamburger-menu rounded-[6px] transition-all duration-300 p-[3px] flex items-center",
+  active: "bg-[var(--color-blue-450)]",
+  hover: "hover:bg-[var(--color-blue-450)]"
+}, u = ({
+  className: a = "",
+  automationId: n = "",
+  popoverContentAutomationId: m = "",
+  menuContent: o,
+  popoverClassName: c = ""
+}) => /* @__PURE__ */ e.createElement(l, {
+  className: a,
+  position: "bottom-left",
+  automationId: n,
+  popoverContentAutomationId: m,
+  renderPopoverSrcElement: ({
+    displayPopover: r
+  }) => /* @__PURE__ */ e.createElement("div", {
+    className: `${t.base} ${r ? t.active : ""} ${t.hover}`
+  }, /* @__PURE__ */ e.createElement(s, {
+    name: "hamburger",
+    stroke: "var(--color-white)"
+  })),
+  renderPopoverContents: (r) => /* @__PURE__ */ e.createElement("div", {
+    className: `min-w-[212px] ${c}`
+  }, o && /* @__PURE__ */ e.createElement("div", {
+    className: "menu-content"
+  }, o(r)))
+});
 export {
-  _ as TableLayout
+  u as HamburgerMenu
 };
 //# sourceMappingURL=index22.js.map

package/dist/index22.js.map

@@ -1 +1 @@
-{"version":3,"file":"index22.js","sources":["../src/components/TableLayout/index.tsx"],"sourcesContent":["import React, { FC, ReactNode, useEffect, useRef } from 'react';\nimport { TableContentLoader } from 'components/TableContentLoader';\nimport { announce } from 'src/utils/a11y/liveAnnouncer/LiveAnnouncer';\n\nexport interface TableLayoutProps {\n  className?: string;\n  automationId?: string;\n  loading: boolean;\n  headerData: any[];\n  tableData: any[];\n  headerColSpan?: number[];\n  renderTableContentLoader?: (noOfColumns: number) => ReactNode;\n  getTableHeaders: (props: { headerData: any[]; sortData: any; onSortUiUpdate: any; loading: boolean }) => ReactNode;\n  getTableBody: (props: { tableData: any[]; onRowClick: any; loading: boolean }) => ReactNode;\n  getTableFooter: (props: { tableData: any[]; loading: boolean }) => ReactNode;\n  onSortUiUpdate: (newSortData: any) => void;\n  onRowClick: (rowData: any) => void;\n  tableId: string;\n  /**\n   * ID of element that describes the table (e.g., sort instructions for screen readers)\n   */\n  ariaDescribedBy?: string;\n  /**\n   * Accessible name for the table element\n   */\n  ariaLabel?: string;\n  /**\n   * Announced to screen readers when loading begins.\n   * Pass a translated string from the consumer (e.g. \"Loading documents\").\n   */\n  loadingAnnouncement?: string;\n  /**\n   * Announced to screen readers when loading completes.\n   * Pass a translated string from the consumer (e.g. \"Documents loaded\").\n   */\n  loadedAnnouncement?: string;\n}\n\nexport const TableLayout: FC<TableLayoutProps> = ({\n  className = '',\n  automationId = '',\n  loading,\n  headerColSpan = [],\n  headerData,\n  tableData,\n  renderTableContentLoader,\n  getTableHeaders,\n  getTableBody,\n  getTableFooter,\n  onSortUiUpdate,\n  onRowClick,\n  tableId,\n  ariaDescribedBy,\n  ariaLabel,\n  loadingAnnouncement,\n  loadedAnnouncement,\n  ...props\n}) => {\n  const tableRef = useRef<HTMLTableElement>(null);\n  const prevLoadingRef = useRef(false);\n\n  useEffect(() => {\n    if (loading === prevLoadingRef.current) return;\n    prevLoadingRef.current = loading;\n    if (loading && loadingAnnouncement) {\n      announce(loadingAnnouncement);\n    } else if (!loading && loadedAnnouncement) {\n      announce(loadedAnnouncement);\n    }\n  }, [loading, loadingAnnouncement, loadedAnnouncement]);\n\n  return (\n    <div className={'se-design-table-layout-wrapper flex flex-col flex-1 min-h-0' + (className.length > 0 ? ` ${className}` : '') + (loading? ' table-data-loading' : '')} {...props}>\n      <div className=\"se-design-table-scroll-area flex-1 min-h-0 overflow-y-auto\">\n        <table\n          className={'se-design-table w-full bg-[var(--color-white)] border-collapse table-fixed'}\n          ref={tableRef}\n          data-automation-id={automationId}\n          id={tableId}\n          aria-describedby={ariaDescribedBy}\n          aria-label={ariaLabel}\n        >\n          <thead>\n            <tr>{getTableHeaders({ headerData, sortData: {}, onSortUiUpdate, loading })}</tr>\n          </thead>\n          <tbody>\n            {loading ? (\n              <TableContentLoader noOfColumns={headerData?.length} colSpan={headerColSpan} />\n            ) : (\n              getTableBody({ tableData, onRowClick, loading })\n            )}\n          </tbody>\n        </table>\n      </div>\n      <div className=\"se-design-table-footer w-full bg-[var(--color-white)] flex-shrink-0\">\n        {getTableFooter({ tableData, loading })}\n      </div>\n    </div>\n  );\n};\n"],"names":["TableLayout","className","automationId","loading","headerColSpan","headerData","tableData","renderTableContentLoader","getTableHeaders","getTableBody","getTableFooter","onSortUiUpdate","onRowClick","tableId","ariaDescribedBy","ariaLabel","loadingAnnouncement","loadedAnnouncement","props","tableRef","useRef","prevLoadingRef","useEffect","current","announce","React","createElement","_extends","length","ref","id","sortData","TableContentLoader","noOfColumns","colSpan"],"mappings":";;;;;;;;;;;;AAsCO,MAAMA,IAAoCA,CAAC;AAAA,EAChDC,WAAAA,IAAY;AAAA,EACZC,cAAAA,IAAe;AAAA,EACfC,SAAAA;AAAAA,EACAC,eAAAA,IAAgB,CAAA;AAAA,EAChBC,YAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,0BAAAA;AAAAA,EACAC,iBAAAA;AAAAA,EACAC,cAAAA;AAAAA,EACAC,gBAAAA;AAAAA,EACAC,gBAAAA;AAAAA,EACAC,YAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,iBAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,qBAAAA;AAAAA,EACAC,oBAAAA;AAAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAWC,EAAyB,IAAI,GACxCC,IAAiBD,EAAO,EAAK;AAEnCE,SAAAA,EAAU,MAAM;AACd,IAAInB,MAAYkB,EAAeE,YAC/BF,EAAeE,UAAUpB,GACrBA,KAAWa,IACbQ,EAASR,CAAmB,IACnB,CAACb,KAAWc,KACrBO,EAASP,CAAkB;AAAA,EAE/B,GAAG,CAACd,GAASa,GAAqBC,CAAkB,CAAC,GAGnDQ,gBAAAA,EAAAC,cAAA,OAAAC,EAAA;AAAA,IAAK1B,WAAW,iEAAiEA,EAAU2B,SAAS,IAAI,IAAI3B,CAAS,KAAK,OAAOE,IAAS,wBAAwB;AAAA,EAAA,GAASe,CAAK,GAC9KO,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKzB,WAAU;AAAA,EAAA,GACbwB,gBAAAA,EAAAC,cAAA,SAAA;AAAA,IACEzB,WAAW;AAAA,IACX4B,KAAKV;AAAAA,IACL,sBAAoBjB;AAAAA,IACpB4B,IAAIjB;AAAAA,IACJ,oBAAkBC;AAAAA,IAClB,cAAYC;AAAAA,EAAAA,qBAEZW,cAAA,SAAA,MACED,gBAAAA,EAAAC,cAAA,MAAA,MAAKlB,EAAgB;AAAA,IAAEH,YAAAA;AAAAA,IAAY0B,UAAU,CAAA;AAAA,IAAIpB,gBAAAA;AAAAA,IAAgBR,SAAAA;AAAAA,EAAAA,CAAS,CAAM,CAC3E,GACPsB,gBAAAA,EAAAC,cAAA,SAAA,MACGvB,IACCsB,gBAAAA,EAAAC,cAACM,GAAkB;AAAA,IAACC,aAAa5B,GAAYuB;AAAAA,IAAQM,SAAS9B;AAAAA,EAAAA,CAAgB,IAE9EK,EAAa;AAAA,IAAEH,WAAAA;AAAAA,IAAWM,YAAAA;AAAAA,IAAYT,SAAAA;AAAAA,EAAAA,CAAS,CAE5C,CACF,CACJ,GACLsB,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKzB,WAAU;AAAA,EAAA,GACZS,EAAe;AAAA,IAAEJ,WAAAA;AAAAA,IAAWH,SAAAA;AAAAA,EAAAA,CAAS,CACnC,CACF;AAET;"}
+{"version":3,"file":"index22.js","sources":["../src/components/HamburgerMenu/index.tsx"],"sourcesContent":["import React, { FC } from 'react';\n\nimport { Popover } from 'src/components/Popover';\nimport { Icon } from 'src/components/Icon';\nexport interface HamburgerMenuProps {\n  className?: string;\n  automationId?: string;\n  popoverContentAutomationId?: string;\n  menuContent?: (data: any) => React.ReactNode;\n  popoverClassName?: string;\n}\n\nconst menuClasses = {\n  base: 'se-design-hamburger-menu rounded-[6px] transition-all duration-300 p-[3px] flex items-center',\n  active: 'bg-[var(--color-blue-450)]',\n  hover: 'hover:bg-[var(--color-blue-450)]'\n};\n\nexport const HamburgerMenu: FC<HamburgerMenuProps> = ({\n  className = '',\n  automationId = '',\n  popoverContentAutomationId = '',\n  menuContent,\n  popoverClassName = ''\n}) => {\n\n  return (\n    <Popover\n      className={className}\n      position='bottom-left'\n      automationId={automationId}\n      popoverContentAutomationId={popoverContentAutomationId}\n      renderPopoverSrcElement={({ displayPopover }) => (\n        <div className={`${menuClasses.base} ${displayPopover ? menuClasses.active : ''} ${menuClasses.hover}`}>\n          <Icon name='hamburger' stroke={'var(--color-white)'} />\n        </div>\n      )}\n      renderPopoverContents={(data) => (\n        <div className={`min-w-[212px] ${popoverClassName}`}>\n          {menuContent && <div className='menu-content'>{menuContent(data)}</div>}\n        </div>\n      )}\n    />\n  );\n};\n"],"names":["React__default","Popover","Icon","menuClasses","base","active","hover","HamburgerMenu","className","automationId","popoverContentAutomationId","menuContent","popoverClassName","React","createElement","position","renderPopoverSrcElement","displayPopover","name","stroke","renderPopoverContents","data"],"mappings":"AAYA,OAAAA,OAAA;AAAA,SAAA,WAAAC,SAAA;AAAA,SAAA,QAAAC,SAAA;AAAA,MAAMC,IAAc;AAAA,EAClBC,MAAM;AAAA,EACNC,QAAQ;AAAA,EACRC,OAAO;AACT,GAEaC,IAAwCA,CAAC;AAAA,EACpDC,WAAAA,IAAY;AAAA,EACZC,cAAAA,IAAe;AAAA,EACfC,4BAAAA,IAA6B;AAAA,EAC7BC,aAAAA;AAAAA,EACAC,kBAAAA,IAAmB;AACrB,MAGIC,gBAAAA,EAAAC,cAACb,GAAO;AAAA,EACNO,WAAAA;AAAAA,EACAO,UAAS;AAAA,EACTN,cAAAA;AAAAA,EACAC,4BAAAA;AAAAA,EACAM,yBAAyBA,CAAC;AAAA,IAAEC,gBAAAA;AAAAA,EAAAA,MAC1BJ,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKN,WAAW,GAAGL,EAAYC,IAAI,IAAIa,IAAiBd,EAAYE,SAAS,EAAE,IAAIF,EAAYG,KAAK;AAAA,EAAA,GAClGO,gBAAAA,EAAAC,cAACZ,GAAI;AAAA,IAACgB,MAAK;AAAA,IAAYC,QAAQ;AAAA,EAAA,CAAuB,CACnD;AAAA,EAEPC,uBAAwBC,CAAAA,MACtBR,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKN,WAAW,iBAAiBI,CAAgB;AAAA,EAAA,GAC9CD,KAAeE,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKN,WAAU;AAAA,EAAA,GAAgBG,EAAYU,CAAI,CAAO,CACnE;AAAA,CAER;"}

package/dist/{index223.js → index224.js}

@@ -5,4 +5,4 @@ function o(...n) {
 export {
   o as mergeIds
 };
-//# sourceMappingURL=index223.js.map
+//# sourceMappingURL=index224.js.map

package/dist/{index223.js.map → index224.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index223.js","sources":["../src/utils/mergeIds.ts"],"sourcesContent":["/**\n * Merges multiple ID strings into a single space-separated string.\n * Filters out falsy values and deduplicates IDs while preserving order.\n * \n * Useful for ARIA attributes (aria-describedby, aria-labelledby) and class names.\n * \n * @param ids - Array of id strings (or undefined/null)\n * @returns Merged space-separated id string, or undefined if no valid ids\n * \n * @example\n * mergeIds('error-1', undefined, 'helper-1', 'error-1')\n * // Returns: 'error-1 helper-1'\n */\nexport function mergeIds(...ids: (string | undefined | null)[]): string | undefined {\n  const uniqueIds = [\n    ...new Set(\n      ids\n        .filter((id): id is string => Boolean(id))\n        .flatMap(id => id.trim().split(/\\s+/))\n        .filter(Boolean)\n    )\n  ];\n  \n  return uniqueIds.length > 0 ? uniqueIds.join(' ') : undefined;\n}\n"],"names":["mergeIds","ids","uniqueIds","Set","filter","id","Boolean","flatMap","trim","split","length","join","undefined"],"mappings":"AAaO,SAASA,KAAYC,GAAwD;AAClF,QAAMC,IAAY,CAChB,GAAG,IAAIC,IACLF,EACGG,OAAO,CAACC,MAAqBC,EAAQD,CAAG,EACxCE,QAAQF,CAAAA,MAAMA,EAAGG,OAAOC,MAAM,KAAK,CAAC,EACpCL,OAAOE,OAAO,CACnB,CAAC;AAGH,SAAOJ,EAAUQ,SAAS,IAAIR,EAAUS,KAAK,GAAG,IAAIC;AACtD;"}
+{"version":3,"file":"index224.js","sources":["../src/utils/mergeIds.ts"],"sourcesContent":["/**\n * Merges multiple ID strings into a single space-separated string.\n * Filters out falsy values and deduplicates IDs while preserving order.\n * \n * Useful for ARIA attributes (aria-describedby, aria-labelledby) and class names.\n * \n * @param ids - Array of id strings (or undefined/null)\n * @returns Merged space-separated id string, or undefined if no valid ids\n * \n * @example\n * mergeIds('error-1', undefined, 'helper-1', 'error-1')\n * // Returns: 'error-1 helper-1'\n */\nexport function mergeIds(...ids: (string | undefined | null)[]): string | undefined {\n  const uniqueIds = [\n    ...new Set(\n      ids\n        .filter((id): id is string => Boolean(id))\n        .flatMap(id => id.trim().split(/\\s+/))\n        .filter(Boolean)\n    )\n  ];\n  \n  return uniqueIds.length > 0 ? uniqueIds.join(' ') : undefined;\n}\n"],"names":["mergeIds","ids","uniqueIds","Set","filter","id","Boolean","flatMap","trim","split","length","join","undefined"],"mappings":"AAaO,SAASA,KAAYC,GAAwD;AAClF,QAAMC,IAAY,CAChB,GAAG,IAAIC,IACLF,EACGG,OAAO,CAACC,MAAqBC,EAAQD,CAAG,EACxCE,QAAQF,CAAAA,MAAMA,EAAGG,OAAOC,MAAM,KAAK,CAAC,EACpCL,OAAOE,OAAO,CACnB,CAAC;AAGH,SAAOJ,EAAUQ,SAAS,IAAIR,EAAUS,KAAK,GAAG,IAAIC;AACtD;"}

package/dist/{index225.js → index226.js}

@@ -12,4 +12,4 @@ function n(o, u) {
 export {
   n as debounce
 };
-//# sourceMappingURL=index225.js.map
+//# sourceMappingURL=index226.js.map

package/dist/{index225.js.map → index226.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index225.js","sources":["../src/utils/debounce.ts"],"sourcesContent":["export function debounce<T extends (...args: any[]) => void>(func: T, wait: number) {\n    let timeout: ReturnType<typeof setTimeout> | null;\n    const debounced = (...args: Parameters<T>) => {\n      if (timeout) clearTimeout(timeout);\n      timeout = setTimeout(() => {\n        func(...args);\n      }, wait);\n    };\n    debounced.cancel = () => {\n      if (timeout) clearTimeout(timeout);\n      timeout = null;\n    };\n    return debounced as T & { cancel: () => void };\n  }"],"names":["debounce","func","wait","timeout","debounced","args","setTimeout","cancel"],"mappings":"AAAO,SAASA,EAA6CC,GAASC,GAAc;AAChF,MAAIC;AACJ,QAAMC,IAAYA,IAAIC,MAAwB;AAC5C,IAAIF,kBAAsBA,CAAO,GACjCA,IAAUG,WAAW,MAAM;AACzBL,MAAAA,EAAK,GAAGI,CAAI;AAAA,IACd,GAAGH,CAAI;AAAA,EACT;AACAE,SAAAA,EAAUG,SAAS,MAAM;AACvB,IAAIJ,kBAAsBA,CAAO,GACjCA,IAAU;AAAA,EACZ,GACOC;AACT;"}
+{"version":3,"file":"index226.js","sources":["../src/utils/debounce.ts"],"sourcesContent":["export function debounce<T extends (...args: any[]) => void>(func: T, wait: number) {\n    let timeout: ReturnType<typeof setTimeout> | null;\n    const debounced = (...args: Parameters<T>) => {\n      if (timeout) clearTimeout(timeout);\n      timeout = setTimeout(() => {\n        func(...args);\n      }, wait);\n    };\n    debounced.cancel = () => {\n      if (timeout) clearTimeout(timeout);\n      timeout = null;\n    };\n    return debounced as T & { cancel: () => void };\n  }"],"names":["debounce","func","wait","timeout","debounced","args","setTimeout","cancel"],"mappings":"AAAO,SAASA,EAA6CC,GAASC,GAAc;AAChF,MAAIC;AACJ,QAAMC,IAAYA,IAAIC,MAAwB;AAC5C,IAAIF,kBAAsBA,CAAO,GACjCA,IAAUG,WAAW,MAAM;AACzBL,MAAAA,EAAK,GAAGI,CAAI;AAAA,IACd,GAAGH,CAAI;AAAA,EACT;AACAE,SAAAA,EAAUG,SAAS,MAAM;AACvB,IAAIJ,kBAAsBA,CAAO,GACjCA,IAAU;AAAA,EACZ,GACOC;AACT;"}

package/dist/index23.js

@@ -1,90 +1,69 @@
-import s, { useState as j, useEffect as K } from "react";
-import { useStableId as L } from "./index206.js";
-import { getA11yNameAttributes as q } from "./index81.js";
-import "./index72.js";
-/* empty css         */
-function h() {
-  return h = Object.assign ? Object.assign.bind() : function(l) {
-    for (var i = 1; i < arguments.length; i++) {
-      var r = arguments[i];
-      for (var e in r) ({}).hasOwnProperty.call(r, e) && (l[e] = r[e]);
+import t, { useRef as i, useEffect as L } from "react";
+import { TableContentLoader as O } from "./index28.js";
+import { announce as b } from "./index76.js";
+function f() {
+  return f = Object.assign ? Object.assign.bind() : function(r) {
+    for (var l = 1; l < arguments.length; l++) {
+      var e = arguments[l];
+      for (var a in e) ({}).hasOwnProperty.call(e, a) && (r[a] = e[a]);
     }
-    return l;
-  }, h.apply(null, arguments);
+    return r;
+  }, f.apply(null, arguments);
 }
-const H = ({
-  className: l = "",
-  automationId: i = "",
-  defaultChecked: r = !1,
-  checked: e,
-  disabled: n = !1,
-  onChange: x,
-  checkMarkType: o = "",
-  label: u = "",
-  disabledLabel: g = "",
-  containerAutomationId: E = "",
-  ariaLabel: y,
-  ariaLabelledBy: C,
-  ariaDescribedBy: N,
-  ariaControls: I,
-  tabIndex: k,
-  ariaHidden: w = !1
+const _ = ({
+  className: r = "",
+  automationId: l = "",
+  loading: e,
+  headerColSpan: a = [],
+  headerData: c,
+  tableData: o,
+  renderTableContentLoader: R,
+  getTableHeaders: m,
+  getTableBody: p,
+  getTableFooter: v,
+  onSortUiUpdate: d,
+  onRowClick: h,
+  tableId: E,
+  ariaDescribedBy: x,
+  ariaLabel: w,
+  loadingAnnouncement: s,
+  loadedAnnouncement: n,
+  ...y
 }) => {
-  const c = e !== void 0, [t, m] = j(c ? e : r);
-  K(() => {
-    m(c ? e : r);
-  }, [e, r]);
-  const A = (a) => {
-    n || (c || m((b) => !b), x?.(c ? !e : !t, a));
-  }, $ = (a) => {
-    if (!n && (a.key === "Enter" || a.key === " ")) {
-      a.preventDefault(), a.stopPropagation();
-      const b = c ? !e : !t;
-      c || m(b);
-      const d = a.currentTarget.closest("label")?.querySelector("input");
-      d && x?.(b, {
-        target: d,
-        currentTarget: d
-      });
-    }
-  }, D = () => n ? t && o === "tick" ? "disabled-tick" : t && o === "minus-checkbox" ? "disabled-minus-checkbox" : t && !o ? "disabled-tick" : "disabled-default" : o === "minus-checkbox" && t ? "minus-checkbox" : t ? "checked" : "unchecked", O = () => n ? "checkbox-label-disabled" : "checkbox-label", p = () => n && g ? g : u, f = L(void 0, "checkbox-input"), v = u ? `${f}-label` : void 0, S = q({
-    ariaLabelledBy: C,
-    internalLabelId: v,
-    ariaLabel: y,
-    ariaDescribedBy: N
-  }), _ = () => o === "minus-checkbox" && t ? "mixed" : t ? "true" : "false";
-  return /* @__PURE__ */ s.createElement("div", {
-    className: "se-design-checkbox-ctn",
-    "aria-hidden": w ? "true" : void 0
-  }, /* @__PURE__ */ s.createElement("label", h({
-    role: "checkbox",
-    htmlFor: f,
-    className: `se-design-checkbox ${l} ${D()}`,
-    "data-automation-id": E || "checkbox-container",
-    tabIndex: k !== void 0 ? k : n ? -1 : 0,
-    "aria-checked": _(),
-    "aria-disabled": n ? "true" : "false",
-    "aria-controls": I
-  }, S, {
-    onKeyDown: $
-  }), /* @__PURE__ */ s.createElement("input", {
-    id: f,
-    type: "checkbox",
-    checked: t,
-    onChange: A,
-    disabled: n,
-    tabIndex: -1,
-    "aria-hidden": "true"
-  }), /* @__PURE__ */ s.createElement("span", {
-    className: "checkbox-item",
-    "data-automation-id": i
-  }), p()?.length > 0 && /* @__PURE__ */ s.createElement("span", {
-    id: v,
-    className: O(),
-    "data-automation-id": i || (u ? `checkbox-label-${u}` : "checkbox-label")
-  }, p())));
+  const g = i(null), u = i(!1);
+  return L(() => {
+    e !== u.current && (u.current = e, e && s ? b(s) : !e && n && b(n));
+  }, [e, s, n]), /* @__PURE__ */ t.createElement("div", f({
+    className: "se-design-table-layout-wrapper flex flex-col flex-1 min-h-0" + (r.length > 0 ? ` ${r}` : "") + (e ? " table-data-loading" : "")
+  }, y), /* @__PURE__ */ t.createElement("div", {
+    className: "se-design-table-scroll-area flex-1 min-h-0 overflow-y-auto"
+  }, /* @__PURE__ */ t.createElement("table", {
+    className: "se-design-table w-full bg-[var(--color-white)] border-collapse table-fixed",
+    ref: g,
+    "data-automation-id": l,
+    id: E,
+    "aria-describedby": x,
+    "aria-label": w
+  }, /* @__PURE__ */ t.createElement("thead", null, /* @__PURE__ */ t.createElement("tr", null, m({
+    headerData: c,
+    sortData: {},
+    onSortUiUpdate: d,
+    loading: e
+  }))), /* @__PURE__ */ t.createElement("tbody", null, e ? /* @__PURE__ */ t.createElement(O, {
+    noOfColumns: c?.length,
+    colSpan: a
+  }) : p({
+    tableData: o,
+    onRowClick: h,
+    loading: e
+  })))), /* @__PURE__ */ t.createElement("div", {
+    className: "se-design-table-footer w-full bg-[var(--color-white)] flex-shrink-0"
+  }, v({
+    tableData: o,
+    loading: e
+  })));
 };
 export {
-  H as Checkbox
+  _ as TableLayout
 };
 //# sourceMappingURL=index23.js.map

package/dist/index23.js.map

@@ -1 +1 @@
-{"version":3,"file":"index23.js","sources":["../src/components/Checkbox/index.tsx"],"sourcesContent":["import React, { FC, useState, useEffect } from 'react';\nimport { useStableId } from '../../utils/useStableId';\nimport { getA11yNameAttributes } from '../../utils/a11y';\nimport './style.scss';\n\nexport interface CheckboxProps {\n  className?: string;\n  automationId?: string;\n  defaultChecked?: boolean;\n  /**\n   * Controlled checked value. When provided, the checkbox is controlled by the parent\n   * and its visual state always reflects this prop. Use `onChange` to update the parent state.\n   */\n  checked?: boolean;\n  onChange?: (checked: boolean, e: React.ChangeEvent<HTMLInputElement>) => void;\n  disabled?: boolean;\n  checkMarkType?: 'tick' | 'minus-checkbox' | '';\n  label?: string;\n  disabledLabel?: string;\n  containerAutomationId?: string;\n  /**\n   * Explicit accessible name for the checkbox.\n   * Used as fallback when ariaLabelledBy is not provided and no internal label exists.\n   */\n  ariaLabel?: string;\n  /**\n   * ID(s) of element(s) that label this checkbox (for screen reader association).\n   * Typically used when checkbox is part of a larger labelled context.\n   */\n  ariaLabelledBy?: string;\n  /**\n   * ID(s) of element(s) that describe this checkbox (provides additional context).\n   * Often used for help text or instructions.\n   */\n  ariaDescribedBy?: string;\n  /**\n   * ID of the element controlled by this checkbox (e.g. an expandable region).\n   */\n  ariaControls?: string;\n  /**\n   * Override the default tabIndex. Pass -1 when the checkbox is used as a\n   * visual-only indicator inside a composite widget (e.g. listbox option).\n   */\n  tabIndex?: number;\n  /**\n   * When true, sets aria-hidden=\"true\" on the checkbox container so the\n   * checkbox role and state are hidden from assistive technology. Use when\n   * the checkbox is purely visual (e.g. inside a role=\"option\" that already\n   * conveys selection state via aria-selected).\n   */\n  ariaHidden?: boolean;\n}\n\nexport const Checkbox: FC<CheckboxProps> = ({\n  className = '',\n  automationId = '',\n  defaultChecked = false,\n  checked,\n  disabled = false,\n  onChange,\n  checkMarkType = '',\n  label = '',\n  disabledLabel = '',\n  containerAutomationId = '',\n  ariaLabel,\n  ariaLabelledBy,\n  ariaDescribedBy,\n  ariaControls,\n  tabIndex: tabIndexProp,\n  ariaHidden = false\n}) => {\n  const isControlled = checked !== undefined;\n  const [isChecked, setIsChecked] = useState(isControlled ? checked : defaultChecked);\n\n  useEffect(() => {\n    if (isControlled) {\n      setIsChecked(checked!);\n    } else {\n      setIsChecked(defaultChecked);\n    }\n  }, [checked, defaultChecked]);\n\n  const handleClick = (e: React.ChangeEvent<HTMLInputElement>) => {\n    if (disabled) return;\n    if (!isControlled) {\n      setIsChecked((prev) => !prev);\n    }\n    onChange?.(isControlled ? !checked : !isChecked, e);\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLLabelElement | HTMLSpanElement>) => {\n    if (disabled) return;\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      e.stopPropagation();\n      const newChecked = isControlled ? !checked : !isChecked;\n      if (!isControlled) {\n        setIsChecked(newChecked);\n      }\n\n      // Create a proper synthetic event for the onChange callback\n      const inputElement = e.currentTarget.closest('label')?.querySelector('input');\n      if (inputElement) {\n        const syntheticEvent = {\n          target: inputElement,\n          currentTarget: inputElement\n        } as React.ChangeEvent<HTMLInputElement>;\n        onChange?.(newChecked, syntheticEvent);\n      }\n    }\n  };\n\n  const getCheckBoxClassName = () => {\n    // Handle disabled states with proper checked status\n    if (disabled) {\n      if (isChecked && checkMarkType === 'tick') return 'disabled-tick';\n      if (isChecked && checkMarkType === 'minus-checkbox') return 'disabled-minus-checkbox';\n      if (isChecked && !checkMarkType) return 'disabled-tick'; // Default to tick for checked disabled\n      return 'disabled-default'; // Unchecked disabled\n    }\n\n    // Handle enabled states\n    if (checkMarkType === 'minus-checkbox' && isChecked) return 'minus-checkbox';\n    return isChecked ? 'checked' : 'unchecked';\n  };\n\n  const getLabelClassName = () => {\n    return disabled ? 'checkbox-label-disabled' : 'checkbox-label';\n  };\n\n  const getLabelText = () => {\n    if (disabled && disabledLabel) {\n      return disabledLabel;\n    }\n    return label;\n  };\n\n  // Generate stable IDs (persists across renders)\n  const inputId = useStableId(undefined, 'checkbox-input');\n  const labelId = label ? `${inputId}-label` : undefined;\n\n  const a11yNameAttributes = getA11yNameAttributes({\n    ariaLabelledBy,\n    internalLabelId: labelId,\n    ariaLabel,\n    ariaDescribedBy\n  });\n\n  // Determine aria-checked value: \"mixed\" for indeterminate, \"true\" for checked, \"false\" for unchecked\n  const getAriaChecked = () => {\n    if (checkMarkType === 'minus-checkbox' && isChecked) {\n      return 'mixed'; // Indeterminate/half-checked state\n    }\n    return isChecked ? 'true' : 'false';\n  };\n\n  return (\n    <div className=\"se-design-checkbox-ctn\" aria-hidden={ariaHidden ? 'true' : undefined}>\n      <label\n        role=\"checkbox\"\n        htmlFor={inputId}\n        className={`se-design-checkbox ${className} ${getCheckBoxClassName()}`}\n        data-automation-id={containerAutomationId || 'checkbox-container'}\n        tabIndex={tabIndexProp !== undefined ? tabIndexProp : disabled ? -1 : 0}\n        aria-checked={getAriaChecked()}\n        aria-disabled={disabled ? 'true' : 'false'}\n        aria-controls={ariaControls}\n        {...a11yNameAttributes}\n        onKeyDown={handleKeyDown}\n      >\n        <input\n          id={inputId}\n          type=\"checkbox\"\n          checked={isChecked}\n          onChange={handleClick}\n          disabled={disabled}\n          tabIndex={-1}\n          aria-hidden=\"true\"\n        />\n        <span className=\"checkbox-item\" data-automation-id={automationId}></span>\n        {getLabelText()?.length > 0 && (\n          <span\n            id={labelId}\n            className={getLabelClassName()}\n            data-automation-id={automationId || (label ? `checkbox-label-${label}` : 'checkbox-label')}\n          >\n            {getLabelText()}\n          </span>\n        )}\n      </label>\n    </div>\n  );\n};\n"],"names":["Checkbox","className","automationId","defaultChecked","checked","disabled","onChange","checkMarkType","label","disabledLabel","containerAutomationId","ariaLabel","ariaLabelledBy","ariaDescribedBy","ariaControls","tabIndex","tabIndexProp","ariaHidden","isControlled","undefined","isChecked","setIsChecked","useState","useEffect","handleClick","e","prev","handleKeyDown","key","preventDefault","stopPropagation","newChecked","inputElement","currentTarget","closest","querySelector","target","getCheckBoxClassName","getLabelClassName","getLabelText","inputId","useStableId","labelId","a11yNameAttributes","getA11yNameAttributes","internalLabelId","getAriaChecked","React","createElement","_extends","role","htmlFor","onKeyDown","id","type","length"],"mappings":"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"}
+{"version":3,"file":"index23.js","sources":["../src/components/TableLayout/index.tsx"],"sourcesContent":["import React, { FC, ReactNode, useEffect, useRef } from 'react';\nimport { TableContentLoader } from 'components/TableContentLoader';\nimport { announce } from 'src/utils/a11y/liveAnnouncer/LiveAnnouncer';\n\nexport interface TableLayoutProps {\n  className?: string;\n  automationId?: string;\n  loading: boolean;\n  headerData: any[];\n  tableData: any[];\n  headerColSpan?: number[];\n  renderTableContentLoader?: (noOfColumns: number) => ReactNode;\n  getTableHeaders: (props: { headerData: any[]; sortData: any; onSortUiUpdate: any; loading: boolean }) => ReactNode;\n  getTableBody: (props: { tableData: any[]; onRowClick: any; loading: boolean }) => ReactNode;\n  getTableFooter: (props: { tableData: any[]; loading: boolean }) => ReactNode;\n  onSortUiUpdate: (newSortData: any) => void;\n  onRowClick: (rowData: any) => void;\n  tableId: string;\n  /**\n   * ID of element that describes the table (e.g., sort instructions for screen readers)\n   */\n  ariaDescribedBy?: string;\n  /**\n   * Accessible name for the table element\n   */\n  ariaLabel?: string;\n  /**\n   * Announced to screen readers when loading begins.\n   * Pass a translated string from the consumer (e.g. \"Loading documents\").\n   */\n  loadingAnnouncement?: string;\n  /**\n   * Announced to screen readers when loading completes.\n   * Pass a translated string from the consumer (e.g. \"Documents loaded\").\n   */\n  loadedAnnouncement?: string;\n}\n\nexport const TableLayout: FC<TableLayoutProps> = ({\n  className = '',\n  automationId = '',\n  loading,\n  headerColSpan = [],\n  headerData,\n  tableData,\n  renderTableContentLoader,\n  getTableHeaders,\n  getTableBody,\n  getTableFooter,\n  onSortUiUpdate,\n  onRowClick,\n  tableId,\n  ariaDescribedBy,\n  ariaLabel,\n  loadingAnnouncement,\n  loadedAnnouncement,\n  ...props\n}) => {\n  const tableRef = useRef<HTMLTableElement>(null);\n  const prevLoadingRef = useRef(false);\n\n  useEffect(() => {\n    if (loading === prevLoadingRef.current) return;\n    prevLoadingRef.current = loading;\n    if (loading && loadingAnnouncement) {\n      announce(loadingAnnouncement);\n    } else if (!loading && loadedAnnouncement) {\n      announce(loadedAnnouncement);\n    }\n  }, [loading, loadingAnnouncement, loadedAnnouncement]);\n\n  return (\n    <div className={'se-design-table-layout-wrapper flex flex-col flex-1 min-h-0' + (className.length > 0 ? ` ${className}` : '') + (loading? ' table-data-loading' : '')} {...props}>\n      <div className=\"se-design-table-scroll-area flex-1 min-h-0 overflow-y-auto\">\n        <table\n          className={'se-design-table w-full bg-[var(--color-white)] border-collapse table-fixed'}\n          ref={tableRef}\n          data-automation-id={automationId}\n          id={tableId}\n          aria-describedby={ariaDescribedBy}\n          aria-label={ariaLabel}\n        >\n          <thead>\n            <tr>{getTableHeaders({ headerData, sortData: {}, onSortUiUpdate, loading })}</tr>\n          </thead>\n          <tbody>\n            {loading ? (\n              <TableContentLoader noOfColumns={headerData?.length} colSpan={headerColSpan} />\n            ) : (\n              getTableBody({ tableData, onRowClick, loading })\n            )}\n          </tbody>\n        </table>\n      </div>\n      <div className=\"se-design-table-footer w-full bg-[var(--color-white)] flex-shrink-0\">\n        {getTableFooter({ tableData, loading })}\n      </div>\n    </div>\n  );\n};\n"],"names":["TableLayout","className","automationId","loading","headerColSpan","headerData","tableData","renderTableContentLoader","getTableHeaders","getTableBody","getTableFooter","onSortUiUpdate","onRowClick","tableId","ariaDescribedBy","ariaLabel","loadingAnnouncement","loadedAnnouncement","props","tableRef","useRef","prevLoadingRef","useEffect","current","announce","React","createElement","_extends","length","ref","id","sortData","TableContentLoader","noOfColumns","colSpan"],"mappings":";;;;;;;;;;;;AAsCO,MAAMA,IAAoCA,CAAC;AAAA,EAChDC,WAAAA,IAAY;AAAA,EACZC,cAAAA,IAAe;AAAA,EACfC,SAAAA;AAAAA,EACAC,eAAAA,IAAgB,CAAA;AAAA,EAChBC,YAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,0BAAAA;AAAAA,EACAC,iBAAAA;AAAAA,EACAC,cAAAA;AAAAA,EACAC,gBAAAA;AAAAA,EACAC,gBAAAA;AAAAA,EACAC,YAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,iBAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,qBAAAA;AAAAA,EACAC,oBAAAA;AAAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAWC,EAAyB,IAAI,GACxCC,IAAiBD,EAAO,EAAK;AAEnCE,SAAAA,EAAU,MAAM;AACd,IAAInB,MAAYkB,EAAeE,YAC/BF,EAAeE,UAAUpB,GACrBA,KAAWa,IACbQ,EAASR,CAAmB,IACnB,CAACb,KAAWc,KACrBO,EAASP,CAAkB;AAAA,EAE/B,GAAG,CAACd,GAASa,GAAqBC,CAAkB,CAAC,GAGnDQ,gBAAAA,EAAAC,cAAA,OAAAC,EAAA;AAAA,IAAK1B,WAAW,iEAAiEA,EAAU2B,SAAS,IAAI,IAAI3B,CAAS,KAAK,OAAOE,IAAS,wBAAwB;AAAA,EAAA,GAASe,CAAK,GAC9KO,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKzB,WAAU;AAAA,EAAA,GACbwB,gBAAAA,EAAAC,cAAA,SAAA;AAAA,IACEzB,WAAW;AAAA,IACX4B,KAAKV;AAAAA,IACL,sBAAoBjB;AAAAA,IACpB4B,IAAIjB;AAAAA,IACJ,oBAAkBC;AAAAA,IAClB,cAAYC;AAAAA,EAAAA,qBAEZW,cAAA,SAAA,MACED,gBAAAA,EAAAC,cAAA,MAAA,MAAKlB,EAAgB;AAAA,IAAEH,YAAAA;AAAAA,IAAY0B,UAAU,CAAA;AAAA,IAAIpB,gBAAAA;AAAAA,IAAgBR,SAAAA;AAAAA,EAAAA,CAAS,CAAM,CAC3E,GACPsB,gBAAAA,EAAAC,cAAA,SAAA,MACGvB,IACCsB,gBAAAA,EAAAC,cAACM,GAAkB;AAAA,IAACC,aAAa5B,GAAYuB;AAAAA,IAAQM,SAAS9B;AAAAA,EAAAA,CAAgB,IAE9EK,EAAa;AAAA,IAAEH,WAAAA;AAAAA,IAAWM,YAAAA;AAAAA,IAAYT,SAAAA;AAAAA,EAAAA,CAAS,CAE5C,CACF,CACJ,GACLsB,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKzB,WAAU;AAAA,EAAA,GACZS,EAAe;AAAA,IAAEJ,WAAAA;AAAAA,IAAWH,SAAAA;AAAAA,EAAAA,CAAS,CACnC,CACF;AAET;"}

package/dist/{index233.js → index234.js}

@@ -1233,4 +1233,4 @@ const e = [
 export {
   e as default
 };
-//# sourceMappingURL=index233.js.map
+//# sourceMappingURL=index234.js.map

package/dist/{index233.js.map → index234.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index233.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index234.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/{index236.js → index237.js}

@@ -43,4 +43,4 @@ g.displayName = "TabButton";
 export {
   g as TabButton
 };
-//# sourceMappingURL=index236.js.map
+//# sourceMappingURL=index237.js.map

package/dist/{index236.js.map → index237.js.map}

@@ -1 +1 @@
-{"version":3,"file":"index236.js","sources":["../src/components/NavigationBar/TabButton.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { Button } from '../Button';\n\nexport interface TabButtonProps {\n  id: string;\n  label: string;\n  isSelected: boolean;\n  isDisabled?: boolean;\n  panelId?: string;\n  tabIndex: number;\n  className?: string;\n  automationId?: string;\n  onClick: (e: React.MouseEvent<HTMLButtonElement>) => void;\n  onFocus: () => void;\n  onKeyDown: (e: React.KeyboardEvent<HTMLButtonElement>) => void;\n}\n\n/**\n * Internal TabButton component for NavigationBar.\n * Uses Button (unstyled) internally for consistent activation handling.\n * Supports forwardRef for focus management (roving tabindex).\n */\nexport const TabButton = forwardRef<HTMLButtonElement, TabButtonProps>(\n  (\n    {\n      id,\n      label,\n      isSelected,\n      isDisabled = false,\n      panelId,\n      tabIndex,\n      className = '',\n      automationId,\n      onClick,\n      onFocus,\n      onKeyDown\n    },\n    ref\n  ) => {\n    return (\n      <Button\n        ref={ref}\n        type=\"unstyled\"\n        label={label}\n        disabled={isDisabled}\n        onClick={onClick}\n        className={className}\n        automationId={automationId}\n        role=\"tab\"\n        id={id}\n        aria-selected={isSelected}\n        {...(panelId ? { 'aria-controls': panelId } : {})}\n        tabIndex={tabIndex}\n        onFocus={onFocus}\n        onKeyDown={onKeyDown}\n      />\n    );\n  }\n);\n\nTabButton.displayName = 'TabButton';\n"],"names":["TabButton","id","label","isSelected","isDisabled","panelId","tabIndex","className","automationId","onClick","onFocus","onKeyDown","ref","React","createElement","Button","_extends","type","disabled","role","displayName"],"mappings":";;;;;;;;;;;AAsBO,MAAMA,sBACX,CACE;AAAA,EACEC,IAAAA;AAAAA,EACAC,OAAAA;AAAAA,EACAC,YAAAA;AAAAA,EACAC,YAAAA,IAAa;AAAA,EACbC,SAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,WAAAA,IAAY;AAAA,EACZC,cAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,WAAAA;AACF,GACAC,MAGEC,gBAAAA,EAAAC,cAACC,GAAMC,EAAA;AAAA,EACLJ,KAAAA;AAAAA,EACAK,MAAK;AAAA,EACLf,OAAAA;AAAAA,EACAgB,UAAUd;AAAAA,EACVK,SAAAA;AAAAA,EACAF,WAAAA;AAAAA,EACAC,cAAAA;AAAAA,EACAW,MAAK;AAAA,EACLlB,IAAAA;AAAAA,EACA,iBAAeE;AAAAA,GACVE,IAAU;AAAA,EAAE,iBAAiBA;AAAAA,IAAY,IAAE;AAAA,EAChDC,UAAAA;AAAAA,EACAI,SAAAA;AAAAA,EACAC,WAAAA;AAAAA,CAAqB,CACtB,CAGP;AAEAX,EAAUoB,cAAc;"}
+{"version":3,"file":"index237.js","sources":["../src/components/NavigationBar/TabButton.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\nimport { Button } from '../Button';\n\nexport interface TabButtonProps {\n  id: string;\n  label: string;\n  isSelected: boolean;\n  isDisabled?: boolean;\n  panelId?: string;\n  tabIndex: number;\n  className?: string;\n  automationId?: string;\n  onClick: (e: React.MouseEvent<HTMLButtonElement>) => void;\n  onFocus: () => void;\n  onKeyDown: (e: React.KeyboardEvent<HTMLButtonElement>) => void;\n}\n\n/**\n * Internal TabButton component for NavigationBar.\n * Uses Button (unstyled) internally for consistent activation handling.\n * Supports forwardRef for focus management (roving tabindex).\n */\nexport const TabButton = forwardRef<HTMLButtonElement, TabButtonProps>(\n  (\n    {\n      id,\n      label,\n      isSelected,\n      isDisabled = false,\n      panelId,\n      tabIndex,\n      className = '',\n      automationId,\n      onClick,\n      onFocus,\n      onKeyDown\n    },\n    ref\n  ) => {\n    return (\n      <Button\n        ref={ref}\n        type=\"unstyled\"\n        label={label}\n        disabled={isDisabled}\n        onClick={onClick}\n        className={className}\n        automationId={automationId}\n        role=\"tab\"\n        id={id}\n        aria-selected={isSelected}\n        {...(panelId ? { 'aria-controls': panelId } : {})}\n        tabIndex={tabIndex}\n        onFocus={onFocus}\n        onKeyDown={onKeyDown}\n      />\n    );\n  }\n);\n\nTabButton.displayName = 'TabButton';\n"],"names":["TabButton","id","label","isSelected","isDisabled","panelId","tabIndex","className","automationId","onClick","onFocus","onKeyDown","ref","React","createElement","Button","_extends","type","disabled","role","displayName"],"mappings":";;;;;;;;;;;AAsBO,MAAMA,sBACX,CACE;AAAA,EACEC,IAAAA;AAAAA,EACAC,OAAAA;AAAAA,EACAC,YAAAA;AAAAA,EACAC,YAAAA,IAAa;AAAA,EACbC,SAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,WAAAA,IAAY;AAAA,EACZC,cAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,WAAAA;AACF,GACAC,MAGEC,gBAAAA,EAAAC,cAACC,GAAMC,EAAA;AAAA,EACLJ,KAAAA;AAAAA,EACAK,MAAK;AAAA,EACLf,OAAAA;AAAAA,EACAgB,UAAUd;AAAAA,EACVK,SAAAA;AAAAA,EACAF,WAAAA;AAAAA,EACAC,cAAAA;AAAAA,EACAW,MAAK;AAAA,EACLlB,IAAAA;AAAAA,EACA,iBAAeE;AAAAA,GACVE,IAAU;AAAA,EAAE,iBAAiBA;AAAAA,IAAY,IAAE;AAAA,EAChDC,UAAAA;AAAAA,EACAI,SAAAA;AAAAA,EACAC,WAAAA;AAAAA,CAAqB,CACtB,CAGP;AAEAX,EAAUoB,cAAc;"}

package/dist/index24.js

@@ -1,26 +1,90 @@
-import e from "react";
-import { Badge as c } from "./index10.js";
-const m = (t) => {
-  const {
-    label: a,
-    color: l,
-    onClick: r = () => {
-    },
-    tag: o
-  } = t;
-  return /* @__PURE__ */ e.createElement("div", {
-    className: "se-design-color-coded-label flex items-center gap-2",
-    onClick: r
-  }, l && /* @__PURE__ */ e.createElement("span", {
-    className: "w-[15px] h-[15px] rounded-[3px] inline-block",
-    style: {
-      backgroundColor: l
+import s, { useState as j, useEffect as K } from "react";
+import { useStableId as L } from "./index207.js";
+import { getA11yNameAttributes as q } from "./index82.js";
+import "./index73.js";
+/* empty css         */
+function h() {
+  return h = Object.assign ? Object.assign.bind() : function(l) {
+    for (var i = 1; i < arguments.length; i++) {
+      var r = arguments[i];
+      for (var e in r) ({}).hasOwnProperty.call(r, e) && (l[e] = r[e]);
     }
-  }), /* @__PURE__ */ e.createElement("div", null, a), o && /* @__PURE__ */ e.createElement(c, {
-    label: o
-  }));
+    return l;
+  }, h.apply(null, arguments);
+}
+const H = ({
+  className: l = "",
+  automationId: i = "",
+  defaultChecked: r = !1,
+  checked: e,
+  disabled: n = !1,
+  onChange: x,
+  checkMarkType: o = "",
+  label: u = "",
+  disabledLabel: g = "",
+  containerAutomationId: E = "",
+  ariaLabel: y,
+  ariaLabelledBy: C,
+  ariaDescribedBy: N,
+  ariaControls: I,
+  tabIndex: k,
+  ariaHidden: w = !1
+}) => {
+  const c = e !== void 0, [t, m] = j(c ? e : r);
+  K(() => {
+    m(c ? e : r);
+  }, [e, r]);
+  const A = (a) => {
+    n || (c || m((b) => !b), x?.(c ? !e : !t, a));
+  }, $ = (a) => {
+    if (!n && (a.key === "Enter" || a.key === " ")) {
+      a.preventDefault(), a.stopPropagation();
+      const b = c ? !e : !t;
+      c || m(b);
+      const d = a.currentTarget.closest("label")?.querySelector("input");
+      d && x?.(b, {
+        target: d,
+        currentTarget: d
+      });
+    }
+  }, D = () => n ? t && o === "tick" ? "disabled-tick" : t && o === "minus-checkbox" ? "disabled-minus-checkbox" : t && !o ? "disabled-tick" : "disabled-default" : o === "minus-checkbox" && t ? "minus-checkbox" : t ? "checked" : "unchecked", O = () => n ? "checkbox-label-disabled" : "checkbox-label", p = () => n && g ? g : u, f = L(void 0, "checkbox-input"), v = u ? `${f}-label` : void 0, S = q({
+    ariaLabelledBy: C,
+    internalLabelId: v,
+    ariaLabel: y,
+    ariaDescribedBy: N
+  }), _ = () => o === "minus-checkbox" && t ? "mixed" : t ? "true" : "false";
+  return /* @__PURE__ */ s.createElement("div", {
+    className: "se-design-checkbox-ctn",
+    "aria-hidden": w ? "true" : void 0
+  }, /* @__PURE__ */ s.createElement("label", h({
+    role: "checkbox",
+    htmlFor: f,
+    className: `se-design-checkbox ${l} ${D()}`,
+    "data-automation-id": E || "checkbox-container",
+    tabIndex: k !== void 0 ? k : n ? -1 : 0,
+    "aria-checked": _(),
+    "aria-disabled": n ? "true" : "false",
+    "aria-controls": I
+  }, S, {
+    onKeyDown: $
+  }), /* @__PURE__ */ s.createElement("input", {
+    id: f,
+    type: "checkbox",
+    checked: t,
+    onChange: A,
+    disabled: n,
+    tabIndex: -1,
+    "aria-hidden": "true"
+  }), /* @__PURE__ */ s.createElement("span", {
+    className: "checkbox-item",
+    "data-automation-id": i
+  }), p()?.length > 0 && /* @__PURE__ */ s.createElement("span", {
+    id: v,
+    className: O(),
+    "data-automation-id": i || (u ? `checkbox-label-${u}` : "checkbox-label")
+  }, p())));
 };
 export {
-  m as ColorCodedLabel
+  H as Checkbox
 };
 //# sourceMappingURL=index24.js.map

package/dist/index24.js.map

@@ -1 +1 @@
-{"version":3,"file":"index24.js","sources":["../src/components/ColorCodedLabel/index.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { Badge } from 'src/components/Badge';\n\nexport type ColorCodedLabelProps = {\n  label: string;\n  tag?: string;\n  color?: string;\n  onClick?: () => void;\n};\n\nexport const ColorCodedLabel: FC<ColorCodedLabelProps> = (props) => {\n  const { label, color, onClick = () => {}, tag } = props;\n  return (\n    <div\n      className=\"se-design-color-coded-label flex items-center gap-2\"\n      onClick={onClick}\n    >\n      {color && <span className=\"w-[15px] h-[15px] rounded-[3px] inline-block\" style={{ backgroundColor: color }}></span>}\n      <div>{label}</div>\n      {tag && <Badge label={tag} />}\n    </div>\n  );\n};\n"],"names":["React__default","Badge","ColorCodedLabel","props","label","color","onClick","tag","React","createElement","className","style","backgroundColor"],"mappings":"AAUO,OAAAA,OAAA;AAAA,SAAA,SAAAC,SAAA;AAAA,MAAMC,IAA6CC,CAAAA,MAAU;AAClE,QAAM;AAAA,IAAEC,OAAAA;AAAAA,IAAOC,OAAAA;AAAAA,IAAOC,SAAAA,IAAUA,MAAM;AAAA,IAAC;AAAA,IAAGC,KAAAA;AAAAA,EAAAA,IAAQJ;AAClD,SACEK,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IACEC,WAAU;AAAA,IACVJ,SAAAA;AAAAA,EAAAA,GAECD,KAASG,gBAAAA,EAAAC,cAAA,QAAA;AAAA,IAAMC,WAAU;AAAA,IAA+CC,OAAO;AAAA,MAAEC,iBAAiBP;AAAAA,IAAAA;AAAAA,EAAM,CAAS,GAClHG,gBAAAA,EAAAC,cAAA,OAAA,MAAML,CAAW,GAChBG,KAAOC,gBAAAA,EAAAC,cAACR,GAAK;AAAA,IAACG,OAAOG;AAAAA,EAAAA,CAAM,CACzB;AAET;"}
+{"version":3,"file":"index24.js","sources":["../src/components/Checkbox/index.tsx"],"sourcesContent":["import React, { FC, useState, useEffect } from 'react';\nimport { useStableId } from '../../utils/useStableId';\nimport { getA11yNameAttributes } from '../../utils/a11y';\nimport './style.scss';\n\nexport interface CheckboxProps {\n  className?: string;\n  automationId?: string;\n  defaultChecked?: boolean;\n  /**\n   * Controlled checked value. When provided, the checkbox is controlled by the parent\n   * and its visual state always reflects this prop. Use `onChange` to update the parent state.\n   */\n  checked?: boolean;\n  onChange?: (checked: boolean, e: React.ChangeEvent<HTMLInputElement>) => void;\n  disabled?: boolean;\n  checkMarkType?: 'tick' | 'minus-checkbox' | '';\n  label?: string;\n  disabledLabel?: string;\n  containerAutomationId?: string;\n  /**\n   * Explicit accessible name for the checkbox.\n   * Used as fallback when ariaLabelledBy is not provided and no internal label exists.\n   */\n  ariaLabel?: string;\n  /**\n   * ID(s) of element(s) that label this checkbox (for screen reader association).\n   * Typically used when checkbox is part of a larger labelled context.\n   */\n  ariaLabelledBy?: string;\n  /**\n   * ID(s) of element(s) that describe this checkbox (provides additional context).\n   * Often used for help text or instructions.\n   */\n  ariaDescribedBy?: string;\n  /**\n   * ID of the element controlled by this checkbox (e.g. an expandable region).\n   */\n  ariaControls?: string;\n  /**\n   * Override the default tabIndex. Pass -1 when the checkbox is used as a\n   * visual-only indicator inside a composite widget (e.g. listbox option).\n   */\n  tabIndex?: number;\n  /**\n   * When true, sets aria-hidden=\"true\" on the checkbox container so the\n   * checkbox role and state are hidden from assistive technology. Use when\n   * the checkbox is purely visual (e.g. inside a role=\"option\" that already\n   * conveys selection state via aria-selected).\n   */\n  ariaHidden?: boolean;\n}\n\nexport const Checkbox: FC<CheckboxProps> = ({\n  className = '',\n  automationId = '',\n  defaultChecked = false,\n  checked,\n  disabled = false,\n  onChange,\n  checkMarkType = '',\n  label = '',\n  disabledLabel = '',\n  containerAutomationId = '',\n  ariaLabel,\n  ariaLabelledBy,\n  ariaDescribedBy,\n  ariaControls,\n  tabIndex: tabIndexProp,\n  ariaHidden = false\n}) => {\n  const isControlled = checked !== undefined;\n  const [isChecked, setIsChecked] = useState(isControlled ? checked : defaultChecked);\n\n  useEffect(() => {\n    if (isControlled) {\n      setIsChecked(checked!);\n    } else {\n      setIsChecked(defaultChecked);\n    }\n  }, [checked, defaultChecked]);\n\n  const handleClick = (e: React.ChangeEvent<HTMLInputElement>) => {\n    if (disabled) return;\n    if (!isControlled) {\n      setIsChecked((prev) => !prev);\n    }\n    onChange?.(isControlled ? !checked : !isChecked, e);\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLLabelElement | HTMLSpanElement>) => {\n    if (disabled) return;\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      e.stopPropagation();\n      const newChecked = isControlled ? !checked : !isChecked;\n      if (!isControlled) {\n        setIsChecked(newChecked);\n      }\n\n      // Create a proper synthetic event for the onChange callback\n      const inputElement = e.currentTarget.closest('label')?.querySelector('input');\n      if (inputElement) {\n        const syntheticEvent = {\n          target: inputElement,\n          currentTarget: inputElement\n        } as React.ChangeEvent<HTMLInputElement>;\n        onChange?.(newChecked, syntheticEvent);\n      }\n    }\n  };\n\n  const getCheckBoxClassName = () => {\n    // Handle disabled states with proper checked status\n    if (disabled) {\n      if (isChecked && checkMarkType === 'tick') return 'disabled-tick';\n      if (isChecked && checkMarkType === 'minus-checkbox') return 'disabled-minus-checkbox';\n      if (isChecked && !checkMarkType) return 'disabled-tick'; // Default to tick for checked disabled\n      return 'disabled-default'; // Unchecked disabled\n    }\n\n    // Handle enabled states\n    if (checkMarkType === 'minus-checkbox' && isChecked) return 'minus-checkbox';\n    return isChecked ? 'checked' : 'unchecked';\n  };\n\n  const getLabelClassName = () => {\n    return disabled ? 'checkbox-label-disabled' : 'checkbox-label';\n  };\n\n  const getLabelText = () => {\n    if (disabled && disabledLabel) {\n      return disabledLabel;\n    }\n    return label;\n  };\n\n  // Generate stable IDs (persists across renders)\n  const inputId = useStableId(undefined, 'checkbox-input');\n  const labelId = label ? `${inputId}-label` : undefined;\n\n  const a11yNameAttributes = getA11yNameAttributes({\n    ariaLabelledBy,\n    internalLabelId: labelId,\n    ariaLabel,\n    ariaDescribedBy\n  });\n\n  // Determine aria-checked value: \"mixed\" for indeterminate, \"true\" for checked, \"false\" for unchecked\n  const getAriaChecked = () => {\n    if (checkMarkType === 'minus-checkbox' && isChecked) {\n      return 'mixed'; // Indeterminate/half-checked state\n    }\n    return isChecked ? 'true' : 'false';\n  };\n\n  return (\n    <div className=\"se-design-checkbox-ctn\" aria-hidden={ariaHidden ? 'true' : undefined}>\n      <label\n        role=\"checkbox\"\n        htmlFor={inputId}\n        className={`se-design-checkbox ${className} ${getCheckBoxClassName()}`}\n        data-automation-id={containerAutomationId || 'checkbox-container'}\n        tabIndex={tabIndexProp !== undefined ? tabIndexProp : disabled ? -1 : 0}\n        aria-checked={getAriaChecked()}\n        aria-disabled={disabled ? 'true' : 'false'}\n        aria-controls={ariaControls}\n        {...a11yNameAttributes}\n        onKeyDown={handleKeyDown}\n      >\n        <input\n          id={inputId}\n          type=\"checkbox\"\n          checked={isChecked}\n          onChange={handleClick}\n          disabled={disabled}\n          tabIndex={-1}\n          aria-hidden=\"true\"\n        />\n        <span className=\"checkbox-item\" data-automation-id={automationId}></span>\n        {getLabelText()?.length > 0 && (\n          <span\n            id={labelId}\n            className={getLabelClassName()}\n            data-automation-id={automationId || (label ? `checkbox-label-${label}` : 'checkbox-label')}\n          >\n            {getLabelText()}\n          </span>\n        )}\n      </label>\n    </div>\n  );\n};\n"],"names":["Checkbox","className","automationId","defaultChecked","checked","disabled","onChange","checkMarkType","label","disabledLabel","containerAutomationId","ariaLabel","ariaLabelledBy","ariaDescribedBy","ariaControls","tabIndex","tabIndexProp","ariaHidden","isControlled","undefined","isChecked","setIsChecked","useState","useEffect","handleClick","e","prev","handleKeyDown","key","preventDefault","stopPropagation","newChecked","inputElement","currentTarget","closest","querySelector","target","getCheckBoxClassName","getLabelClassName","getLabelText","inputId","useStableId","labelId","a11yNameAttributes","getA11yNameAttributes","internalLabelId","getAriaChecked","React","createElement","_extends","role","htmlFor","onKeyDown","id","type","length"],"mappings":"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"}