@plumile/ui 0.1.55 → 0.1.56

package/lib/esm/atomic/molecules/dropdown/Dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.js","sources":["../../../../../src/atomic/molecules/dropdown/Dropdown.tsx"],"sourcesContent":["import {\n  useState,\n  useRef,\n  useEffect,\n  useLayoutEffect,\n  useCallback,\n  type ReactNode,\n  type ReactElement,\n  type JSX,\n  type Ref,\n  type MutableRefObject,\n  type HTMLAttributes,\n  type MouseEvent as ReactMouseEvent,\n  type KeyboardEvent as ReactKeyboardEvent,\n  createContext,\n  useContext,\n  isValidElement,\n  cloneElement,\n} from 'react';\nimport { createPortal } from 'react-dom';\n\nimport * as classes from './dropdown.css.js';\nimport { cx } from '../../../theme/tools.js';\n\n// Types\nexport type DropdownPlacement =\n  | 'bottom-start'\n  | 'bottom-end'\n  | 'top-start'\n  | 'top-end';\n\ninterface DropdownContextValue {\n  close: () => void;\n  open: () => void;\n  isOpen: boolean;\n}\n\nconst DropdownContext = createContext<DropdownContextValue | null>(null);\n/**\n * Access the nearest Dropdown context. Throws if used outside a <Dropdown />.\n */\nexport const useDropdown = (): DropdownContextValue => {\n  const ctx = useContext(DropdownContext);\n  if (ctx == null) {\n    throw new Error('useDropdown must be used within a <Dropdown />');\n  }\n  return ctx;\n};\n\nexport interface DropdownProps {\n  trigger: ReactElement | ((isOpen: boolean) => ReactElement);\n  children: ReactNode;\n  className?: string;\n  contentClassName?: string;\n  placement?: DropdownPlacement;\n  offset?: number;\n  matchTriggerWidth?: boolean;\n  open?: boolean; // controlled\n  defaultOpen?: boolean; // uncontrolled\n  onOpenChange?: (open: boolean) => void;\n  closeOnItemClick?: boolean;\n  portalContainer?: HTMLElement | null;\n  // Accessible label if trigger is an icon only\n  ariaLabel?: string;\n}\n\ninterface PositionState {\n  top: number;\n  left: number;\n  width?: number;\n}\n\nconst isForwardRefComponent = (type: unknown): boolean => {\n  if (type == null || typeof type !== 'object') {\n    return false;\n  }\n  return (\n    (type as { $$typeof?: symbol }).$$typeof === Symbol.for('react.forward_ref')\n  );\n};\n\n/**\n * A scalable, portal-based dropdown component with basic collision handling,\n * controlled/uncontrolled modes, accessibility attributes, and optional\n * trigger width matching. Content is rendered in a React portal (default: document.body).\n */\nexport const Dropdown = ({\n  trigger,\n  children,\n  className,\n  contentClassName,\n  placement = 'bottom-start',\n  offset = 4,\n  matchTriggerWidth = true,\n  open,\n  defaultOpen = false,\n  onOpenChange,\n  closeOnItemClick = false,\n  portalContainer,\n  ariaLabel,\n}: DropdownProps): JSX.Element => {\n  const isControlled = open != null;\n  const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);\n  let isOpen = uncontrolledOpen;\n  if (isControlled) {\n    isOpen = Boolean(open);\n  }\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useRef<HTMLElement>(null);\n  const contentRef = useRef<HTMLDivElement>(null);\n  const [position, setPosition] = useState<PositionState | null>(null);\n  // Accumulate manual cleanups for effects where returning a function violates lint rules.\n  const cleanupRef = useRef<(() => void)[]>([]);\n\n  const setOpen = useCallback(\n    (next: boolean) => {\n      if (!isControlled) {\n        setUncontrolledOpen(next);\n      }\n      onOpenChange?.(next);\n    },\n    [isControlled, onOpenChange],\n  );\n\n  const toggle = useCallback(() => {\n    setOpen(!isOpen);\n  }, [isOpen, setOpen]);\n  const close = useCallback(() => {\n    setOpen(false);\n  }, [setOpen]);\n  const openFn = useCallback(() => {\n    setOpen(true);\n  }, [setOpen]);\n\n  // Positioning logic\n  const computePosition = useCallback(() => {\n    const triggerEl = triggerRef.current;\n    const contentEl = contentRef.current;\n    if (triggerEl == null) {\n      return;\n    }\n    if (contentEl == null) {\n      return;\n    }\n\n    const rect = triggerEl.getBoundingClientRect();\n    let top = 0;\n    let left = 0;\n\n    switch (placement) {\n      case 'bottom-start':\n        top = rect.bottom + offset;\n        left = rect.left;\n        break;\n      case 'bottom-end':\n        top = rect.bottom + offset;\n        left = rect.right - contentEl.offsetWidth;\n        break;\n      case 'top-start':\n        top = rect.top - contentEl.offsetHeight - offset;\n        left = rect.left;\n        break;\n      case 'top-end':\n        top = rect.top - contentEl.offsetHeight - offset;\n        left = rect.right - contentEl.offsetWidth;\n        break;\n      default:\n        top = rect.bottom + offset;\n        left = rect.left;\n    }\n\n    // Keep within viewport (basic collision handling)\n    const vw = window.innerWidth;\n    const vh = window.innerHeight;\n    let width: number | undefined;\n    if (matchTriggerWidth) {\n      width = rect.width;\n    }\n    const contentWidth = width ?? contentEl.offsetWidth;\n\n    if (left + contentWidth > vw - 4) {\n      left = Math.max(4, vw - contentWidth - 4);\n    }\n    if (left < 4) left = 4;\n    const contentHeight = contentEl.offsetHeight;\n    if (top + contentHeight > vh - 4) {\n      // Try flip to top if bottom overflows and initial was bottom\n      if (placement.startsWith('bottom')) {\n        const flippedTop = rect.top - contentHeight - offset;\n        if (flippedTop >= 4) {\n          top = flippedTop;\n        } else {\n          top = Math.max(4, vh - contentHeight - 4);\n        }\n      } else {\n        top = Math.max(4, vh - contentHeight - 4);\n      }\n    }\n    if (top < 4) top = 4;\n\n    setPosition({ top, left, width });\n  }, [placement, offset, matchTriggerWidth]);\n\n  useLayoutEffect(() => {\n    if (isOpen) computePosition();\n  }, [isOpen, computePosition, children]);\n\n  useEffect(() => {\n    if (!isOpen) return;\n    const handle = () => {\n      computePosition();\n    };\n    window.addEventListener('resize', handle);\n    window.addEventListener('scroll', handle, true);\n    const cleanup = () => {\n      window.removeEventListener('resize', handle);\n      window.removeEventListener('scroll', handle, true);\n    };\n    cleanupRef.current.push(cleanup);\n  }, [isOpen, computePosition]);\n\n  // Outside click & Escape\n  useEffect(() => {\n    if (!isOpen) return;\n    const onDocMouseDown = (e: globalThis.MouseEvent) => {\n      const target = e.target as Node;\n      if (\n        containerRef.current != null &&\n        contentRef.current != null &&\n        !containerRef.current.contains(target) &&\n        !contentRef.current.contains(target)\n      ) {\n        close();\n      }\n    };\n    const onKey = (e: globalThis.KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        close();\n        triggerRef.current?.focus();\n      }\n    };\n    document.addEventListener('mousedown', onDocMouseDown);\n    document.addEventListener('keydown', onKey);\n    const cleanup = () => {\n      document.removeEventListener('mousedown', onDocMouseDown);\n      document.removeEventListener('keydown', onKey);\n    };\n    cleanupRef.current.push(cleanup);\n  }, [isOpen, close]);\n\n  // Keyboard navigation basic (ArrowDown focuses first focusable)\n  useEffect(() => {\n    if (!isOpen) return;\n    const firstFocusable = contentRef.current?.querySelector<HTMLElement>(\n      'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])',\n    );\n    firstFocusable?.focus();\n  }, [isOpen]);\n\n  // Close on item click if enabled\n  useEffect(() => {\n    if (!isOpen || !closeOnItemClick) return;\n    const handler = (e: globalThis.MouseEvent) => {\n      if (contentRef.current?.contains(e.target as Node)) {\n        close();\n      }\n    };\n    document.addEventListener('click', handler, { capture: true });\n    // Explicit cleanup without returning (lint rule forbids returning arrow fn)\n    const cleanup = () => {\n      document.removeEventListener('click', handler, { capture: true });\n    };\n    // Store in ref to run on unmount / dependency change\n    cleanupRef.current.push(cleanup);\n  }, [isOpen, closeOnItemClick, close]);\n  // Run accumulated cleanups on unmount\n  useEffect(() => {\n    return () => {\n      cleanupRef.current.forEach((fn) => {\n        fn();\n      });\n      cleanupRef.current = [];\n    };\n  }, []);\n\n  let triggerElement = trigger;\n  if (typeof trigger === 'function') {\n    triggerElement = trigger(isOpen);\n  }\n\n  if (!isValidElement(triggerElement)) {\n    throw new Error('Dropdown trigger must be a React element.');\n  }\n\n  const isHostElement = typeof triggerElement.type === 'string';\n  const isButtonElement = isHostElement && triggerElement.type === 'button';\n  const canAttachRef =\n    isHostElement ||\n    typeof triggerElement.type === 'function' ||\n    isForwardRefComponent(triggerElement.type);\n\n  if (!canAttachRef) {\n    throw new Error(\n      'Dropdown trigger must be a DOM element or component that accepts a ref.',\n    );\n  }\n\n  const triggerElementRef =\n    (triggerElement.props as { ref?: Ref<HTMLElement> }).ref ??\n    (triggerElement as ReactElement & { ref?: Ref<HTMLElement> }).ref;\n  const setTriggerRef = (node: HTMLElement | null) => {\n    triggerRef.current = node;\n    if (typeof triggerElementRef === 'function') {\n      triggerElementRef(node);\n    } else if (triggerElementRef != null) {\n      (triggerElementRef as MutableRefObject<HTMLElement | null>).current =\n        node;\n    }\n  };\n\n  const triggerProps = triggerElement.props as HTMLAttributes<HTMLElement> & {\n    type?: string;\n  };\n\n  const handleTriggerClick = (event: ReactMouseEvent<HTMLElement>) => {\n    triggerProps.onClick?.(event);\n    if (event.defaultPrevented) {\n      return;\n    }\n    toggle();\n  };\n\n  const handleTriggerKeyDown = (event: ReactKeyboardEvent<HTMLElement>) => {\n    triggerProps.onKeyDown?.(event);\n    if (event.defaultPrevented) {\n      return;\n    }\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      toggle();\n    }\n  };\n\n  const mergedTriggerProps: Record<string, unknown> = {\n    onClick: handleTriggerClick,\n    'aria-haspopup': 'menu',\n    'aria-expanded': isOpen,\n  };\n\n  if (ariaLabel != null && ariaLabel !== '') {\n    mergedTriggerProps['aria-label'] = ariaLabel;\n  }\n\n  if (isButtonElement) {\n    if (triggerProps.type == null) {\n      mergedTriggerProps.type = 'button';\n    }\n  } else {\n    mergedTriggerProps.onKeyDown = handleTriggerKeyDown;\n    if (triggerProps.role == null) {\n      mergedTriggerProps.role = 'button';\n    }\n    if (triggerProps.tabIndex == null) {\n      mergedTriggerProps.tabIndex = 0;\n    }\n  }\n\n  mergedTriggerProps.ref = setTriggerRef;\n\n  let contentStyles: React.CSSProperties = {};\n  if (position != null) {\n    contentStyles = {\n      top: position.top,\n      left: position.left,\n      width: position.width,\n    };\n  }\n\n  const portalTarget = portalContainer ?? document.body;\n\n  const contextValue: DropdownContextValue = {\n    close,\n    open: openFn,\n    isOpen,\n  };\n\n  let dropdownContent: JSX.Element | null = null;\n  if (isOpen) {\n    dropdownContent = createPortal(\n      <div\n        ref={contentRef}\n        role=\"menu\"\n        className={cx(\n          classes.content,\n          classes.contentPositioned,\n          contentClassName,\n        )}\n        style={contentStyles}\n      >\n        {children}\n      </div>,\n      portalTarget,\n    );\n  }\n\n  return (\n    <DropdownContext.Provider value={contextValue}>\n      <div className={cx(classes.container, className)} ref={containerRef}>\n        {cloneElement(triggerElement, mergedTriggerProps)}\n      </div>\n      {dropdownContent}\n    </DropdownContext.Provider>\n  );\n};\n"],"names":["DropdownContext","createContext","useDropdown","ctx","useContext","isForwardRefComponent","type","Dropdown","trigger","children","className","contentClassName","placement","offset","matchTriggerWidth","open","defaultOpen","onOpenChange","closeOnItemClick","portalContainer","ariaLabel","isControlled","uncontrolledOpen","setUncontrolledOpen","useState","isOpen","containerRef","useRef","triggerRef","contentRef","position","setPosition","cleanupRef","setOpen","useCallback","next","toggle","close","openFn","computePosition","triggerEl","contentEl","rect","top","left","vw","vh","width","contentWidth","contentHeight","flippedTop","useLayoutEffect","useEffect","handle","cleanup","onDocMouseDown","e","target","onKey","handler","fn","triggerElement","isValidElement","isHostElement","isButtonElement","triggerElementRef","setTriggerRef","node","triggerProps","handleTriggerClick","event","handleTriggerKeyDown","mergedTriggerProps","contentStyles","portalTarget","contextValue","dropdownContent","createPortal","jsx","cx","classes.content","classes.contentPositioned","jsxs","classes.container","cloneElement"],"mappings":";;;;;AAqCA,MAAMA,IAAkBC,GAA2C,IAAI,GAI1DC,KAAc,MAA4B;AACrD,QAAMC,IAAMC,GAAWJ,CAAe;AACtC,MAAIG,KAAO;AACT,UAAM,IAAI,MAAM,gDAAgD;AAElE,SAAOA;AACT,GAyBME,KAAwB,CAACC,MACzBA,KAAQ,QAAQ,OAAOA,KAAS,WAC3B,KAGNA,EAA+B,aAAa,OAAO,IAAI,mBAAmB,GASlEC,KAAW,CAAC;AAAA,EACvB,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,QAAAC,IAAS;AAAA,EACT,mBAAAC,IAAoB;AAAA,EACpB,MAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,cAAAC;AAAA,EACA,kBAAAC,IAAmB;AAAA,EACnB,iBAAAC;AAAA,EACA,WAAAC;AACF,MAAkC;AAChC,QAAMC,IAAeN,KAAQ,MACvB,CAACO,GAAkBC,CAAmB,IAAIC,EAASR,CAAW;AACpE,MAAIS,IAASH;AACb,EAAID,MACFI,IAAS,EAAQV;AAGnB,QAAMW,IAAeC,EAAuB,IAAI,GAC1CC,IAAaD,EAAoB,IAAI,GACrCE,IAAaF,EAAuB,IAAI,GACxC,CAACG,GAAUC,CAAW,IAAIP,EAA+B,IAAI,GAE7DQ,IAAaL,EAAuB,EAAE,GAEtCM,IAAUC;AAAA,IACd,CAACC,MAAkB;AACjB,MAAKd,KACHE,EAAoBY,CAAI,GAE1BlB,IAAekB,CAAI;AAAA,IACrB;AAAA,IACA,CAACd,GAAcJ,CAAY;AAAA,EAAA,GAGvBmB,IAASF,EAAY,MAAM;AAC/B,IAAAD,EAAQ,CAACR,CAAM;AAAA,EACjB,GAAG,CAACA,GAAQQ,CAAO,CAAC,GACdI,IAAQH,EAAY,MAAM;AAC9B,IAAAD,EAAQ,EAAK;AAAA,EACf,GAAG,CAACA,CAAO,CAAC,GACNK,IAASJ,EAAY,MAAM;AAC/B,IAAAD,EAAQ,EAAI;AAAA,EACd,GAAG,CAACA,CAAO,CAAC,GAGNM,IAAkBL,EAAY,MAAM;AACxC,UAAMM,IAAYZ,EAAW,SACvBa,IAAYZ,EAAW;AAI7B,QAHIW,KAAa,QAGbC,KAAa;AACf;AAGF,UAAMC,IAAOF,EAAU,sBAAA;AACvB,QAAIG,IAAM,GACNC,IAAO;AAEX,YAAQhC,GAAA;AAAA,MACN,KAAK;AACH,QAAA+B,IAAMD,EAAK,SAAS7B,GACpB+B,IAAOF,EAAK;AACZ;AAAA,MACF,KAAK;AACH,QAAAC,IAAMD,EAAK,SAAS7B,GACpB+B,IAAOF,EAAK,QAAQD,EAAU;AAC9B;AAAA,MACF,KAAK;AACH,QAAAE,IAAMD,EAAK,MAAMD,EAAU,eAAe5B,GAC1C+B,IAAOF,EAAK;AACZ;AAAA,MACF,KAAK;AACH,QAAAC,IAAMD,EAAK,MAAMD,EAAU,eAAe5B,GAC1C+B,IAAOF,EAAK,QAAQD,EAAU;AAC9B;AAAA,MACF;AACE,QAAAE,IAAMD,EAAK,SAAS7B,GACpB+B,IAAOF,EAAK;AAAA,IAAA;AAIhB,UAAMG,IAAK,OAAO,YACZC,IAAK,OAAO;AAClB,QAAIC;AACJ,IAAIjC,MACFiC,IAAQL,EAAK;AAEf,UAAMM,IAAeD,KAASN,EAAU;AAExC,IAAIG,IAAOI,IAAeH,IAAK,MAC7BD,IAAO,KAAK,IAAI,GAAGC,IAAKG,IAAe,CAAC,IAEtCJ,IAAO,MAAGA,IAAO;AACrB,UAAMK,IAAgBR,EAAU;AAChC,QAAIE,IAAMM,IAAgBH,IAAK;AAE7B,UAAIlC,EAAU,WAAW,QAAQ,GAAG;AAClC,cAAMsC,IAAaR,EAAK,MAAMO,IAAgBpC;AAC9C,QAAIqC,KAAc,IAChBP,IAAMO,IAENP,IAAM,KAAK,IAAI,GAAGG,IAAKG,IAAgB,CAAC;AAAA,MAE5C;AACE,QAAAN,IAAM,KAAK,IAAI,GAAGG,IAAKG,IAAgB,CAAC;AAG5C,IAAIN,IAAM,MAAGA,IAAM,IAEnBZ,EAAY,EAAE,KAAAY,GAAK,MAAAC,GAAM,OAAAG,EAAA,CAAO;AAAA,EAClC,GAAG,CAACnC,GAAWC,GAAQC,CAAiB,CAAC;AAEzC,EAAAqC,GAAgB,MAAM;AACpB,IAAI1B,KAAQc,EAAA;AAAA,EACd,GAAG,CAACd,GAAQc,GAAiB9B,CAAQ,CAAC,GAEtC2C,EAAU,MAAM;AACd,QAAI,CAAC3B,EAAQ;AACb,UAAM4B,IAAS,MAAM;AACnB,MAAAd,EAAA;AAAA,IACF;AACA,WAAO,iBAAiB,UAAUc,CAAM,GACxC,OAAO,iBAAiB,UAAUA,GAAQ,EAAI;AAC9C,UAAMC,IAAU,MAAM;AACpB,aAAO,oBAAoB,UAAUD,CAAM,GAC3C,OAAO,oBAAoB,UAAUA,GAAQ,EAAI;AAAA,IACnD;AACA,IAAArB,EAAW,QAAQ,KAAKsB,CAAO;AAAA,EACjC,GAAG,CAAC7B,GAAQc,CAAe,CAAC,GAG5Ba,EAAU,MAAM;AACd,QAAI,CAAC3B,EAAQ;AACb,UAAM8B,IAAiB,CAACC,MAA6B;AACnD,YAAMC,IAASD,EAAE;AACjB,MACE9B,EAAa,WAAW,QACxBG,EAAW,WAAW,QACtB,CAACH,EAAa,QAAQ,SAAS+B,CAAM,KACrC,CAAC5B,EAAW,QAAQ,SAAS4B,CAAM,KAEnCpB,EAAA;AAAA,IAEJ,GACMqB,IAAQ,CAACF,MAAgC;AAC7C,MAAIA,EAAE,QAAQ,aACZnB,EAAA,GACAT,EAAW,SAAS,MAAA;AAAA,IAExB;AACA,aAAS,iBAAiB,aAAa2B,CAAc,GACrD,SAAS,iBAAiB,WAAWG,CAAK;AAC1C,UAAMJ,IAAU,MAAM;AACpB,eAAS,oBAAoB,aAAaC,CAAc,GACxD,SAAS,oBAAoB,WAAWG,CAAK;AAAA,IAC/C;AACA,IAAA1B,EAAW,QAAQ,KAAKsB,CAAO;AAAA,EACjC,GAAG,CAAC7B,GAAQY,CAAK,CAAC,GAGlBe,EAAU,MAAM;AACd,QAAI,CAAC3B,EAAQ;AAIb,IAHuBI,EAAW,SAAS;AAAA,MACzC;AAAA,IAAA,GAEc,MAAA;AAAA,EAClB,GAAG,CAACJ,CAAM,CAAC,GAGX2B,EAAU,MAAM;AACd,QAAI,CAAC3B,KAAU,CAACP,EAAkB;AAClC,UAAMyC,IAAU,CAACH,MAA6B;AAC5C,MAAI3B,EAAW,SAAS,SAAS2B,EAAE,MAAc,KAC/CnB,EAAA;AAAA,IAEJ;AACA,aAAS,iBAAiB,SAASsB,GAAS,EAAE,SAAS,IAAM;AAE7D,UAAML,IAAU,MAAM;AACpB,eAAS,oBAAoB,SAASK,GAAS,EAAE,SAAS,IAAM;AAAA,IAClE;AAEA,IAAA3B,EAAW,QAAQ,KAAKsB,CAAO;AAAA,EACjC,GAAG,CAAC7B,GAAQP,GAAkBmB,CAAK,CAAC,GAEpCe,EAAU,MACD,MAAM;AACX,IAAApB,EAAW,QAAQ,QAAQ,CAAC4B,MAAO;AACjC,MAAAA,EAAA;AAAA,IACF,CAAC,GACD5B,EAAW,UAAU,CAAA;AAAA,EACvB,GACC,CAAA,CAAE;AAEL,MAAI6B,IAAiBrD;AAKrB,MAJI,OAAOA,KAAY,eACrBqD,IAAiBrD,EAAQiB,CAAM,IAG7B,CAACqC,GAAeD,CAAc;AAChC,UAAM,IAAI,MAAM,2CAA2C;AAG7D,QAAME,IAAgB,OAAOF,EAAe,QAAS,UAC/CG,IAAkBD,KAAiBF,EAAe,SAAS;AAMjE,MAAI,EAJFE,KACA,OAAOF,EAAe,QAAS,cAC/BxD,GAAsBwD,EAAe,IAAI;AAGzC,UAAM,IAAI;AAAA,MACR;AAAA,IAAA;AAIJ,QAAMI,IACHJ,EAAe,MAAqC,OACpDA,EAA6D,KAC1DK,KAAgB,CAACC,MAA6B;AAClD,IAAAvC,EAAW,UAAUuC,GACjB,OAAOF,KAAsB,aAC/BA,EAAkBE,CAAI,IACbF,KAAqB,SAC7BA,EAA2D,UAC1DE;AAAA,EAEN,GAEMC,IAAeP,EAAe,OAI9BQ,KAAqB,CAACC,MAAwC;AAElE,IADAF,EAAa,UAAUE,CAAK,GACxB,CAAAA,EAAM,oBAGVlC,EAAA;AAAA,EACF,GAEMmC,KAAuB,CAACD,MAA2C;AAEvE,IADAF,EAAa,YAAYE,CAAK,GAC1B,CAAAA,EAAM,qBAGNA,EAAM,QAAQ,WAAWA,EAAM,QAAQ,SACzCA,EAAM,eAAA,GACNlC,EAAA;AAAA,EAEJ,GAEMoC,IAA8C;AAAA,IAClD,SAASH;AAAA,IACT,iBAAiB;AAAA,IACjB,iBAAiB5C;AAAA,EAAA;AAGnB,EAAIL,KAAa,QAAQA,MAAc,OACrCoD,EAAmB,YAAY,IAAIpD,IAGjC4C,IACEI,EAAa,QAAQ,SACvBI,EAAmB,OAAO,aAG5BA,EAAmB,YAAYD,IAC3BH,EAAa,QAAQ,SACvBI,EAAmB,OAAO,WAExBJ,EAAa,YAAY,SAC3BI,EAAmB,WAAW,KAIlCA,EAAmB,MAAMN;AAEzB,MAAIO,IAAqC,CAAA;AACzC,EAAI3C,KAAY,SACd2C,IAAgB;AAAA,IACd,KAAK3C,EAAS;AAAA,IACd,MAAMA,EAAS;AAAA,IACf,OAAOA,EAAS;AAAA,EAAA;AAIpB,QAAM4C,KAAevD,KAAmB,SAAS,MAE3CwD,KAAqC;AAAA,IACzC,OAAAtC;AAAA,IACA,MAAMC;AAAA,IACN,QAAAb;AAAA,EAAA;AAGF,MAAImD,IAAsC;AAC1C,SAAInD,MACFmD,IAAkBC;AAAA,IAChB,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAKjD;AAAA,QACL,MAAK;AAAA,QACL,WAAWkD;AAAA,UACTC;AAAAA,UACAC;AAAAA,UACAtE;AAAA,QAAA;AAAA,QAEF,OAAO8D;AAAA,QAEN,UAAAhE;AAAA,MAAA;AAAA,IAAA;AAAA,IAEHiE;AAAA,EAAA,IAKF,gBAAAQ,GAAClF,EAAgB,UAAhB,EAAyB,OAAO2E,IAC/B,UAAA;AAAA,IAAA,gBAAAG,EAAC,OAAA,EAAI,WAAWC,EAAGI,IAAmBzE,CAAS,GAAG,KAAKgB,GACpD,UAAA0D,GAAavB,GAAgBW,CAAkB,EAAA,CAClD;AAAA,IACCI;AAAA,EAAA,GACH;AAEJ;"}

package/lib/esm/atomic/molecules/dropdown/dropdown.css.js

@@ -0,0 +1,13 @@
+/* empty css                                          */
+/* empty css                            */
+var r = "mr2gir0 txvbqbpsf", v = "mr2gir1 txvbqbuzn txvbqb1rx txvbqbuvx txvbqbl6f", x = "mr2gir2 txvbqbpso txvbqbt6x txvbqbdpf", i = "mr2gir3 txvbqb9hx", q = "mr2gir4 txvbqbl3f", e = "mr2gir5 txvbqbfax txvbqbfbo txvbqbl9f", m = "mr2gir6 txvbqbv";
+export {
+  r as container,
+  v as content,
+  x as contentPositioned,
+  q as focusOutlineReset,
+  i as hidden,
+  e as menu,
+  m as menuItem
+};
+//# sourceMappingURL=dropdown.css.js.map

package/lib/esm/atomic/molecules/dropdown/dropdown.css.js.map

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

package/lib/esm/atomic/molecules/form-actions/FormActions.js

@@ -0,0 +1,57 @@
+import { jsxs as k, jsx as t } from "react/jsx-runtime";
+import { Button as l } from "../../atoms/button/Button.js";
+import { useUiTranslation as A } from "../../../i18n/useUiTranslation.js";
+const T = ({
+  onCancel: n,
+  cancelLabel: c,
+  submitLabel: i,
+  submitLoadingLabel: r,
+  isSubmitting: e = !1,
+  submitDisabled: m = !1,
+  className: d,
+  renderSubmitContent: o,
+  submitButtonProps: b,
+  cancelButtonProps: u
+}) => {
+  const { t: a } = A(), p = c ?? a("common.actions.cancel"), v = i ?? a("common.actions.save"), f = r ?? a("common.actions.saving"), C = u ?? {}, {
+    className: N,
+    disabled: B,
+    ...x
+  } = C, D = b ?? {}, {
+    className: L,
+    disabled: P,
+    ...h
+  } = D;
+  let s;
+  o != null ? s = o(e) : e ? s = f : s = v;
+  const y = !!B, j = !!m || e || P === !0;
+  return /* @__PURE__ */ k("div", { className: d, children: [
+    /* @__PURE__ */ t(
+      l,
+      {
+        type: "button",
+        variant: "text",
+        onClick: n,
+        disabled: y,
+        className: N,
+        ...x,
+        children: p
+      }
+    ),
+    /* @__PURE__ */ t(
+      l,
+      {
+        type: "submit",
+        variant: "primary",
+        disabled: j,
+        className: L,
+        ...h,
+        children: s
+      }
+    )
+  ] });
+};
+export {
+  T as FormActions
+};
+//# sourceMappingURL=FormActions.js.map

package/lib/esm/atomic/molecules/form-actions/FormActions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormActions.js","sources":["../../../../../src/atomic/molecules/form-actions/FormActions.tsx"],"sourcesContent":["import { type ComponentProps, type JSX, type ReactNode } from 'react';\n\nimport { Button } from '../../atoms/button/Button.js';\nimport { useUiTranslation } from '../../../i18n/useUiTranslation.js';\n\nexport type FormActionsProps = {\n  onCancel: () => void;\n  cancelLabel?: string;\n  submitLabel?: string;\n  submitLoadingLabel?: string;\n  isSubmitting?: boolean;\n  submitDisabled?: boolean;\n  className?: string;\n  renderSubmitContent?: (isSubmitting: boolean) => ReactNode;\n  submitButtonProps?: Omit<ComponentProps<typeof Button>, 'children' | 'type'>;\n  cancelButtonProps?: Omit<\n    ComponentProps<typeof Button>,\n    'children' | 'type' | 'variant'\n  >;\n};\n\nexport const FormActions = ({\n  onCancel,\n  cancelLabel,\n  submitLabel,\n  submitLoadingLabel,\n  isSubmitting = false,\n  submitDisabled = false,\n  className,\n  renderSubmitContent,\n  submitButtonProps,\n  cancelButtonProps,\n}: FormActionsProps): JSX.Element => {\n  const { t } = useUiTranslation();\n  const resolvedCancelLabel = cancelLabel ?? t('common.actions.cancel');\n  const resolvedSubmitLabel = submitLabel ?? t('common.actions.save');\n  const resolvedSubmitLoadingLabel =\n    submitLoadingLabel ?? t('common.actions.saving');\n  const cancelProps = cancelButtonProps ?? {};\n  const {\n    className: cancelClassName,\n    disabled: cancelDisabled,\n    ...restCancelButtonProps\n  } = cancelProps;\n\n  const submitProps = submitButtonProps ?? {};\n  const {\n    className: submitClassName,\n    disabled: submitDisabledOverride,\n    ...restSubmitButtonProps\n  } = submitProps;\n\n  let submitContent: ReactNode;\n\n  if (renderSubmitContent != null) {\n    submitContent = renderSubmitContent(isSubmitting);\n  } else if (isSubmitting) {\n    submitContent = resolvedSubmitLoadingLabel;\n  } else {\n    submitContent = resolvedSubmitLabel;\n  }\n\n  const isCancelDisabled = Boolean(cancelDisabled);\n  const isSubmitDisabled =\n    Boolean(submitDisabled) || isSubmitting || submitDisabledOverride === true;\n\n  return (\n    <div className={className}>\n      <Button\n        type=\"button\"\n        variant=\"text\"\n        onClick={onCancel}\n        disabled={isCancelDisabled}\n        className={cancelClassName}\n        {...restCancelButtonProps}\n      >\n        {resolvedCancelLabel}\n      </Button>\n      <Button\n        type=\"submit\"\n        variant=\"primary\"\n        disabled={isSubmitDisabled}\n        className={submitClassName}\n        {...restSubmitButtonProps}\n      >\n        {submitContent}\n      </Button>\n    </div>\n  );\n};\n"],"names":["FormActions","onCancel","cancelLabel","submitLabel","submitLoadingLabel","isSubmitting","submitDisabled","className","renderSubmitContent","submitButtonProps","cancelButtonProps","t","useUiTranslation","resolvedCancelLabel","resolvedSubmitLabel","resolvedSubmitLoadingLabel","cancelProps","cancelClassName","cancelDisabled","restCancelButtonProps","submitProps","submitClassName","submitDisabledOverride","restSubmitButtonProps","submitContent","isCancelDisabled","isSubmitDisabled","jsxs","jsx","Button"],"mappings":";;;AAqBO,MAAMA,IAAc,CAAC;AAAA,EAC1B,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,gBAAAC,IAAiB;AAAA,EACjB,WAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,mBAAAC;AACF,MAAqC;AACnC,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAA,GACRC,IAAsBX,KAAeS,EAAE,uBAAuB,GAC9DG,IAAsBX,KAAeQ,EAAE,qBAAqB,GAC5DI,IACJX,KAAsBO,EAAE,uBAAuB,GAC3CK,IAAcN,KAAqB,CAAA,GACnC;AAAA,IACJ,WAAWO;AAAA,IACX,UAAUC;AAAA,IACV,GAAGC;AAAA,EAAA,IACDH,GAEEI,IAAcX,KAAqB,CAAA,GACnC;AAAA,IACJ,WAAWY;AAAA,IACX,UAAUC;AAAA,IACV,GAAGC;AAAA,EAAA,IACDH;AAEJ,MAAII;AAEJ,EAAIhB,KAAuB,OACzBgB,IAAgBhB,EAAoBH,CAAY,IACvCA,IACTmB,IAAgBT,IAEhBS,IAAgBV;AAGlB,QAAMW,IAAmB,EAAQP,GAC3BQ,IACJ,EAAQpB,KAAmBD,KAAgBiB,MAA2B;AAExE,SACE,gBAAAK,EAAC,SAAI,WAAApB,GACH,UAAA;AAAA,IAAA,gBAAAqB;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAQ;AAAA,QACR,SAAS5B;AAAA,QACT,UAAUwB;AAAA,QACV,WAAWR;AAAA,QACV,GAAGE;AAAA,QAEH,UAAAN;AAAA,MAAA;AAAA,IAAA;AAAA,IAEH,gBAAAe;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAQ;AAAA,QACR,UAAUH;AAAA,QACV,WAAWL;AAAA,QACV,GAAGE;AAAA,QAEH,UAAAC;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,GACF;AAEJ;"}

package/lib/esm/atomic/molecules/toast/ToastProvider.js

@@ -0,0 +1,78 @@
+import { jsxs as E, jsx as x } from "react/jsx-runtime";
+import { createContext as k, useState as C, useRef as T, useCallback as l, useEffect as h, useMemo as S, useContext as b } from "react";
+import { ToastViewport as M } from "./ToastViewport.js";
+import { INFO_TOAST_DURATION_MS as O } from "./constants.js";
+const p = k(null), a = (o, s) => (c, u) => o.push({ kind: s, title: c, message: u }), D = ({
+  children: o,
+  maxToasts: s = 4
+}) => {
+  const [c, u] = C([]), w = T(0), t = T(
+    /* @__PURE__ */ new Map()
+  ), f = l((r) => {
+    const e = t.current.get(r);
+    e != null && (clearTimeout(e), t.current.delete(r)), u((n) => n.filter((i) => i.id !== r));
+  }, []), d = l(() => {
+    t.current.forEach((r) => {
+      clearTimeout(r);
+    }), t.current.clear(), u([]);
+  }, []), m = l(
+    (r) => {
+      const e = r.id ?? `toast-${w.current++}`;
+      return u((n) => {
+        const i = [...n, { ...r, kind: r.kind ?? "info", id: e }];
+        return i.length > s ? i.slice(i.length - s) : i;
+      }), e;
+    },
+    [s]
+  );
+  h(() => {
+    const r = /* @__PURE__ */ new Set();
+    c.forEach((e) => {
+      if (e.kind !== "info" || (r.add(e.id), t.current.has(e.id)))
+        return;
+      const n = setTimeout(() => {
+        t.current.delete(e.id), u((i) => i.filter((v) => v.id !== e.id));
+      }, O);
+      t.current.set(e.id, n);
+    }), t.current.forEach((e, n) => {
+      r.has(n) || (clearTimeout(e), t.current.delete(n));
+    });
+  }, [c]), h(() => {
+    const r = t.current;
+    return () => {
+      r.forEach((e) => {
+        clearTimeout(e);
+      }), r.clear();
+    };
+  }, []);
+  const g = S(() => {
+    const r = {
+      push: m,
+      dismiss: f,
+      clear: d,
+      info: () => "",
+      warning: () => "",
+      error: () => ""
+    };
+    return {
+      ...r,
+      info: a(r, "info"),
+      warning: a(r, "warning"),
+      error: a(r, "error")
+    };
+  }, [d, f, m]);
+  return /* @__PURE__ */ E(p.Provider, { value: g, children: [
+    o,
+    /* @__PURE__ */ x(M, { toasts: c, onDismiss: f })
+  ] });
+}, N = () => {
+  const o = b(p);
+  if (o == null)
+    throw new Error("useToast must be used within a ToastProvider");
+  return o;
+};
+export {
+  D as ToastProvider,
+  N as useToast
+};
+//# sourceMappingURL=ToastProvider.js.map

package/lib/esm/atomic/molecules/toast/ToastProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToastProvider.js","sources":["../../../../../src/atomic/molecules/toast/ToastProvider.tsx"],"sourcesContent":["import {\n  createContext,\n  useEffect,\n  useCallback,\n  useContext,\n  useMemo,\n  useRef,\n  useState,\n  type JSX,\n  type ReactNode,\n} from 'react';\n\nimport {\n  ToastViewport,\n  type ToastItem,\n  type ToastKind,\n} from './ToastViewport.js';\nimport { INFO_TOAST_DURATION_MS } from './constants.js';\n\nexport type ToastApi = {\n  push: (toast: Omit<ToastItem, 'id'> & { id?: string }) => string;\n  dismiss: (toastId: string) => void;\n  clear: () => void;\n  info: (title: ReactNode, message?: ReactNode) => string;\n  warning: (title: ReactNode, message?: ReactNode) => string;\n  error: (title: ReactNode, message?: ReactNode) => string;\n};\n\nexport type ToastProviderProps = {\n  children: ReactNode;\n  maxToasts?: number;\n};\n\nconst ToastContext = createContext<ToastApi | null>(null);\n\nconst pushWithKind = (api: ToastApi, kind: ToastKind) => {\n  return (title: ReactNode, message?: ReactNode): string => {\n    return api.push({ kind, title, message });\n  };\n};\n\nexport const ToastProvider = ({\n  children,\n  maxToasts = 4,\n}: ToastProviderProps): JSX.Element => {\n  const [toasts, setToasts] = useState<ToastItem[]>([]);\n  const counter = useRef(0);\n  const infoToastTimers = useRef<Map<string, ReturnType<typeof setTimeout>>>(\n    new Map(),\n  );\n\n  const dismiss = useCallback((toastId: string) => {\n    const timer = infoToastTimers.current.get(toastId);\n    if (timer != null) {\n      clearTimeout(timer);\n      infoToastTimers.current.delete(toastId);\n    }\n    setToasts((prev) => {\n      return prev.filter((t) => {\n        return t.id !== toastId;\n      });\n    });\n  }, []);\n\n  const clear = useCallback(() => {\n    infoToastTimers.current.forEach((timer) => {\n      clearTimeout(timer);\n    });\n    infoToastTimers.current.clear();\n    setToasts([]);\n  }, []);\n\n  const push = useCallback(\n    (toast: Omit<ToastItem, 'id'> & { id?: string }): string => {\n      const id = toast.id ?? `toast-${counter.current++}`;\n      setToasts((prev) => {\n        const next = [...prev, { ...toast, kind: toast.kind ?? 'info', id }];\n        if (next.length > maxToasts) {\n          return next.slice(next.length - maxToasts);\n        }\n        return next;\n      });\n      return id;\n    },\n    [maxToasts],\n  );\n\n  useEffect(() => {\n    const activeInfoToastIds = new Set<string>();\n    toasts.forEach((toast) => {\n      if (toast.kind !== 'info') {\n        return;\n      }\n      activeInfoToastIds.add(toast.id);\n      if (infoToastTimers.current.has(toast.id)) {\n        return;\n      }\n      const timer = setTimeout(() => {\n        infoToastTimers.current.delete(toast.id);\n        setToasts((prev) => {\n          return prev.filter((item) => {\n            return item.id !== toast.id;\n          });\n        });\n      }, INFO_TOAST_DURATION_MS);\n      infoToastTimers.current.set(toast.id, timer);\n    });\n\n    infoToastTimers.current.forEach((timer, toastId) => {\n      if (activeInfoToastIds.has(toastId)) {\n        return;\n      }\n      clearTimeout(timer);\n      infoToastTimers.current.delete(toastId);\n    });\n  }, [toasts]);\n\n  useEffect(() => {\n    const timers = infoToastTimers.current;\n    return () => {\n      timers.forEach((timer) => {\n        clearTimeout(timer);\n      });\n      timers.clear();\n    };\n  }, []);\n\n  const api = useMemo<ToastApi>(() => {\n    const base: ToastApi = {\n      push,\n      dismiss,\n      clear,\n      info: () => {\n        return '';\n      },\n      warning: () => {\n        return '';\n      },\n      error: () => {\n        return '';\n      },\n    };\n    return {\n      ...base,\n      info: pushWithKind(base, 'info'),\n      warning: pushWithKind(base, 'warning'),\n      error: pushWithKind(base, 'error'),\n    };\n  }, [clear, dismiss, push]);\n\n  return (\n    <ToastContext.Provider value={api}>\n      {children}\n      <ToastViewport toasts={toasts} onDismiss={dismiss} />\n    </ToastContext.Provider>\n  );\n};\n\nexport const useToast = (): ToastApi => {\n  const value = useContext(ToastContext);\n  if (value == null) {\n    throw new Error('useToast must be used within a ToastProvider');\n  }\n  return value;\n};\n"],"names":["ToastContext","createContext","pushWithKind","api","kind","title","message","ToastProvider","children","maxToasts","toasts","setToasts","useState","counter","useRef","infoToastTimers","dismiss","useCallback","toastId","timer","prev","t","clear","push","toast","id","next","useEffect","activeInfoToastIds","item","INFO_TOAST_DURATION_MS","timers","useMemo","base","jsxs","jsx","ToastViewport","useToast","value","useContext"],"mappings":"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"}

package/lib/esm/atomic/molecules/toast/ToastViewport.js

@@ -0,0 +1,71 @@
+import { jsx as e, jsxs as c } from "react/jsx-runtime";
+import { useMemo as v } from "react";
+import { ModalCloseSvg as g } from "../../../icons/ModalCloseSvg.js";
+import { Button as b } from "../../atoms/button/Button.js";
+import { useUiTranslation as k } from "../../../i18n/useUiTranslation.js";
+import { message as T, actions as x, header as y, title as C, closeButton as w, kindRecipe as A, toast as B, progressTrack as M, progressBar as O, viewport as S } from "./toast.css.js";
+import { cx as u } from "../../../theme/tools.js";
+import { INFO_TOAST_DURATION_MS as _ } from "./constants.js";
+const V = ({
+  toasts: r,
+  onDismiss: l,
+  dismissLabel: p,
+  className: h
+}) => {
+  const { t: f } = k(), n = p ?? f("toast.dismissAriaLabel"), N = v(() => r.map((i) => {
+    const o = i.kind ?? "info", a = i.actions ?? [];
+    let t = null;
+    i.message != null && (t = /* @__PURE__ */ e("div", { className: T, children: i.message }));
+    let m = null;
+    a.length > 0 && (m = /* @__PURE__ */ e("div", { className: x, children: a.map((s) => /* @__PURE__ */ e(
+      b,
+      {
+        type: "button",
+        size: "small",
+        variant: "secondary",
+        onClick: s.onClick,
+        children: s.label
+      },
+      s.id
+    )) }));
+    let d = null;
+    return o === "info" && (d = /* @__PURE__ */ e("div", { className: M, "aria-hidden": "true", children: /* @__PURE__ */ e(
+      "div",
+      {
+        className: O,
+        style: { animationDuration: `${_}ms` }
+      }
+    ) })), /* @__PURE__ */ c(
+      "div",
+      {
+        className: u(B, A({ kind: o })),
+        children: [
+          /* @__PURE__ */ c("div", { className: y, children: [
+            /* @__PURE__ */ e("div", { className: C, children: i.title }),
+            /* @__PURE__ */ e(
+              "button",
+              {
+                type: "button",
+                className: w,
+                "aria-label": n,
+                onClick: () => {
+                  l(i.id);
+                },
+                children: /* @__PURE__ */ e(g, { width: 18, height: 18, "aria-hidden": "true" })
+              }
+            )
+          ] }),
+          t,
+          m,
+          d
+        ]
+      },
+      i.id
+    );
+  }), [l, n, r]);
+  return r.length === 0 ? null : /* @__PURE__ */ e("div", { className: u(S, h), children: N });
+};
+export {
+  V as ToastViewport
+};
+//# sourceMappingURL=ToastViewport.js.map

package/lib/esm/atomic/molecules/toast/ToastViewport.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToastViewport.js","sources":["../../../../../src/atomic/molecules/toast/ToastViewport.tsx"],"sourcesContent":["import { type JSX, type ReactNode, useMemo } from 'react';\nimport type { RecipeVariants } from '@vanilla-extract/recipes';\n\nimport { ModalCloseSvg } from '../../../icons/ModalCloseSvg.js';\nimport { Button } from '../../atoms/button/Button.js';\nimport { useUiTranslation } from '../../../i18n/useUiTranslation.js';\n\nimport * as styles from './toast.css.js';\nimport { cx } from '../../../theme/tools.js';\nimport { INFO_TOAST_DURATION_MS } from './constants.js';\n\nexport type ToastKind = NonNullable<\n  NonNullable<RecipeVariants<typeof styles.kindRecipe>>['kind']\n>;\n\nexport type ToastAction = {\n  id: string;\n  label: string;\n  onClick: () => void;\n};\n\nexport type ToastItem = {\n  id: string;\n  kind?: ToastKind;\n  title: ReactNode;\n  message?: ReactNode;\n  actions?: readonly ToastAction[];\n};\n\nexport type ToastViewportProps = {\n  toasts: readonly ToastItem[];\n  onDismiss: (toastId: string) => void;\n  dismissLabel?: string;\n  className?: string;\n};\n\nexport const ToastViewport = ({\n  toasts,\n  onDismiss,\n  dismissLabel,\n  className,\n}: ToastViewportProps): JSX.Element | null => {\n  const { t } = useUiTranslation();\n  const resolvedDismissLabel = dismissLabel ?? t('toast.dismissAriaLabel');\n\n  const items = useMemo(() => {\n    return toasts.map((toast) => {\n      const kind = toast.kind ?? 'info';\n      const actions = toast.actions ?? [];\n\n      let messageNode: JSX.Element | null = null;\n      if (toast.message != null) {\n        messageNode = <div className={styles.message}>{toast.message}</div>;\n      }\n\n      let actionsNode: JSX.Element | null = null;\n      if (actions.length > 0) {\n        actionsNode = (\n          <div className={styles.actions}>\n            {actions.map((action) => {\n              return (\n                <Button\n                  key={action.id}\n                  type=\"button\"\n                  size=\"small\"\n                  variant=\"secondary\"\n                  onClick={action.onClick}\n                >\n                  {action.label}\n                </Button>\n              );\n            })}\n          </div>\n        );\n      }\n\n      let progressNode: JSX.Element | null = null;\n      if (kind === 'info') {\n        progressNode = (\n          <div className={styles.progressTrack} aria-hidden=\"true\">\n            <div\n              className={styles.progressBar}\n              style={{ animationDuration: `${INFO_TOAST_DURATION_MS}ms` }}\n            />\n          </div>\n        );\n      }\n\n      return (\n        <div\n          key={toast.id}\n          className={cx(styles.toast, styles.kindRecipe({ kind }))}\n        >\n          <div className={styles.header}>\n            <div className={styles.title}>{toast.title}</div>\n            <button\n              type=\"button\"\n              className={styles.closeButton}\n              aria-label={resolvedDismissLabel}\n              onClick={() => {\n                onDismiss(toast.id);\n              }}\n            >\n              <ModalCloseSvg width={18} height={18} aria-hidden=\"true\" />\n            </button>\n          </div>\n          {messageNode}\n          {actionsNode}\n          {progressNode}\n        </div>\n      );\n    });\n  }, [onDismiss, resolvedDismissLabel, toasts]);\n\n  if (toasts.length === 0) {\n    return null;\n  }\n\n  return <div className={cx(styles.viewport, className)}>{items}</div>;\n};\n"],"names":["ToastViewport","toasts","onDismiss","dismissLabel","className","t","useUiTranslation","resolvedDismissLabel","items","useMemo","toast","kind","actions","messageNode","styles.message","actionsNode","jsx","styles.actions","action","Button","progressNode","styles.progressTrack","styles.progressBar","INFO_TOAST_DURATION_MS","jsxs","cx","styles.toast","styles.kindRecipe","styles.header","styles.title","styles.closeButton","ModalCloseSvg","styles.viewport"],"mappings":";;;;;;;;AAoCO,MAAMA,IAAgB,CAAC;AAAA,EAC5B,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,WAAAC;AACF,MAA8C;AAC5C,QAAM,EAAE,GAAAC,EAAA,IAAMC,EAAA,GACRC,IAAuBJ,KAAgBE,EAAE,wBAAwB,GAEjEG,IAAQC,EAAQ,MACbR,EAAO,IAAI,CAACS,MAAU;AAC3B,UAAMC,IAAOD,EAAM,QAAQ,QACrBE,IAAUF,EAAM,WAAW,CAAA;AAEjC,QAAIG,IAAkC;AACtC,IAAIH,EAAM,WAAW,SACnBG,sBAAe,OAAA,EAAI,WAAWC,GAAiB,YAAM,SAAQ;AAG/D,QAAIC,IAAkC;AACtC,IAAIH,EAAQ,SAAS,MACnBG,IACE,gBAAAC,EAAC,SAAI,WAAWC,GACb,UAAAL,EAAQ,IAAI,CAACM,MAEV,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QAEC,MAAK;AAAA,QACL,MAAK;AAAA,QACL,SAAQ;AAAA,QACR,SAASD,EAAO;AAAA,QAEf,UAAAA,EAAO;AAAA,MAAA;AAAA,MANHA,EAAO;AAAA,IAAA,CASjB,EAAA,CACH;AAIJ,QAAIE,IAAmC;AACvC,WAAIT,MAAS,WACXS,sBACG,OAAA,EAAI,WAAWC,GAAsB,eAAY,QAChD,UAAA,gBAAAL;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAWM;AAAAA,QACX,OAAO,EAAE,mBAAmB,GAAGC,CAAsB,KAAA;AAAA,MAAK;AAAA,IAAA,GAE9D,IAKF,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC,WAAWC,EAAGC,GAAcC,EAAkB,EAAE,MAAAhB,EAAA,CAAM,CAAC;AAAA,QAEvD,UAAA;AAAA,UAAA,gBAAAa,EAAC,OAAA,EAAI,WAAWI,GACd,UAAA;AAAA,YAAA,gBAAAZ,EAAC,OAAA,EAAI,WAAWa,GAAe,YAAM,OAAM;AAAA,YAC3C,gBAAAb;AAAA,cAAC;AAAA,cAAA;AAAA,gBACC,MAAK;AAAA,gBACL,WAAWc;AAAAA,gBACX,cAAYvB;AAAA,gBACZ,SAAS,MAAM;AACb,kBAAAL,EAAUQ,EAAM,EAAE;AAAA,gBACpB;AAAA,gBAEA,4BAACqB,GAAA,EAAc,OAAO,IAAI,QAAQ,IAAI,eAAY,OAAA,CAAO;AAAA,cAAA;AAAA,YAAA;AAAA,UAC3D,GACF;AAAA,UACClB;AAAA,UACAE;AAAA,UACAK;AAAA,QAAA;AAAA,MAAA;AAAA,MAlBIV,EAAM;AAAA,IAAA;AAAA,EAqBjB,CAAC,GACA,CAACR,GAAWK,GAAsBN,CAAM,CAAC;AAE5C,SAAIA,EAAO,WAAW,IACb,OAGF,gBAAAe,EAAC,SAAI,WAAWS,EAAGO,GAAiB5B,CAAS,GAAI,UAAAI,GAAM;AAChE;"}

package/lib/esm/atomic/molecules/toast/constants.js

@@ -0,0 +1,5 @@
+const O = 15e3;
+export {
+  O as INFO_TOAST_DURATION_MS
+};
+//# sourceMappingURL=constants.js.map

package/lib/esm/atomic/molecules/toast/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../../../../src/atomic/molecules/toast/constants.ts"],"sourcesContent":["export const INFO_TOAST_DURATION_MS = 15_000;\n"],"names":["INFO_TOAST_DURATION_MS"],"mappings":"AAAO,MAAMA,IAAyB;"}

package/lib/esm/atomic/molecules/toast/toast.css.js

@@ -0,0 +1,17 @@
+/* empty css                                          */
+/* empty css                         */
+import { createRuntimeFn as b } from "@vanilla-extract/recipes/createRuntimeFn";
+var q = "_19cwz1i0 txvbqbpso txvbqbpuf txvbqb836 txvbqbuvx txvbqb9io txvbqbai6 txvbqbao6", i = "_19cwz1i3 _19cwz1i2 txvbqbnvf txvbqboio txvbqbp5o txvbqblxf txvbqbuzn txvbqbwf txvbqb1qf txvbqb1co txvbqb9io txvbqbai6 txvbqbanx txvbqb1ro txvbqb8q6", a = b({ defaultClassName: "_19cwz1i4", variantClassNames: { kind: { info: "_19cwz1i5", warning: "_19cwz1i6", error: "_19cwz1i7" } }, defaultVariants: { kind: "info" }, compoundVariants: [] }), o = "_19cwz1i8 txvbqb9io txvbqbcf txvbqbdoo txvbqbao6", r = "_19cwz1i9 txvbqbamo", c = "_19cwz1ia txvbqb8x", e = "_19cwz1ib txvbqb9jf txvbqbco txvbqbao6 txvbqbhwx", w = "_19cwz1id _19cwz1ic txvbqb9jf txvbqbco txvbqbdnx txvbqbtx6 txvbqbc6o txvbqb1rf txvbqb1px txvbqb12f txvbqbuzj txvbqbv", n = "_19cwz1if _19cwz1ie txvbqbhwx txvbqb1t6", z = "_19cwz1ih";
+export {
+  e as actions,
+  w as closeButton,
+  o as header,
+  a as kindRecipe,
+  c as message,
+  z as progressBar,
+  n as progressTrack,
+  r as title,
+  i as toast,
+  q as viewport
+};
+//# sourceMappingURL=toast.css.js.map

package/lib/esm/atomic/molecules/toast/toast.css.js.map

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

package/lib/esm/atomic/molecules/toast/toast.css.ts.vanilla-2GtcGJsi.css

@@ -0,0 +1 @@
+@keyframes _19cwz1i1{0%{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes _19cwz1ig{0%{width:0%}to{width:100%}}._19cwz1i3{width:min(28rem,calc(100vw - 2rem));animation:_19cwz1i1 .14s ease-out}._19cwz1i5{border-color:var(--kronex-colors-blue-200)}._19cwz1i6{border-color:var(--kronex-colors-amber-200)}._19cwz1i7{border-color:var(--kronex-colors-red-200)}._19cwz1if{height:4px;background-color:var(--kronex-colors-blue-50);overflow:hidden}._19cwz1ih{height:100%;width:0%;background-color:var(--kronex-colors-blue-400);animation-name:_19cwz1ig;animation-timing-function:linear;animation-fill-mode:forwards}

package/lib/esm/components/data-table/DataTable.css.js

@@ -0,0 +1,24 @@
+/* empty css                                       */
+/* empty css                             */
+import { createRuntimeFn as b } from "@vanilla-extract/recipes/createRuntimeFn";
+var s = b({ defaultClassName: "ysn8463 ysn8460 txvbqb9io txvbqbai6 txvbqbu6f txvbqb1k", variantClassNames: { kind: { default: "ysn8464 ysn8461 txvbqbuzn txvbqbwf txvbqb1ro txvbqb1qf txvbqb1co txvbqbl6f", brandTable: "ysn8465 ysn8462 txvbqbuzj txvbqb1qo txvbqb1px txvbqb12f txvbqbl6x" } }, defaultVariants: { kind: "default" }, compoundVariants: [] }), v = b({ defaultClassName: "ysn8468", variantClassNames: { kind: { default: "ysn8469 ysn8466 txvbqb12f txvbqb1qf txvbqb62o txvbqb3no txvbqbv2t", brandTable: "ysn846a ysn8467 txvbqbuzj txvbqb12f txvbqb1qf txvbqb62o txvbqb3s6" } }, defaultVariants: { kind: "default" }, compoundVariants: [] }), x = "ysn846b txvbqb9ix txvbqbu6f txvbqbc6", e = "var(--ysn846c)", q = "var(--ysn846d)", l = "var(--ysn846e)", d = b({ defaultClassName: "ysn846j ysn846f txvbqbco txvbqb9io txvbqbaj6 txvbqbao6 txvbqbl6f txvbqbt6f txvbqbuw6", variantClassNames: { kind: { default: "ysn846k ysn846h ysn846g txvbqbv8p txvbqbamo", brandTable: "ysn846l ysn846i txvbqbnuf txvbqboho txvbqbp5x txvbqblxo txvbqbv7p txvbqbamx txvbqb8o txvbqbeef txvbqb66 txvbqb54x" } }, defaultVariants: { kind: "default" }, compoundVariants: [] }), r = b({ defaultClassName: "ysn846o ysn846m txvbqb9io txvbqbai6", variantClassNames: { kind: { default: "ysn846p", brandTable: "ysn846q ysn846n txvbqbuzj" } }, defaultVariants: { kind: "default" }, compoundVariants: [] }), y = b({ defaultClassName: "ysn846w ysn846r txvbqbc6 txvbqb1qf txvbqb12f txvbqb9ix txvbqb78 txvbqb6x txvbqb7k", variantClassNames: { kind: { default: "ysn846x ysn846t ysn846s txvbqbv2r txvbqb3of txvbqb62o", brandTable: "ysn846y ysn846v ysn846u txvbqbuzj txvbqb3s6 txvbqb62o" } }, defaultVariants: { kind: "default" }, compoundVariants: [] }), i = b({ defaultClassName: "ysn84611", variantClassNames: { kind: { default: "ysn84612 ysn846z txvbqbv2v", brandTable: "ysn84613 ysn84610 txvbqbuzj" } }, defaultVariants: { kind: "default" }, compoundVariants: [] }), o = b({ defaultClassName: "ysn84616", variantClassNames: { kind: { default: "ysn84617 ysn84614 txvbqbv2r", brandTable: "ysn84618 ysn84615 txvbqbuzj" } }, defaultVariants: { kind: "default" }, compoundVariants: [] }), u = b({ defaultClassName: "ysn8461d ysn84619 txvbqbco txvbqb9io txvbqbao6 txvbqbk4x txvbqbl6f", variantClassNames: { kind: { default: "ysn8461e ysn8461b ysn8461a txvbqbv8r", brandTable: "ysn8461f ysn8461c txvbqbnuf txvbqboho txvbqbp5x txvbqblxo txvbqbv8p txvbqbamo txvbqb8x txvbqb54x" } }, defaultVariants: { kind: "default" }, compoundVariants: [] }), f = "ysn8461g txvbqbamo txvbqbv8p", m = "ysn8461h txvbqbv8p", p = "ysn8461i", C = "ysn8461j txvbqb96 txvbqbv8r txvbqbt5x", V = b({ defaultClassName: "ysn8461k", variantClassNames: { minVisibleAt: { sm: "ysn8461l", md: "ysn8461m", lg: "ysn8461n", xl: "ysn8461o", xxl: "ysn8461p" } }, defaultVariants: {}, compoundVariants: [] });
+export {
+  r as body,
+  u as cell,
+  s as container,
+  C as emptyCell,
+  p as emptyRow,
+  v as header,
+  d as headerCell,
+  x as headerRow,
+  V as hideBelowRecipe,
+  f as primaryCell,
+  m as primaryHeaderCell,
+  y as row,
+  i as rowEven,
+  o as rowOdd,
+  q as tableCellFontSizeVar,
+  e as tableCellPaddingVar,
+  l as tableEmptyRowPaddingVar
+};
+//# sourceMappingURL=DataTable.css.js.map

package/lib/esm/components/data-table/DataTable.css.js.map

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

package/lib/esm/components/data-table/DataTable.css.ts.vanilla-BLE98fwj.css

@@ -0,0 +1 @@
+.ysn846h{padding:var(--ysn846c, var(--kronex-spacing-3) var(--kronex-spacing-4));font-size:var(--ysn846d, var(--kronex-fontSize-sm));border-right:1px solid var(--kronex-colors-border)}.ysn846h:last-child{border-right:none}.ysn846t:last-child{border-bottom-width:0}.ysn846t:hover{background-color:var(--kronex-colors-surfaceSecondary)}.ysn846v:last-child{border-bottom-width:0}.ysn846v:hover{background-color:transparent}.ysn8461b{padding:var(--ysn846c, var(--kronex-spacing-3) var(--kronex-spacing-4));font-size:var(--ysn846d, var(--kronex-fontSize-sm));border-right:1px solid var(--kronex-colors-borderLight)}.ysn8461b:last-child{border-right:none}.ysn8461i{padding:var(--ysn846e, var(--kronex-spacing-6) var(--kronex-spacing-4))}@container (max-width: 767.5px){.ysn8461l{visibility:hidden;opacity:0;pointer-events:none;padding-inline:0;padding-block:0;border-right:none;overflow:hidden}}@container (max-width: 1023.5px){.ysn8461m{visibility:hidden;opacity:0;pointer-events:none;padding-inline:0;padding-block:0;border-right:none;overflow:hidden}}@container (max-width: 1279.5px){.ysn8461n{visibility:hidden;opacity:0;pointer-events:none;padding-inline:0;padding-block:0;border-right:none;overflow:hidden}}@container (max-width: 1439.5px){.ysn8461o{visibility:hidden;opacity:0;pointer-events:none;padding-inline:0;padding-block:0;border-right:none;overflow:hidden}}@container (max-width: 1679.5px){.ysn8461p{visibility:hidden;opacity:0;pointer-events:none;padding-inline:0;padding-block:0;border-right:none;overflow:hidden}}

package/lib/esm/components/data-table/DataTable.js

@@ -0,0 +1,141 @@
+import { jsx as i, Fragment as S, jsxs as j } from "react/jsx-runtime";
+import { emptyCell as D, emptyRow as F, row as H, rowEven as I, rowOdd as O, cell as U, primaryCell as V, headerCell as _, primaryHeaderCell as B, headerRow as K, header as M, body as q, container as z, hideBelowRecipe as G } from "./DataTable.css.js";
+import { cx as t } from "../../theme/tools.js";
+import { useUiTranslation as J } from "../../i18n/useUiTranslation.js";
+const Q = "minmax(0, 1fr)", v = (n) => n == null ? null : G({ minVisibleAt: n }), W = (n, a) => typeof a == "string" && a !== "" ? { gridTemplateColumns: a } : {
+  gridTemplateColumns: `repeat(${n}, ${Q})`
+}, ee = ({
+  columns: n,
+  rows: a,
+  getRowId: C,
+  emptyState: b,
+  className: N,
+  headerClassName: E,
+  bodyClassName: k,
+  rowClassName: y,
+  gridTemplateClassName: c,
+  gridTemplateColumns: R,
+  kind: g,
+  classes: e
+}) => {
+  const { t: L } = J(), o = g ?? "default", T = /* @__PURE__ */ i("div", { className: t(D, e?.emptyCell), children: L("common.table.empty") }), x = b ?? T, A = a.length === 0;
+  let m;
+  c == null && (m = W(
+    n.length,
+    R
+  ));
+  const f = [];
+  c != null && f.push(c);
+  let u;
+  return A ? u = /* @__PURE__ */ i("div", { className: t(F, e?.emptyRow), role: "row", children: /* @__PURE__ */ i("div", { role: "cell", children: x }) }) : u = /* @__PURE__ */ i(S, { children: a.map((l, s) => {
+    const h = C(l, s), d = [H({ kind: o }), e?.row];
+    s % 2 === 0 ? d.push(
+      I({ kind: o }),
+      e?.rowEven
+    ) : d.push(
+      O({ kind: o }),
+      e?.rowOdd
+    );
+    for (const r of f)
+      d.push(r);
+    if (y != null) {
+      const r = y(l, s);
+      r != null && d.push(r);
+    }
+    return /* @__PURE__ */ i(
+      "div",
+      {
+        role: "row",
+        className: t(...d),
+        style: m,
+        children: n.map((r) => {
+          const p = [
+            U({ kind: o }),
+            e?.cell
+          ], w = v(r.minVisibleAt);
+          w != null && p.push(w), r.className != null && p.push(r.className), r.isPrimary && p.push(V, e?.primaryCell);
+          const P = r.cell(l);
+          return /* @__PURE__ */ i(
+            "div",
+            {
+              role: "cell",
+              className: t(...p),
+              children: P
+            },
+            r.id
+          );
+        })
+      },
+      h
+    );
+  }) }), /* @__PURE__ */ j(
+    "div",
+    {
+      className: t(
+        z({ kind: o }),
+        e?.container,
+        N
+      ),
+      role: "table",
+      children: [
+        /* @__PURE__ */ i(
+          "div",
+          {
+            className: t(
+              M({ kind: o }),
+              e?.header,
+              E
+            ),
+            role: "rowgroup",
+            children: /* @__PURE__ */ i(
+              "div",
+              {
+                className: t(
+                  K,
+                  e?.headerRow,
+                  ...f
+                ),
+                role: "row",
+                style: m,
+                children: n.map((l) => {
+                  const s = [
+                    _({ kind: o }),
+                    e?.headerCell
+                  ], h = v(l.minVisibleAt);
+                  return h != null && s.push(h), l.className != null && s.push(l.className), l.isPrimary && s.push(
+                    B,
+                    e?.primaryHeaderCell
+                  ), /* @__PURE__ */ i(
+                    "div",
+                    {
+                      role: "columnheader",
+                      className: t(...s),
+                      children: l.header
+                    },
+                    l.id
+                  );
+                })
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ i(
+          "div",
+          {
+            className: t(
+              q({ kind: o }),
+              e?.body,
+              k
+            ),
+            role: "rowgroup",
+            children: u
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  ee as DataTable
+};
+//# sourceMappingURL=DataTable.js.map

package/lib/esm/components/data-table/DataTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTable.js","sources":["../../../../src/components/data-table/DataTable.tsx"],"sourcesContent":["import { type CSSProperties, type JSX } from 'react';\n\nimport * as styles from './DataTable.css.js';\nimport type { DataTableBreakpoint } from './tableBreakpoints.js';\nimport { cx } from '../../theme/tools.js';\nimport { useUiTranslation } from '../../i18n/useUiTranslation.js';\nimport type { SlotClasses } from '../../styles/slots.js';\n\nexport type DataTableColumn<Row> = {\n  id: string;\n  header: JSX.Element | string;\n  cell: (row: Row) => JSX.Element | string | null;\n  minVisibleAt?: DataTableBreakpoint;\n  className?: string;\n  isPrimary?: boolean;\n};\n\nexport type GetRowId<Row> = (row: Row, index: number) => string;\n\nexport type DataTableKind = NonNullable<\n  Parameters<typeof styles.container>[0]\n>['kind'];\n\ntype DataTableSlot =\n  | 'container'\n  | 'header'\n  | 'headerRow'\n  | 'headerCell'\n  | 'primaryHeaderCell'\n  | 'body'\n  | 'row'\n  | 'rowEven'\n  | 'rowOdd'\n  | 'cell'\n  | 'primaryCell'\n  | 'emptyRow'\n  | 'emptyCell';\n\nexport type DataTableProps<Row> = {\n  columns: readonly DataTableColumn<Row>[];\n  rows: readonly Row[];\n  getRowId: GetRowId<Row>;\n  emptyState?: JSX.Element;\n  className?: string;\n  headerClassName?: string;\n  bodyClassName?: string;\n  rowClassName?: (row: Row, index: number) => string | null | undefined;\n  gridTemplateClassName?: string;\n  gridTemplateColumns?: string;\n  kind?: DataTableKind;\n  classes?: SlotClasses<DataTableSlot>;\n};\n\nconst DEFAULT_TEMPLATE_CELL = 'minmax(0, 1fr)';\n\nconst getVisibilityClass = (minVisibleAt?: DataTableBreakpoint) => {\n  if (minVisibleAt == null) {\n    return null;\n  }\n\n  return styles.hideBelowRecipe({ minVisibleAt });\n};\n\nconst buildInlineTemplate = (\n  columnCount: number,\n  gridTemplateColumns?: string,\n): CSSProperties => {\n  if (typeof gridTemplateColumns === 'string' && gridTemplateColumns !== '') {\n    return { gridTemplateColumns };\n  }\n  return {\n    gridTemplateColumns: `repeat(${columnCount}, ${DEFAULT_TEMPLATE_CELL})`,\n  };\n};\n\n/**\n * Generic responsive data table component.\n */\nexport const DataTable = <Row,>({\n  columns,\n  rows,\n  getRowId,\n  emptyState,\n  className,\n  headerClassName,\n  bodyClassName,\n  rowClassName,\n  gridTemplateClassName,\n  gridTemplateColumns,\n  kind,\n  classes,\n}: DataTableProps<Row>): JSX.Element => {\n  const { t } = useUiTranslation();\n  const resolvedKind: DataTableKind = kind ?? 'default';\n  const defaultEmptyState = (\n    <div className={cx(styles.emptyCell, classes?.emptyCell)}>\n      {t('common.table.empty')}\n    </div>\n  ) as JSX.Element;\n  const resolvedEmptyState = emptyState ?? defaultEmptyState;\n  const showEmpty = rows.length === 0;\n\n  let inlineTemplateStyle: CSSProperties | undefined;\n  if (gridTemplateClassName == null) {\n    inlineTemplateStyle = buildInlineTemplate(\n      columns.length,\n      gridTemplateColumns,\n    );\n  }\n\n  const sharedRowClasses: string[] = [];\n  if (gridTemplateClassName != null) {\n    sharedRowClasses.push(gridTemplateClassName);\n  }\n\n  let rowsContent: JSX.Element;\n  if (showEmpty) {\n    rowsContent = (\n      <div className={cx(styles.emptyRow, classes?.emptyRow)} role=\"row\">\n        <div role=\"cell\">{resolvedEmptyState}</div>\n      </div>\n    );\n  } else {\n    rowsContent = (\n      <>\n        {rows.map((row, index) => {\n          const rowId = getRowId(row, index);\n          const rowClasses = [styles.row({ kind: resolvedKind }), classes?.row];\n          if (index % 2 === 0) {\n            rowClasses.push(\n              styles.rowEven({ kind: resolvedKind }),\n              classes?.rowEven,\n            );\n          } else {\n            rowClasses.push(\n              styles.rowOdd({ kind: resolvedKind }),\n              classes?.rowOdd,\n            );\n          }\n          for (const sharedClass of sharedRowClasses) {\n            rowClasses.push(sharedClass);\n          }\n\n          if (rowClassName != null) {\n            const customClass = rowClassName(row, index);\n            if (customClass != null) {\n              rowClasses.push(customClass);\n            }\n          }\n\n          return (\n            <div\n              key={rowId}\n              role=\"row\"\n              className={cx(...rowClasses)}\n              style={inlineTemplateStyle}\n            >\n              {columns.map((column) => {\n                const cellClasses = [\n                  styles.cell({ kind: resolvedKind }),\n                  classes?.cell,\n                ];\n                const visibilityClass = getVisibilityClass(column.minVisibleAt);\n\n                if (visibilityClass != null) {\n                  cellClasses.push(visibilityClass);\n                }\n\n                if (column.className != null) {\n                  cellClasses.push(column.className);\n                }\n                if (column.isPrimary) {\n                  cellClasses.push(styles.primaryCell, classes?.primaryCell);\n                }\n\n                const content = column.cell(row);\n\n                return (\n                  <div\n                    key={column.id}\n                    role=\"cell\"\n                    className={cx(...cellClasses)}\n                  >\n                    {content}\n                  </div>\n                );\n              })}\n            </div>\n          );\n        })}\n      </>\n    );\n  }\n\n  return (\n    <div\n      className={cx(\n        styles.container({ kind: resolvedKind }),\n        classes?.container,\n        className,\n      )}\n      role=\"table\"\n    >\n      <div\n        className={cx(\n          styles.header({ kind: resolvedKind }),\n          classes?.header,\n          headerClassName,\n        )}\n        role=\"rowgroup\"\n      >\n        <div\n          className={cx(\n            styles.headerRow,\n            classes?.headerRow,\n            ...sharedRowClasses,\n          )}\n          role=\"row\"\n          style={inlineTemplateStyle}\n        >\n          {columns.map((column) => {\n            const headerClasses = [\n              styles.headerCell({ kind: resolvedKind }),\n              classes?.headerCell,\n            ];\n            const visibilityClass = getVisibilityClass(column.minVisibleAt);\n            if (visibilityClass != null) {\n              headerClasses.push(visibilityClass);\n            }\n\n            if (column.className != null) {\n              headerClasses.push(column.className);\n            }\n            if (column.isPrimary) {\n              headerClasses.push(\n                styles.primaryHeaderCell,\n                classes?.primaryHeaderCell,\n              );\n            }\n\n            return (\n              <div\n                key={column.id}\n                role=\"columnheader\"\n                className={cx(...headerClasses)}\n              >\n                {column.header}\n              </div>\n            );\n          })}\n        </div>\n      </div>\n\n      <div\n        className={cx(\n          styles.body({ kind: resolvedKind }),\n          classes?.body,\n          bodyClassName,\n        )}\n        role=\"rowgroup\"\n      >\n        {rowsContent}\n      </div>\n    </div>\n  );\n};\n"],"names":["DEFAULT_TEMPLATE_CELL","getVisibilityClass","minVisibleAt","styles.hideBelowRecipe","buildInlineTemplate","columnCount","gridTemplateColumns","DataTable","columns","rows","getRowId","emptyState","className","headerClassName","bodyClassName","rowClassName","gridTemplateClassName","kind","classes","t","useUiTranslation","resolvedKind","defaultEmptyState","jsx","cx","styles.emptyCell","resolvedEmptyState","showEmpty","inlineTemplateStyle","sharedRowClasses","rowsContent","styles.emptyRow","Fragment","row","index","rowId","rowClasses","styles.row","styles.rowEven","styles.rowOdd","sharedClass","customClass","column","cellClasses","styles.cell","visibilityClass","styles.primaryCell","content","jsxs","styles.container","styles.header","styles.headerRow","headerClasses","styles.headerCell","styles.primaryHeaderCell","styles.body"],"mappings":"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"}

package/lib/esm/components/data-table/TableCell.css.js

@@ -0,0 +1,15 @@
+/* empty css                                       */
+/* empty css                             */
+import { createRuntimeFn as t } from "@vanilla-extract/recipes/createRuntimeFn";
+var v = "x6ceqz0 txvbqbu6f txvbqb9io txvbqbco txvbqbao6 txvbqbv8p", x = t({ defaultClassName: "x6ceqz1", variantClassNames: { align: { start: "x6ceqz2", center: "x6ceqz3", end: "x6ceqz4" } }, defaultVariants: { align: "start" }, compoundVariants: [] }), q = "x6ceqz5 txvbqbv8p", r = "x6ceqz6 txvbqbv8p txvbqbuw6", c = "x6ceqz7 txvbqbv8p txvbqbuw6", i = "x6ceqz8 txvbqbv8r txvbqb8o", s = "x6ceqz9 txvbqbl6f txvbqbt6f txvbqbuw6", m = "x6ceqza txvbqbuwx";
+export {
+  x as alignRecipe,
+  v as base,
+  c as date,
+  s as ellipsis,
+  i as muted,
+  r as number,
+  m as summary,
+  q as text
+};
+//# sourceMappingURL=TableCell.css.js.map

package/lib/esm/components/data-table/TableCell.css.js.map

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

package/lib/esm/components/data-table/TableCell.css.ts.vanilla-i5QJvdbl.css

@@ -0,0 +1 @@
+.x6ceqz2{justify-content:flex-start;text-align:left}.x6ceqz3{justify-content:center;text-align:center}.x6ceqz4{justify-content:flex-end;text-align:right}