@brycks/core-front 0.5.0 → 0.7.0

package/dist/components/data/List/List.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),p=require("react"),m=require("../../../utils/styles.cjs"),o=require("../../../design-system/tokens/spacing.cjs"),v=require("../../../design-system/tokens/motion.cjs"),c=require("../../../design-system/tokens/typography.cjs"),n=require("../../../design-system/primitives/sizing.cjs"),h=p.createContext({size:"md",variant:"default"});function R(){return p.useContext(h)}const z=p.forwardRef(function({size:r="md",variant:e="default",interactive:a=!1,className:t,style:i,children:d,testId:y,...f},b){const x={listStyle:"none",margin:0,padding:0,display:"flex",flexDirection:"column",gap:e==="separated"?o.spacing[2]:0,border:e==="bordered"?"1px solid var(--brycks-border-default)":void 0,borderRadius:e==="bordered"?"var(--brycks-radius-lg)":void 0,overflow:e==="bordered"?"hidden":void 0,...i};return s.jsx(h.Provider,{value:{size:r,variant:e},children:s.jsx("ul",{ref:b,className:m.cx("brycks-list",`brycks-list--${r}`,`brycks-list--${e}`,a&&"brycks-list--interactive",t),style:x,"data-testid":y,...f,children:d})})});z.displayName="List";const w={sm:{paddingY:n.componentPaddingY.md,paddingX:n.componentPaddingX.sm,fontSize:c.fontSizes.base-1,secondarySize:c.fontSizes.sm,gap:n.componentGap.lg,minHeight:n.componentHeights.md},md:{paddingY:n.componentPaddingX.sm,paddingX:n.componentPaddingX.md,fontSize:c.fontSizes.base,secondarySize:c.fontSizes.base-1,gap:n.componentGap.xl,minHeight:52},lg:{paddingY:n.componentPaddingX.md,paddingX:n.componentPaddingX.lg,fontSize:c.fontSizes.md,secondarySize:c.fontSizes.base,gap:o.spacing[3.5],minHeight:o.spacing[16]}},L=p.forwardRef(function({leftElement:r,rightElement:e,secondary:a,selected:t=!1,disabled:i=!1,clickable:d=!1,className:y,style:f,children:b,...x},$){const{size:C,variant:g}=R(),l=w[C],X={display:"flex",alignItems:"center",gap:l.gap,padding:`${l.paddingY}px ${l.paddingX}px`,minHeight:l.minHeight,backgroundColor:t?"var(--brycks-primary-muted)":"transparent",borderBottom:g==="default"||g==="bordered"?"1px solid var(--brycks-border-muted)":void 0,border:g==="separated"?"1px solid var(--brycks-border-default)":void 0,borderRadius:g==="separated"?"var(--brycks-radius-lg)":void 0,cursor:i?"not-allowed":d?"pointer":void 0,opacity:i?.5:1,transition:`background-color ${v.durations.quick}ms ${v.easings.easeOut}`,...f},q={flex:1,display:"flex",flexDirection:"column",gap:o.spacing[.5],minWidth:0},N={fontSize:l.fontSize,fontWeight:500,color:"var(--brycks-foreground-default)",lineHeight:1.4},P={fontSize:l.secondarySize,color:"var(--brycks-foreground-muted)",lineHeight:1.4},k={display:"flex",alignItems:"center",justifyContent:"center",flexShrink:0};return s.jsxs("li",{ref:$,className:m.cx("brycks-list-item",t&&"brycks-list-item--selected",d&&"brycks-list-item--clickable",i&&"brycks-list-item--disabled",y),style:X,onMouseEnter:S=>{d&&!i&&!t&&(S.currentTarget.style.backgroundColor="var(--brycks-background-muted)")},onMouseLeave:S=>{t||(S.currentTarget.style.backgroundColor="transparent")},...x,children:[r&&s.jsx("span",{style:k,children:r}),s.jsxs("div",{style:q,children:[s.jsx("span",{style:N,children:b}),a&&s.jsx("span",{style:P,children:a})]}),e&&s.jsx("span",{style:k,children:e})]})});L.displayName="ListItem";const j=p.forwardRef(function({className:r,style:e,...a},t){const i={height:1,backgroundColor:"var(--brycks-border-muted)",margin:`${o.spacing[2]}px 0`,...e};return s.jsx("li",{ref:t,role:"separator",className:m.cx("brycks-list-divider",r),style:i,...a})});j.displayName="ListDivider";const H=p.forwardRef(function({className:r,style:e,children:a,...t},i){const d={padding:`${o.spacing[3]}px ${o.spacing[4]}px ${o.spacing[2]}px ${o.spacing[4]}px`,fontSize:c.fontSizes.xs,fontWeight:600,color:"var(--brycks-foreground-muted)",textTransform:"uppercase",letterSpacing:"0.05em",...e};return s.jsx("li",{ref:i,className:m.cx("brycks-list-header",r),style:d,...t,children:a})});H.displayName="ListHeader";exports.List=z;exports.ListDivider=j;exports.ListHeader=H;exports.ListItem=L;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),c=require("react"),l=require("../../../utils/styles.cjs"),N=c.createContext({size:"md",variant:"default"}),b=c.forwardRef(function({size:e="md",variant:t="default",interactive:i=!1,className:r,style:a,children:n,testId:m,...o},y){return s.jsx(N.Provider,{value:{size:e,variant:t},children:s.jsx("ul",{ref:y,className:l.cx("brycks-list",`brycks-list--${e}`,`brycks-list--${t}`,i&&"brycks-list--interactive",r),style:a,"data-testid":m,...o,children:n})})});b.displayName="List";const u=c.forwardRef(function({leftElement:e,rightElement:t,secondary:i,selected:r=!1,disabled:a=!1,clickable:n=!1,className:m,style:o,children:y,...L},k){return s.jsxs("li",{ref:k,className:l.cx("brycks-list-item",r&&"brycks-list-item--selected",n&&"brycks-list-item--clickable",a&&"brycks-list-item--disabled",m),style:o,...L,children:[e&&s.jsx("span",{className:"brycks-list-item__element",children:e}),s.jsxs("div",{className:"brycks-list-item__content",children:[s.jsx("span",{className:"brycks-list-item__primary",children:y}),i&&s.jsx("span",{className:"brycks-list-item__secondary",children:i})]}),t&&s.jsx("span",{className:"brycks-list-item__element",children:t})]})});u.displayName="ListItem";const f=c.forwardRef(function({className:e,style:t,...i},r){return s.jsx("li",{ref:r,role:"separator",className:l.cx("brycks-list-divider",e),style:t,...i})});f.displayName="ListDivider";const x=c.forwardRef(function({className:e,style:t,children:i,...r},a){return s.jsx("li",{ref:a,className:l.cx("brycks-list-header",e),style:t,...r,children:i})});x.displayName="ListHeader";exports.List=b;exports.ListDivider=f;exports.ListHeader=x;exports.ListItem=u;
 //# sourceMappingURL=List.cjs.map

package/dist/components/data/List/List.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"List.cjs","sources":["../../../../src/components/data/List/List.tsx"],"sourcesContent":["/**\n * List Component\n *\n * A flexible list component for displaying items in a vertical layout.\n * Supports different sizes, icons, and interactive items.\n */\n\nimport {\n  forwardRef,\n  createContext,\n  useContext,\n  type CSSProperties,\n  type ReactNode,\n  type HTMLAttributes,\n} from 'react'\nimport { cx } from '../../../utils/styles'\nimport { spacing, fontSizes, durations, easings } from '../../../design-system'\nimport { componentHeights, componentGap, componentPaddingX, componentPaddingY } from '../../../design-system/primitives'\n\nexport type ListSize = 'sm' | 'md' | 'lg'\nexport type ListVariant = 'default' | 'bordered' | 'separated'\n\ninterface ListContextValue {\n  size: ListSize\n  variant: ListVariant\n}\n\nconst ListContext = createContext<ListContextValue>({ size: 'md', variant: 'default' })\n\nfunction useListContext() {\n  return useContext(ListContext)\n}\n\nexport interface ListProps extends HTMLAttributes<HTMLUListElement> {\n  /** List size */\n  size?: ListSize\n  /** List variant */\n  variant?: ListVariant\n  /** Whether list items are interactive */\n  interactive?: boolean\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\nexport const List = forwardRef<HTMLUListElement, ListProps>(function List(\n  {\n    size = 'md',\n    variant = 'default',\n    interactive = false,\n    className,\n    style,\n    children,\n    testId,\n    ...props\n  },\n  ref\n) {\n  const listStyle: CSSProperties = {\n    listStyle: 'none',\n    margin: 0,\n    padding: 0,\n    display: 'flex',\n    flexDirection: 'column',\n    gap: variant === 'separated' ? spacing[2] : 0,\n    border: variant === 'bordered' ? '1px solid var(--brycks-border-default)' : undefined,\n    borderRadius: variant === 'bordered' ? 'var(--brycks-radius-lg)' : undefined,\n    overflow: variant === 'bordered' ? 'hidden' : undefined,\n    ...style,\n  }\n\n  return (\n    <ListContext.Provider value={{ size, variant }}>\n      <ul\n        ref={ref}\n        className={cx(\n          'brycks-list',\n          `brycks-list--${size}`,\n          `brycks-list--${variant}`,\n          interactive && 'brycks-list--interactive',\n          className\n        )}\n        style={listStyle}\n        data-testid={testId}\n        {...props}\n      >\n        {children}\n      </ul>\n    </ListContext.Provider>\n  )\n})\n\nList.displayName = 'List'\n\n// ListItem\nexport interface ListItemProps extends HTMLAttributes<HTMLLIElement> {\n  /** Icon or avatar on the left */\n  leftElement?: ReactNode\n  /** Element on the right (badge, button, etc.) */\n  rightElement?: ReactNode\n  /** Secondary text below the main content */\n  secondary?: ReactNode\n  /** Whether the item is selected */\n  selected?: boolean\n  /** Whether the item is disabled */\n  disabled?: boolean\n  /** Whether the item is clickable */\n  clickable?: boolean\n  /** Custom class name */\n  className?: string\n}\n\nconst sizeConfig: Record<ListSize, { paddingX: number; paddingY: number; fontSize: number; secondarySize: number; gap: number; minHeight: number }> = {\n  sm: { paddingY: componentPaddingY.md, paddingX: componentPaddingX.sm, fontSize: fontSizes.base - 1, secondarySize: fontSizes.sm, gap: componentGap.lg, minHeight: componentHeights.md },\n  md: { paddingY: componentPaddingX.sm, paddingX: componentPaddingX.md, fontSize: fontSizes.base, secondarySize: fontSizes.base - 1, gap: componentGap.xl, minHeight: 52 },\n  lg: { paddingY: componentPaddingX.md, paddingX: componentPaddingX.lg, fontSize: fontSizes.md, secondarySize: fontSizes.base, gap: spacing[3.5], minHeight: spacing[16] },\n}\n\nexport const ListItem = forwardRef<HTMLLIElement, ListItemProps>(function ListItem(\n  {\n    leftElement,\n    rightElement,\n    secondary,\n    selected = false,\n    disabled = false,\n    clickable = false,\n    className,\n    style,\n    children,\n    ...props\n  },\n  ref\n) {\n  const { size, variant } = useListContext()\n  const config = sizeConfig[size]\n\n  const itemStyle: CSSProperties = {\n    display: 'flex',\n    alignItems: 'center',\n    gap: config.gap,\n    padding: `${config.paddingY}px ${config.paddingX}px`,\n    minHeight: config.minHeight,\n    backgroundColor: selected\n      ? 'var(--brycks-primary-muted)'\n      : 'transparent',\n    borderBottom: variant === 'default' || variant === 'bordered'\n      ? '1px solid var(--brycks-border-muted)'\n      : undefined,\n    border: variant === 'separated' ? '1px solid var(--brycks-border-default)' : undefined,\n    borderRadius: variant === 'separated' ? 'var(--brycks-radius-lg)' : undefined,\n    cursor: disabled ? 'not-allowed' : clickable ? 'pointer' : undefined,\n    opacity: disabled ? 0.5 : 1,\n    transition: `background-color ${durations.quick}ms ${easings.easeOut}`,\n    ...style,\n  }\n\n  const contentStyle: CSSProperties = {\n    flex: 1,\n    display: 'flex',\n    flexDirection: 'column',\n    gap: spacing[0.5],\n    minWidth: 0,\n  }\n\n  const primaryStyle: CSSProperties = {\n    fontSize: config.fontSize,\n    fontWeight: 500,\n    color: 'var(--brycks-foreground-default)',\n    lineHeight: 1.4,\n  }\n\n  const secondaryStyle: CSSProperties = {\n    fontSize: config.secondarySize,\n    color: 'var(--brycks-foreground-muted)',\n    lineHeight: 1.4,\n  }\n\n  const elementStyle: CSSProperties = {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    flexShrink: 0,\n  }\n\n  return (\n    <li\n      ref={ref}\n      className={cx(\n        'brycks-list-item',\n        selected && 'brycks-list-item--selected',\n        clickable && 'brycks-list-item--clickable',\n        disabled && 'brycks-list-item--disabled',\n        className\n      )}\n      style={itemStyle}\n      onMouseEnter={(e) => {\n        if (clickable && !disabled && !selected) {\n          e.currentTarget.style.backgroundColor = 'var(--brycks-background-muted)'\n        }\n      }}\n      onMouseLeave={(e) => {\n        if (!selected) {\n          e.currentTarget.style.backgroundColor = 'transparent'\n        }\n      }}\n      {...props}\n    >\n      {leftElement && <span style={elementStyle}>{leftElement}</span>}\n      <div style={contentStyle}>\n        <span style={primaryStyle}>{children}</span>\n        {secondary && <span style={secondaryStyle}>{secondary}</span>}\n      </div>\n      {rightElement && <span style={elementStyle}>{rightElement}</span>}\n    </li>\n  )\n})\n\nListItem.displayName = 'ListItem'\n\n// ListDivider\nexport interface ListDividerProps extends HTMLAttributes<HTMLLIElement> {\n  /** Custom class name */\n  className?: string\n}\n\nexport const ListDivider = forwardRef<HTMLLIElement, ListDividerProps>(function ListDivider(\n  { className, style, ...props },\n  ref\n) {\n  const dividerStyle: CSSProperties = {\n    height: 1,\n    backgroundColor: 'var(--brycks-border-muted)',\n    margin: `${spacing[2]}px 0`,\n    ...style,\n  }\n\n  return (\n    <li\n      ref={ref}\n      role=\"separator\"\n      className={cx('brycks-list-divider', className)}\n      style={dividerStyle}\n      {...props}\n    />\n  )\n})\n\nListDivider.displayName = 'ListDivider'\n\n// ListHeader\nexport interface ListHeaderProps extends HTMLAttributes<HTMLLIElement> {\n  /** Custom class name */\n  className?: string\n}\n\nexport const ListHeader = forwardRef<HTMLLIElement, ListHeaderProps>(function ListHeader(\n  { className, style, children, ...props },\n  ref\n) {\n  const headerStyle: CSSProperties = {\n    padding: `${spacing[3]}px ${spacing[4]}px ${spacing[2]}px ${spacing[4]}px`,\n    fontSize: fontSizes.xs,\n    fontWeight: 600,\n    color: 'var(--brycks-foreground-muted)',\n    textTransform: 'uppercase',\n    letterSpacing: '0.05em',\n    ...style,\n  }\n\n  return (\n    <li\n      ref={ref}\n      className={cx('brycks-list-header', className)}\n      style={headerStyle}\n      {...props}\n    >\n      {children}\n    </li>\n  )\n})\n\nListHeader.displayName = 'ListHeader'\n"],"names":["ListContext","createContext","useListContext","useContext","List","forwardRef","size","variant","interactive","className","style","children","testId","props","ref","listStyle","spacing","jsx","cx","sizeConfig","componentPaddingY","componentPaddingX","fontSizes","componentGap","componentHeights","ListItem","leftElement","rightElement","secondary","selected","disabled","clickable","config","itemStyle","durations","easings","contentStyle","primaryStyle","secondaryStyle","elementStyle","jsxs","e","ListDivider","dividerStyle","ListHeader","headerStyle"],"mappings":"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"}
+{"version":3,"file":"List.cjs","sources":["../../../../src/components/data/List/List.tsx"],"sourcesContent":["/**\n * List Component\n *\n * A flexible list component for displaying items in a vertical layout.\n * Supports different sizes, icons, and interactive items.\n */\n\nimport {\n  forwardRef,\n  createContext,\n  type ReactNode,\n  type HTMLAttributes,\n} from 'react'\nimport { cx } from '../../../utils/styles'\n\nexport type ListSize = 'sm' | 'md' | 'lg'\nexport type ListVariant = 'default' | 'bordered' | 'separated'\n\ninterface ListContextValue {\n  size: ListSize\n  variant: ListVariant\n}\n\nconst ListContext = createContext<ListContextValue>({ size: 'md', variant: 'default' })\n\nexport interface ListProps extends HTMLAttributes<HTMLUListElement> {\n  /** List size */\n  size?: ListSize\n  /** List variant */\n  variant?: ListVariant\n  /** Whether list items are interactive */\n  interactive?: boolean\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\nexport const List = forwardRef<HTMLUListElement, ListProps>(function List(\n  {\n    size = 'md',\n    variant = 'default',\n    interactive = false,\n    className,\n    style,\n    children,\n    testId,\n    ...props\n  },\n  ref\n) {\n  return (\n    <ListContext.Provider value={{ size, variant }}>\n      <ul\n        ref={ref}\n        className={cx(\n          'brycks-list',\n          `brycks-list--${size}`,\n          `brycks-list--${variant}`,\n          interactive && 'brycks-list--interactive',\n          className\n        )}\n        style={style}\n        data-testid={testId}\n        {...props}\n      >\n        {children}\n      </ul>\n    </ListContext.Provider>\n  )\n})\n\nList.displayName = 'List'\n\n// ListItem\nexport interface ListItemProps extends HTMLAttributes<HTMLLIElement> {\n  /** Icon or avatar on the left */\n  leftElement?: ReactNode\n  /** Element on the right (badge, button, etc.) */\n  rightElement?: ReactNode\n  /** Secondary text below the main content */\n  secondary?: ReactNode\n  /** Whether the item is selected */\n  selected?: boolean\n  /** Whether the item is disabled */\n  disabled?: boolean\n  /** Whether the item is clickable */\n  clickable?: boolean\n  /** Custom class name */\n  className?: string\n}\n\nexport const ListItem = forwardRef<HTMLLIElement, ListItemProps>(function ListItem(\n  {\n    leftElement,\n    rightElement,\n    secondary,\n    selected = false,\n    disabled = false,\n    clickable = false,\n    className,\n    style,\n    children,\n    ...props\n  },\n  ref\n) {\n  // size/variant are provided via ListContext for API compatibility; the\n  // visual rules now live in CSS, scoped via the list's size/variant modifier,\n  // so the item itself no longer needs to read the context.\n  return (\n    <li\n      ref={ref}\n      className={cx(\n        'brycks-list-item',\n        selected && 'brycks-list-item--selected',\n        clickable && 'brycks-list-item--clickable',\n        disabled && 'brycks-list-item--disabled',\n        className\n      )}\n      style={style}\n      {...props}\n    >\n      {leftElement && <span className=\"brycks-list-item__element\">{leftElement}</span>}\n      <div className=\"brycks-list-item__content\">\n        <span className=\"brycks-list-item__primary\">{children}</span>\n        {secondary && <span className=\"brycks-list-item__secondary\">{secondary}</span>}\n      </div>\n      {rightElement && <span className=\"brycks-list-item__element\">{rightElement}</span>}\n    </li>\n  )\n})\n\nListItem.displayName = 'ListItem'\n\n// ListDivider\nexport interface ListDividerProps extends HTMLAttributes<HTMLLIElement> {\n  /** Custom class name */\n  className?: string\n}\n\nexport const ListDivider = forwardRef<HTMLLIElement, ListDividerProps>(function ListDivider(\n  { className, style, ...props },\n  ref\n) {\n  return (\n    <li\n      ref={ref}\n      role=\"separator\"\n      className={cx('brycks-list-divider', className)}\n      style={style}\n      {...props}\n    />\n  )\n})\n\nListDivider.displayName = 'ListDivider'\n\n// ListHeader\nexport interface ListHeaderProps extends HTMLAttributes<HTMLLIElement> {\n  /** Custom class name */\n  className?: string\n}\n\nexport const ListHeader = forwardRef<HTMLLIElement, ListHeaderProps>(function ListHeader(\n  { className, style, children, ...props },\n  ref\n) {\n  return (\n    <li\n      ref={ref}\n      className={cx('brycks-list-header', className)}\n      style={style}\n      {...props}\n    >\n      {children}\n    </li>\n  )\n})\n\nListHeader.displayName = 'ListHeader'\n"],"names":["ListContext","createContext","List","forwardRef","size","variant","interactive","className","style","children","testId","props","ref","jsx","cx","ListItem","leftElement","rightElement","secondary","selected","disabled","clickable","jsxs","ListDivider","ListHeader"],"mappings":"+KAuBMA,EAAcC,EAAAA,cAAgC,CAAE,KAAM,KAAM,QAAS,UAAW,EAezEC,EAAOC,EAAAA,WAAwC,SAC1D,CACE,KAAAC,EAAO,KACP,QAAAC,EAAU,UACV,YAAAC,EAAc,GACd,UAAAC,EACA,MAAAC,EACA,SAAAC,EACA,OAAAC,EACA,GAAGC,CACL,EACAC,EACA,CACA,OACEC,EAAAA,IAACb,EAAY,SAAZ,CAAqB,MAAO,CAAE,KAAAI,EAAM,QAAAC,GACnC,SAAAQ,EAAAA,IAAC,KAAA,CACC,IAAAD,EACA,UAAWE,EAAAA,GACT,cACA,gBAAgBV,CAAI,GACpB,gBAAgBC,CAAO,GACvBC,GAAe,2BACfC,CAAA,EAEF,MAAAC,EACA,cAAaE,EACZ,GAAGC,EAEH,SAAAF,CAAA,CAAA,EAEL,CAEJ,CAAC,EAEDP,EAAK,YAAc,OAoBZ,MAAMa,EAAWZ,EAAAA,WAAyC,SAC/D,CACE,YAAAa,EACA,aAAAC,EACA,UAAAC,EACA,SAAAC,EAAW,GACX,SAAAC,EAAW,GACX,UAAAC,EAAY,GACZ,UAAAd,EACA,MAAAC,EACA,SAAAC,EACA,GAAGE,CACL,EACAC,EACA,CAIA,OACEU,EAAAA,KAAC,KAAA,CACC,IAAAV,EACA,UAAWE,EAAAA,GACT,mBACAK,GAAY,6BACZE,GAAa,8BACbD,GAAY,6BACZb,CAAA,EAEF,MAAAC,EACC,GAAGG,EAEH,SAAA,CAAAK,GAAeH,EAAAA,IAAC,OAAA,CAAK,UAAU,4BAA6B,SAAAG,EAAY,EACzEM,EAAAA,KAAC,MAAA,CAAI,UAAU,4BACb,SAAA,CAAAT,EAAAA,IAAC,OAAA,CAAK,UAAU,4BAA6B,SAAAJ,CAAA,CAAS,EACrDS,GAAaL,EAAAA,IAAC,OAAA,CAAK,UAAU,8BAA+B,SAAAK,CAAA,CAAU,CAAA,EACzE,EACCD,GAAgBJ,EAAAA,IAAC,OAAA,CAAK,UAAU,4BAA6B,SAAAI,CAAA,CAAa,CAAA,CAAA,CAAA,CAGjF,CAAC,EAEDF,EAAS,YAAc,WAQhB,MAAMQ,EAAcpB,EAAAA,WAA4C,SACrE,CAAE,UAAAI,EAAW,MAAAC,EAAO,GAAGG,CAAA,EACvBC,EACA,CACA,OACEC,EAAAA,IAAC,KAAA,CACC,IAAAD,EACA,KAAK,YACL,UAAWE,EAAAA,GAAG,sBAAuBP,CAAS,EAC9C,MAAAC,EACC,GAAGG,CAAA,CAAA,CAGV,CAAC,EAEDY,EAAY,YAAc,cAQnB,MAAMC,EAAarB,EAAAA,WAA2C,SACnE,CAAE,UAAAI,EAAW,MAAAC,EAAO,SAAAC,EAAU,GAAGE,CAAA,EACjCC,EACA,CACA,OACEC,EAAAA,IAAC,KAAA,CACC,IAAAD,EACA,UAAWE,EAAAA,GAAG,qBAAsBP,CAAS,EAC7C,MAAAC,EACC,GAAGG,EAEH,SAAAF,CAAA,CAAA,CAGP,CAAC,EAEDe,EAAW,YAAc"}

package/dist/components/data/List/List.js

@@ -1,182 +1,102 @@
-import { jsx as n, jsxs as S } from "react/jsx-runtime";
-import { forwardRef as p, createContext as I, useContext as X } from "react";
-import { cx as y } from "../../../utils/styles.js";
-import { spacing as s } from "../../../design-system/tokens/spacing.js";
-import { durations as Y, easings as j } from "../../../design-system/tokens/motion.js";
-import { fontSizes as a } from "../../../design-system/tokens/typography.js";
-import { componentPaddingX as c, componentGap as h, componentHeights as w, componentPaddingY as P } from "../../../design-system/primitives/sizing.js";
-const L = I({ size: "md", variant: "default" });
-function R() {
-  return X(L);
-}
-const T = p(function({
-  size: i = "md",
+import { jsx as t, jsxs as b } from "react/jsx-runtime";
+import { forwardRef as l, createContext as p } from "react";
+import { cx as c } from "../../../utils/styles.js";
+const L = p({ size: "md", variant: "default" }), N = l(function({
+  size: s = "md",
   variant: e = "default",
-  interactive: o = !1,
-  className: t,
-  style: r,
-  children: d,
-  testId: f,
-  ...u
-}, b) {
-  const x = {
-    listStyle: "none",
-    margin: 0,
-    padding: 0,
-    display: "flex",
-    flexDirection: "column",
-    gap: e === "separated" ? s[2] : 0,
-    border: e === "bordered" ? "1px solid var(--brycks-border-default)" : void 0,
-    borderRadius: e === "bordered" ? "var(--brycks-radius-lg)" : void 0,
-    overflow: e === "bordered" ? "hidden" : void 0,
-    ...r
-  };
-  return /* @__PURE__ */ n(L.Provider, { value: { size: i, variant: e }, children: /* @__PURE__ */ n(
+  interactive: i = !1,
+  className: r,
+  style: a,
+  children: n,
+  testId: d,
+  ...o
+}, y) {
+  return /* @__PURE__ */ t(L.Provider, { value: { size: s, variant: e }, children: /* @__PURE__ */ t(
     "ul",
     {
-      ref: b,
-      className: y(
+      ref: y,
+      className: c(
         "brycks-list",
-        `brycks-list--${i}`,
+        `brycks-list--${s}`,
         `brycks-list--${e}`,
-        o && "brycks-list--interactive",
-        t
+        i && "brycks-list--interactive",
+        r
       ),
-      style: x,
-      "data-testid": f,
-      ...u,
-      children: d
+      style: a,
+      "data-testid": d,
+      ...o,
+      children: n
     }
   ) });
 });
-T.displayName = "List";
-const W = {
-  sm: { paddingY: P.md, paddingX: c.sm, fontSize: a.base - 1, secondarySize: a.sm, gap: h.lg, minHeight: w.md },
-  md: { paddingY: c.sm, paddingX: c.md, fontSize: a.base, secondarySize: a.base - 1, gap: h.xl, minHeight: 52 },
-  lg: { paddingY: c.md, paddingX: c.lg, fontSize: a.md, secondarySize: a.base, gap: s[3.5], minHeight: s[16] }
-}, M = p(function({
-  leftElement: i,
+N.displayName = "List";
+const u = l(function({
+  leftElement: s,
   rightElement: e,
-  secondary: o,
-  selected: t = !1,
-  disabled: r = !1,
-  clickable: d = !1,
-  className: f,
-  style: u,
-  children: b,
-  ...x
-}, z) {
-  const { size: H, variant: m } = R(), l = W[H], $ = {
-    display: "flex",
-    alignItems: "center",
-    gap: l.gap,
-    padding: `${l.paddingY}px ${l.paddingX}px`,
-    minHeight: l.minHeight,
-    backgroundColor: t ? "var(--brycks-primary-muted)" : "transparent",
-    borderBottom: m === "default" || m === "bordered" ? "1px solid var(--brycks-border-muted)" : void 0,
-    border: m === "separated" ? "1px solid var(--brycks-border-default)" : void 0,
-    borderRadius: m === "separated" ? "var(--brycks-radius-lg)" : void 0,
-    cursor: r ? "not-allowed" : d ? "pointer" : void 0,
-    opacity: r ? 0.5 : 1,
-    transition: `background-color ${Y.quick}ms ${j.easeOut}`,
-    ...u
-  }, C = {
-    flex: 1,
-    display: "flex",
-    flexDirection: "column",
-    gap: s[0.5],
-    minWidth: 0
-  }, N = {
-    fontSize: l.fontSize,
-    fontWeight: 500,
-    color: "var(--brycks-foreground-default)",
-    lineHeight: 1.4
-  }, D = {
-    fontSize: l.secondarySize,
-    color: "var(--brycks-foreground-muted)",
-    lineHeight: 1.4
-  }, v = {
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    flexShrink: 0
-  };
-  return /* @__PURE__ */ S(
+  secondary: i,
+  selected: r = !1,
+  disabled: a = !1,
+  clickable: n = !1,
+  className: d,
+  style: o,
+  children: y,
+  ...k
+}, f) {
+  return /* @__PURE__ */ b(
     "li",
     {
-      ref: z,
-      className: y(
+      ref: f,
+      className: c(
         "brycks-list-item",
-        t && "brycks-list-item--selected",
-        d && "brycks-list-item--clickable",
-        r && "brycks-list-item--disabled",
-        f
+        r && "brycks-list-item--selected",
+        n && "brycks-list-item--clickable",
+        a && "brycks-list-item--disabled",
+        d
       ),
-      style: $,
-      onMouseEnter: (k) => {
-        d && !r && !t && (k.currentTarget.style.backgroundColor = "var(--brycks-background-muted)");
-      },
-      onMouseLeave: (k) => {
-        t || (k.currentTarget.style.backgroundColor = "transparent");
-      },
-      ...x,
+      style: o,
+      ...k,
       children: [
-        i && /* @__PURE__ */ n("span", { style: v, children: i }),
-        /* @__PURE__ */ S("div", { style: C, children: [
-          /* @__PURE__ */ n("span", { style: N, children: b }),
-          o && /* @__PURE__ */ n("span", { style: D, children: o })
+        s && /* @__PURE__ */ t("span", { className: "brycks-list-item__element", children: s }),
+        /* @__PURE__ */ b("div", { className: "brycks-list-item__content", children: [
+          /* @__PURE__ */ t("span", { className: "brycks-list-item__primary", children: y }),
+          i && /* @__PURE__ */ t("span", { className: "brycks-list-item__secondary", children: i })
         ] }),
-        e && /* @__PURE__ */ n("span", { style: v, children: e })
+        e && /* @__PURE__ */ t("span", { className: "brycks-list-item__element", children: e })
       ]
     }
   );
 });
-M.displayName = "ListItem";
-const q = p(function({ className: i, style: e, ...o }, t) {
-  const r = {
-    height: 1,
-    backgroundColor: "var(--brycks-border-muted)",
-    margin: `${s[2]}px 0`,
-    ...e
-  };
-  return /* @__PURE__ */ n(
+u.displayName = "ListItem";
+const _ = l(function({ className: s, style: e, ...i }, r) {
+  return /* @__PURE__ */ t(
     "li",
     {
-      ref: t,
+      ref: r,
       role: "separator",
-      className: y("brycks-list-divider", i),
-      style: r,
-      ...o
+      className: c("brycks-list-divider", s),
+      style: e,
+      ...i
     }
   );
 });
-q.displayName = "ListDivider";
-const B = p(function({ className: i, style: e, children: o, ...t }, r) {
-  const d = {
-    padding: `${s[3]}px ${s[4]}px ${s[2]}px ${s[4]}px`,
-    fontSize: a.xs,
-    fontWeight: 600,
-    color: "var(--brycks-foreground-muted)",
-    textTransform: "uppercase",
-    letterSpacing: "0.05em",
-    ...e
-  };
-  return /* @__PURE__ */ n(
+_.displayName = "ListDivider";
+const v = l(function({ className: s, style: e, children: i, ...r }, a) {
+  return /* @__PURE__ */ t(
     "li",
     {
-      ref: r,
-      className: y("brycks-list-header", i),
-      style: d,
-      ...t,
-      children: o
+      ref: a,
+      className: c("brycks-list-header", s),
+      style: e,
+      ...r,
+      children: i
     }
   );
 });
-B.displayName = "ListHeader";
+v.displayName = "ListHeader";
 export {
-  T as List,
-  q as ListDivider,
-  B as ListHeader,
-  M as ListItem
+  N as List,
+  _ as ListDivider,
+  v as ListHeader,
+  u as ListItem
 };
 //# sourceMappingURL=List.js.map

package/dist/components/data/List/List.js.map

@@ -1 +1 @@
-{"version":3,"file":"List.js","sources":["../../../../src/components/data/List/List.tsx"],"sourcesContent":["/**\n * List Component\n *\n * A flexible list component for displaying items in a vertical layout.\n * Supports different sizes, icons, and interactive items.\n */\n\nimport {\n  forwardRef,\n  createContext,\n  useContext,\n  type CSSProperties,\n  type ReactNode,\n  type HTMLAttributes,\n} from 'react'\nimport { cx } from '../../../utils/styles'\nimport { spacing, fontSizes, durations, easings } from '../../../design-system'\nimport { componentHeights, componentGap, componentPaddingX, componentPaddingY } from '../../../design-system/primitives'\n\nexport type ListSize = 'sm' | 'md' | 'lg'\nexport type ListVariant = 'default' | 'bordered' | 'separated'\n\ninterface ListContextValue {\n  size: ListSize\n  variant: ListVariant\n}\n\nconst ListContext = createContext<ListContextValue>({ size: 'md', variant: 'default' })\n\nfunction useListContext() {\n  return useContext(ListContext)\n}\n\nexport interface ListProps extends HTMLAttributes<HTMLUListElement> {\n  /** List size */\n  size?: ListSize\n  /** List variant */\n  variant?: ListVariant\n  /** Whether list items are interactive */\n  interactive?: boolean\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\nexport const List = forwardRef<HTMLUListElement, ListProps>(function List(\n  {\n    size = 'md',\n    variant = 'default',\n    interactive = false,\n    className,\n    style,\n    children,\n    testId,\n    ...props\n  },\n  ref\n) {\n  const listStyle: CSSProperties = {\n    listStyle: 'none',\n    margin: 0,\n    padding: 0,\n    display: 'flex',\n    flexDirection: 'column',\n    gap: variant === 'separated' ? spacing[2] : 0,\n    border: variant === 'bordered' ? '1px solid var(--brycks-border-default)' : undefined,\n    borderRadius: variant === 'bordered' ? 'var(--brycks-radius-lg)' : undefined,\n    overflow: variant === 'bordered' ? 'hidden' : undefined,\n    ...style,\n  }\n\n  return (\n    <ListContext.Provider value={{ size, variant }}>\n      <ul\n        ref={ref}\n        className={cx(\n          'brycks-list',\n          `brycks-list--${size}`,\n          `brycks-list--${variant}`,\n          interactive && 'brycks-list--interactive',\n          className\n        )}\n        style={listStyle}\n        data-testid={testId}\n        {...props}\n      >\n        {children}\n      </ul>\n    </ListContext.Provider>\n  )\n})\n\nList.displayName = 'List'\n\n// ListItem\nexport interface ListItemProps extends HTMLAttributes<HTMLLIElement> {\n  /** Icon or avatar on the left */\n  leftElement?: ReactNode\n  /** Element on the right (badge, button, etc.) */\n  rightElement?: ReactNode\n  /** Secondary text below the main content */\n  secondary?: ReactNode\n  /** Whether the item is selected */\n  selected?: boolean\n  /** Whether the item is disabled */\n  disabled?: boolean\n  /** Whether the item is clickable */\n  clickable?: boolean\n  /** Custom class name */\n  className?: string\n}\n\nconst sizeConfig: Record<ListSize, { paddingX: number; paddingY: number; fontSize: number; secondarySize: number; gap: number; minHeight: number }> = {\n  sm: { paddingY: componentPaddingY.md, paddingX: componentPaddingX.sm, fontSize: fontSizes.base - 1, secondarySize: fontSizes.sm, gap: componentGap.lg, minHeight: componentHeights.md },\n  md: { paddingY: componentPaddingX.sm, paddingX: componentPaddingX.md, fontSize: fontSizes.base, secondarySize: fontSizes.base - 1, gap: componentGap.xl, minHeight: 52 },\n  lg: { paddingY: componentPaddingX.md, paddingX: componentPaddingX.lg, fontSize: fontSizes.md, secondarySize: fontSizes.base, gap: spacing[3.5], minHeight: spacing[16] },\n}\n\nexport const ListItem = forwardRef<HTMLLIElement, ListItemProps>(function ListItem(\n  {\n    leftElement,\n    rightElement,\n    secondary,\n    selected = false,\n    disabled = false,\n    clickable = false,\n    className,\n    style,\n    children,\n    ...props\n  },\n  ref\n) {\n  const { size, variant } = useListContext()\n  const config = sizeConfig[size]\n\n  const itemStyle: CSSProperties = {\n    display: 'flex',\n    alignItems: 'center',\n    gap: config.gap,\n    padding: `${config.paddingY}px ${config.paddingX}px`,\n    minHeight: config.minHeight,\n    backgroundColor: selected\n      ? 'var(--brycks-primary-muted)'\n      : 'transparent',\n    borderBottom: variant === 'default' || variant === 'bordered'\n      ? '1px solid var(--brycks-border-muted)'\n      : undefined,\n    border: variant === 'separated' ? '1px solid var(--brycks-border-default)' : undefined,\n    borderRadius: variant === 'separated' ? 'var(--brycks-radius-lg)' : undefined,\n    cursor: disabled ? 'not-allowed' : clickable ? 'pointer' : undefined,\n    opacity: disabled ? 0.5 : 1,\n    transition: `background-color ${durations.quick}ms ${easings.easeOut}`,\n    ...style,\n  }\n\n  const contentStyle: CSSProperties = {\n    flex: 1,\n    display: 'flex',\n    flexDirection: 'column',\n    gap: spacing[0.5],\n    minWidth: 0,\n  }\n\n  const primaryStyle: CSSProperties = {\n    fontSize: config.fontSize,\n    fontWeight: 500,\n    color: 'var(--brycks-foreground-default)',\n    lineHeight: 1.4,\n  }\n\n  const secondaryStyle: CSSProperties = {\n    fontSize: config.secondarySize,\n    color: 'var(--brycks-foreground-muted)',\n    lineHeight: 1.4,\n  }\n\n  const elementStyle: CSSProperties = {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    flexShrink: 0,\n  }\n\n  return (\n    <li\n      ref={ref}\n      className={cx(\n        'brycks-list-item',\n        selected && 'brycks-list-item--selected',\n        clickable && 'brycks-list-item--clickable',\n        disabled && 'brycks-list-item--disabled',\n        className\n      )}\n      style={itemStyle}\n      onMouseEnter={(e) => {\n        if (clickable && !disabled && !selected) {\n          e.currentTarget.style.backgroundColor = 'var(--brycks-background-muted)'\n        }\n      }}\n      onMouseLeave={(e) => {\n        if (!selected) {\n          e.currentTarget.style.backgroundColor = 'transparent'\n        }\n      }}\n      {...props}\n    >\n      {leftElement && <span style={elementStyle}>{leftElement}</span>}\n      <div style={contentStyle}>\n        <span style={primaryStyle}>{children}</span>\n        {secondary && <span style={secondaryStyle}>{secondary}</span>}\n      </div>\n      {rightElement && <span style={elementStyle}>{rightElement}</span>}\n    </li>\n  )\n})\n\nListItem.displayName = 'ListItem'\n\n// ListDivider\nexport interface ListDividerProps extends HTMLAttributes<HTMLLIElement> {\n  /** Custom class name */\n  className?: string\n}\n\nexport const ListDivider = forwardRef<HTMLLIElement, ListDividerProps>(function ListDivider(\n  { className, style, ...props },\n  ref\n) {\n  const dividerStyle: CSSProperties = {\n    height: 1,\n    backgroundColor: 'var(--brycks-border-muted)',\n    margin: `${spacing[2]}px 0`,\n    ...style,\n  }\n\n  return (\n    <li\n      ref={ref}\n      role=\"separator\"\n      className={cx('brycks-list-divider', className)}\n      style={dividerStyle}\n      {...props}\n    />\n  )\n})\n\nListDivider.displayName = 'ListDivider'\n\n// ListHeader\nexport interface ListHeaderProps extends HTMLAttributes<HTMLLIElement> {\n  /** Custom class name */\n  className?: string\n}\n\nexport const ListHeader = forwardRef<HTMLLIElement, ListHeaderProps>(function ListHeader(\n  { className, style, children, ...props },\n  ref\n) {\n  const headerStyle: CSSProperties = {\n    padding: `${spacing[3]}px ${spacing[4]}px ${spacing[2]}px ${spacing[4]}px`,\n    fontSize: fontSizes.xs,\n    fontWeight: 600,\n    color: 'var(--brycks-foreground-muted)',\n    textTransform: 'uppercase',\n    letterSpacing: '0.05em',\n    ...style,\n  }\n\n  return (\n    <li\n      ref={ref}\n      className={cx('brycks-list-header', className)}\n      style={headerStyle}\n      {...props}\n    >\n      {children}\n    </li>\n  )\n})\n\nListHeader.displayName = 'ListHeader'\n"],"names":["ListContext","createContext","useListContext","useContext","List","forwardRef","size","variant","interactive","className","style","children","testId","props","ref","listStyle","spacing","jsx","cx","sizeConfig","componentPaddingY","componentPaddingX","fontSizes","componentGap","componentHeights","ListItem","leftElement","rightElement","secondary","selected","disabled","clickable","config","itemStyle","durations","easings","contentStyle","primaryStyle","secondaryStyle","elementStyle","jsxs","e","ListDivider","dividerStyle","ListHeader","headerStyle"],"mappings":"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"}
+{"version":3,"file":"List.js","sources":["../../../../src/components/data/List/List.tsx"],"sourcesContent":["/**\n * List Component\n *\n * A flexible list component for displaying items in a vertical layout.\n * Supports different sizes, icons, and interactive items.\n */\n\nimport {\n  forwardRef,\n  createContext,\n  type ReactNode,\n  type HTMLAttributes,\n} from 'react'\nimport { cx } from '../../../utils/styles'\n\nexport type ListSize = 'sm' | 'md' | 'lg'\nexport type ListVariant = 'default' | 'bordered' | 'separated'\n\ninterface ListContextValue {\n  size: ListSize\n  variant: ListVariant\n}\n\nconst ListContext = createContext<ListContextValue>({ size: 'md', variant: 'default' })\n\nexport interface ListProps extends HTMLAttributes<HTMLUListElement> {\n  /** List size */\n  size?: ListSize\n  /** List variant */\n  variant?: ListVariant\n  /** Whether list items are interactive */\n  interactive?: boolean\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\nexport const List = forwardRef<HTMLUListElement, ListProps>(function List(\n  {\n    size = 'md',\n    variant = 'default',\n    interactive = false,\n    className,\n    style,\n    children,\n    testId,\n    ...props\n  },\n  ref\n) {\n  return (\n    <ListContext.Provider value={{ size, variant }}>\n      <ul\n        ref={ref}\n        className={cx(\n          'brycks-list',\n          `brycks-list--${size}`,\n          `brycks-list--${variant}`,\n          interactive && 'brycks-list--interactive',\n          className\n        )}\n        style={style}\n        data-testid={testId}\n        {...props}\n      >\n        {children}\n      </ul>\n    </ListContext.Provider>\n  )\n})\n\nList.displayName = 'List'\n\n// ListItem\nexport interface ListItemProps extends HTMLAttributes<HTMLLIElement> {\n  /** Icon or avatar on the left */\n  leftElement?: ReactNode\n  /** Element on the right (badge, button, etc.) */\n  rightElement?: ReactNode\n  /** Secondary text below the main content */\n  secondary?: ReactNode\n  /** Whether the item is selected */\n  selected?: boolean\n  /** Whether the item is disabled */\n  disabled?: boolean\n  /** Whether the item is clickable */\n  clickable?: boolean\n  /** Custom class name */\n  className?: string\n}\n\nexport const ListItem = forwardRef<HTMLLIElement, ListItemProps>(function ListItem(\n  {\n    leftElement,\n    rightElement,\n    secondary,\n    selected = false,\n    disabled = false,\n    clickable = false,\n    className,\n    style,\n    children,\n    ...props\n  },\n  ref\n) {\n  // size/variant are provided via ListContext for API compatibility; the\n  // visual rules now live in CSS, scoped via the list's size/variant modifier,\n  // so the item itself no longer needs to read the context.\n  return (\n    <li\n      ref={ref}\n      className={cx(\n        'brycks-list-item',\n        selected && 'brycks-list-item--selected',\n        clickable && 'brycks-list-item--clickable',\n        disabled && 'brycks-list-item--disabled',\n        className\n      )}\n      style={style}\n      {...props}\n    >\n      {leftElement && <span className=\"brycks-list-item__element\">{leftElement}</span>}\n      <div className=\"brycks-list-item__content\">\n        <span className=\"brycks-list-item__primary\">{children}</span>\n        {secondary && <span className=\"brycks-list-item__secondary\">{secondary}</span>}\n      </div>\n      {rightElement && <span className=\"brycks-list-item__element\">{rightElement}</span>}\n    </li>\n  )\n})\n\nListItem.displayName = 'ListItem'\n\n// ListDivider\nexport interface ListDividerProps extends HTMLAttributes<HTMLLIElement> {\n  /** Custom class name */\n  className?: string\n}\n\nexport const ListDivider = forwardRef<HTMLLIElement, ListDividerProps>(function ListDivider(\n  { className, style, ...props },\n  ref\n) {\n  return (\n    <li\n      ref={ref}\n      role=\"separator\"\n      className={cx('brycks-list-divider', className)}\n      style={style}\n      {...props}\n    />\n  )\n})\n\nListDivider.displayName = 'ListDivider'\n\n// ListHeader\nexport interface ListHeaderProps extends HTMLAttributes<HTMLLIElement> {\n  /** Custom class name */\n  className?: string\n}\n\nexport const ListHeader = forwardRef<HTMLLIElement, ListHeaderProps>(function ListHeader(\n  { className, style, children, ...props },\n  ref\n) {\n  return (\n    <li\n      ref={ref}\n      className={cx('brycks-list-header', className)}\n      style={style}\n      {...props}\n    >\n      {children}\n    </li>\n  )\n})\n\nListHeader.displayName = 'ListHeader'\n"],"names":["ListContext","createContext","List","forwardRef","size","variant","interactive","className","style","children","testId","props","ref","jsx","cx","ListItem","leftElement","rightElement","secondary","selected","disabled","clickable","jsxs","ListDivider","ListHeader"],"mappings":";;;AAuBA,MAAMA,IAAcC,EAAgC,EAAE,MAAM,MAAM,SAAS,WAAW,GAezEC,IAAOC,EAAwC,SAC1D;AAAA,EACE,MAAAC,IAAO;AAAA,EACP,SAAAC,IAAU;AAAA,EACV,aAAAC,IAAc;AAAA,EACd,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,SACE,gBAAAC,EAACb,EAAY,UAAZ,EAAqB,OAAO,EAAE,MAAAI,GAAM,SAAAC,KACnC,UAAA,gBAAAQ;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,WAAWE;AAAA,QACT;AAAA,QACA,gBAAgBV,CAAI;AAAA,QACpB,gBAAgBC,CAAO;AAAA,QACvBC,KAAe;AAAA,QACfC;AAAA,MAAA;AAAA,MAEF,OAAAC;AAAA,MACA,eAAaE;AAAA,MACZ,GAAGC;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA,GAEL;AAEJ,CAAC;AAEDP,EAAK,cAAc;AAoBZ,MAAMa,IAAWZ,EAAyC,SAC/D;AAAA,EACE,aAAAa;AAAA,EACA,cAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,WAAAd;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGE;AACL,GACAC,GACA;AAIA,SACE,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAV;AAAA,MACA,WAAWE;AAAA,QACT;AAAA,QACAK,KAAY;AAAA,QACZE,KAAa;AAAA,QACbD,KAAY;AAAA,QACZb;AAAA,MAAA;AAAA,MAEF,OAAAC;AAAA,MACC,GAAGG;AAAA,MAEH,UAAA;AAAA,QAAAK,KAAe,gBAAAH,EAAC,QAAA,EAAK,WAAU,6BAA6B,UAAAG,GAAY;AAAA,QACzE,gBAAAM,EAAC,OAAA,EAAI,WAAU,6BACb,UAAA;AAAA,UAAA,gBAAAT,EAAC,QAAA,EAAK,WAAU,6BAA6B,UAAAJ,EAAA,CAAS;AAAA,UACrDS,KAAa,gBAAAL,EAAC,QAAA,EAAK,WAAU,+BAA+B,UAAAK,EAAA,CAAU;AAAA,QAAA,GACzE;AAAA,QACCD,KAAgB,gBAAAJ,EAAC,QAAA,EAAK,WAAU,6BAA6B,UAAAI,EAAA,CAAa;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGjF,CAAC;AAEDF,EAAS,cAAc;AAQhB,MAAMQ,IAAcpB,EAA4C,SACrE,EAAE,WAAAI,GAAW,OAAAC,GAAO,GAAGG,EAAA,GACvBC,GACA;AACA,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,MAAK;AAAA,MACL,WAAWE,EAAG,uBAAuBP,CAAS;AAAA,MAC9C,OAAAC;AAAA,MACC,GAAGG;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;AAEDY,EAAY,cAAc;AAQnB,MAAMC,IAAarB,EAA2C,SACnE,EAAE,WAAAI,GAAW,OAAAC,GAAO,UAAAC,GAAU,GAAGE,EAAA,GACjCC,GACA;AACA,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,WAAWE,EAAG,sBAAsBP,CAAS;AAAA,MAC7C,OAAAC;AAAA,MACC,GAAGG;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;AAEDe,EAAW,cAAc;"}

package/dist/components/data/Table/Table.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),b=require("react"),u=require("../../../utils/styles.cjs"),M=require("../../utility/EmptyState/EmptyState.cjs"),B=require("../../utility/Skeleton/Skeleton.cjs"),g=require("../../../design-system/tokens/motion.cjs"),c=require("../../../design-system/primitives/sizing.cjs"),T=require("../../../design-system/tokens/spacing.cjs"),m=require("../../../design-system/tokens/typography.cjs"),N=b.createContext({size:"md",variant:"default",stickyHeader:!1});function x(){return b.useContext(N)}const v={sm:{fontSize:m.fontSizes.base-1,paddingY:c.componentPaddingY.md,paddingX:c.componentPaddingX.sm,headerPaddingY:c.componentPaddingY.md,headerPaddingX:c.componentPaddingX.sm},md:{fontSize:m.fontSizes.base,paddingY:c.componentPaddingX.sm,paddingX:c.componentPaddingX.md,headerPaddingY:c.componentPaddingX.sm,headerPaddingX:c.componentPaddingX.md},lg:{fontSize:m.fontSizes.base+1,paddingY:c.componentPaddingX.md,paddingX:c.componentPaddingX.lg,headerPaddingY:T.spacing[3.5],headerPaddingX:c.componentPaddingX.lg}},P=b.forwardRef(function({size:a="md",variant:e="default",stickyHeader:s=!1,loading:o=!1,className:n,style:r,children:d,testId:l,...p},y){const f={position:"relative",width:"100%",overflow:"auto",...r},h={width:"100%",borderCollapse:e==="bordered"?"separate":"collapse",borderSpacing:0,fontSize:v[a].fontSize,fontVariantNumeric:"tabular-nums",opacity:o?.6:1,transition:`opacity ${g.durations.quick}ms ${g.easings.easeOut}`};return t.jsx(N.Provider,{value:{size:a,variant:e,stickyHeader:s},children:t.jsx("div",{className:"brycks-table-container",style:f,children:t.jsx("table",{ref:y,className:u.cx("brycks-table",`brycks-table--${a}`,`brycks-table--${e}`,n),style:h,"aria-busy":o||void 0,"data-testid":l,...p,children:d})})})});P.displayName="Table";const X=b.forwardRef(function({sticky:a=!1,className:e,style:s,children:o,...n},r){const{stickyHeader:d}=x(),l=a||d,p={backgroundColor:"var(--brycks-background-muted)",position:l?"sticky":void 0,top:l?0:void 0,zIndex:l?1:void 0,...s};return t.jsx("thead",{ref:r,className:u.cx("brycks-table-head",l&&"brycks-table-head--sticky",e),style:p,...n,children:o})});X.displayName="TableHead";const R=b.forwardRef(function({className:a,style:e,children:s,...o},n){const r={...e};return t.jsx("tbody",{ref:n,className:u.cx("brycks-table-body",a),style:r,...o,children:s})});R.displayName="TableBody";const S=b.forwardRef(function({selected:a=!1,clickable:e=!1,className:s,style:o,children:n,...r},d){const{variant:l}=x(),p={backgroundColor:a?"var(--brycks-primary-muted)":"transparent",borderBottom:l!=="bordered"?"1px solid var(--brycks-border-muted)":void 0,cursor:e?"pointer":void 0,transition:`background-color ${g.durations.quick}ms ${g.easings.easeOut}`,...o};return t.jsx("tr",{ref:d,className:u.cx("brycks-table-row",a&&"brycks-table-row--selected",e&&"brycks-table-row--clickable",s),style:p,onMouseEnter:y=>{e&&!a&&(y.currentTarget.style.backgroundColor="var(--brycks-background-muted)")},onMouseLeave:y=>{a||(y.currentTarget.style.backgroundColor="transparent")},...r,children:n})});S.displayName="TableRow";function E({direction:i}){return i?t.jsx("svg",{width:"14",height:"14",viewBox:"0 0 14 14",fill:"none","aria-hidden":"true",children:i==="asc"?t.jsx("path",{d:"M7 3L10 6H4L7 3Z",fill:"currentColor"}):t.jsx("path",{d:"M7 11L4 8H10L7 11Z",fill:"currentColor"})}):t.jsxs("svg",{width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",style:{opacity:.4},"aria-hidden":"true",children:[t.jsx("path",{d:"M7 3L10 6H4L7 3Z",fill:"currentColor"}),t.jsx("path",{d:"M7 11L4 8H10L7 11Z",fill:"currentColor"})]})}const z=b.forwardRef(function({sortable:a=!1,sortDirection:e=null,onSort:s,align:o="left",className:n,style:r,children:d,...l},p){const{size:y}=x(),f=v[y],h={padding:`${f.headerPaddingY}px ${f.headerPaddingX}px`,fontWeight:600,color:"var(--brycks-foreground-muted)",textAlign:o,whiteSpace:"nowrap",transition:`color ${g.durations.quick}ms ${g.easings.easeOut}`,...r},j={display:"flex",alignItems:"center",gap:c.componentGap.sm,justifyContent:o==="right"?"flex-end":o==="center"?"center":"flex-start"},Y={...j,width:"100%",padding:0,background:"transparent",border:"none",font:"inherit",fontWeight:"inherit",color:"inherit",cursor:"pointer",userSelect:"none"};return t.jsx("th",{ref:p,"aria-sort":a?e==="asc"?"ascending":e==="desc"?"descending":"none":void 0,className:u.cx("brycks-table-header",a&&"brycks-table-header--sortable",n),style:h,...l,children:a?t.jsxs("button",{type:"button",style:Y,onClick:()=>s?.(),onMouseEnter:k=>{k.currentTarget.style.color="var(--brycks-foreground-default)"},onMouseLeave:k=>{k.currentTarget.style.color="inherit"},children:[d,t.jsx(E,{direction:e})]}):t.jsx("span",{style:j,children:d})})});z.displayName="TableHeader";const w=b.forwardRef(function({align:a="left",truncate:e=!1,className:s,style:o,children:n,...r},d){const{size:l,variant:p}=x(),y=v[l],f={padding:`${y.paddingY}px ${y.paddingX}px`,color:"var(--brycks-foreground-default)",textAlign:a,verticalAlign:"middle",border:p==="bordered"?"1px solid var(--brycks-border-muted)":void 0,maxWidth:e?200:void 0,overflow:e?"hidden":void 0,textOverflow:e?"ellipsis":void 0,whiteSpace:e?"nowrap":void 0,...o};return t.jsx("td",{ref:d,className:u.cx("brycks-table-cell",e&&"brycks-table-cell--truncate",s),style:f,title:e&&typeof n=="string"?n:void 0,...r,children:n})});w.displayName="TableCell";const H=b.forwardRef(function({className:a,style:e,children:s,...o},n){const r={backgroundColor:"var(--brycks-background-muted)",fontWeight:500,...e};return t.jsx("tfoot",{ref:n,className:u.cx("brycks-table-foot",a),style:r,...o,children:s})});H.displayName="TableFoot";const $=b.forwardRef(function({placement:a="bottom",className:e,style:s,children:o,...n},r){const d={captionSide:a,padding:`${T.spacing[3]}px ${T.spacing[4]}px`,fontSize:m.fontSizes.base-1,color:"var(--brycks-foreground-muted)",textAlign:"left",...s};return t.jsx("caption",{ref:r,className:u.cx("brycks-table-caption",e),style:d,...n,children:o})});$.displayName="TableCaption";const q=b.forwardRef(function({colSpan:a,icon:e,title:s,description:o,action:n,className:r},d){return t.jsx("tr",{ref:d,className:u.cx("brycks-table-empty",r),children:t.jsx("td",{colSpan:a,style:{padding:0},children:t.jsx(M.EmptyState,{icon:e,title:s,description:o,action:n})})})});q.displayName="TableEmpty";const C=["70%","45%","85%","55%","60%","40%"];function L({rows:i=5,columns:a,className:e}){return t.jsx(t.Fragment,{children:Array.from({length:i}).map((s,o)=>t.jsx(S,{className:u.cx("brycks-table-skeleton-row",e),"aria-hidden":"true",children:Array.from({length:a}).map((n,r)=>t.jsx(w,{children:t.jsx(B.Skeleton,{variant:"text",width:C[r%C.length]})},r))},o))})}L.displayName="TableSkeleton";exports.Table=P;exports.TableBody=R;exports.TableCaption=$;exports.TableCell=w;exports.TableEmpty=q;exports.TableFoot=H;exports.TableHead=X;exports.TableHeader=z;exports.TableRow=S;exports.TableSkeleton=L;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("react"),b=require("../../../utils/styles.cjs"),S=require("../../utility/EmptyState/EmptyState.cjs"),H=require("../../utility/Skeleton/Skeleton.cjs"),p=i.createContext({size:"md",variant:"default",stickyHeader:!1});function v(){return i.useContext(p)}const h=i.forwardRef(function({size:a="md",variant:t="default",stickyHeader:r=!1,loading:l=!1,className:s,style:n,children:o,testId:d,...y},f){return e.jsx(p.Provider,{value:{size:a,variant:t,stickyHeader:r},children:e.jsx("div",{className:"brycks-table-container",style:n,children:e.jsx("table",{ref:f,className:b.cx("brycks-table",`brycks-table--${a}`,`brycks-table--${t}`,s),style:l?{opacity:.6}:void 0,"aria-busy":l||void 0,"data-testid":d,...y,children:o})})})});h.displayName="Table";const k=i.forwardRef(function({sticky:a=!1,className:t,style:r,children:l,...s},n){const{stickyHeader:o}=v(),d=a||o;return e.jsx("thead",{ref:n,className:b.cx("brycks-table-head",d&&"brycks-table-head--sticky",t),style:r,...s,children:l})});k.displayName="TableHead";const j=i.forwardRef(function({className:a,style:t,children:r,...l},s){return e.jsx("tbody",{ref:s,className:b.cx("brycks-table-body",a),style:t,...l,children:r})});j.displayName="TableBody";const u=i.forwardRef(function({selected:a=!1,clickable:t=!1,className:r,style:l,children:s,...n},o){return e.jsx("tr",{ref:o,className:b.cx("brycks-table-row",a&&"brycks-table-row--selected",t&&"brycks-table-row--clickable",r),style:l,...n,children:s})});u.displayName="TableRow";function L({direction:c}){return c?e.jsx("svg",{width:"14",height:"14",viewBox:"0 0 14 14",fill:"none","aria-hidden":"true",children:c==="asc"?e.jsx("path",{d:"M7 3L10 6H4L7 3Z",fill:"currentColor"}):e.jsx("path",{d:"M7 11L4 8H10L7 11Z",fill:"currentColor"})}):e.jsxs("svg",{width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",style:{opacity:.4},"aria-hidden":"true",children:[e.jsx("path",{d:"M7 3L10 6H4L7 3Z",fill:"currentColor"}),e.jsx("path",{d:"M7 11L4 8H10L7 11Z",fill:"currentColor"})]})}const N=i.forwardRef(function({sortable:a=!1,sortDirection:t=null,onSort:r,align:l="left",className:s,style:n,children:o,...d},y){const f={textAlign:l,...n},T={justifyContent:l==="right"?"flex-end":l==="center"?"center":"flex-start"};return e.jsx("th",{ref:y,"aria-sort":a?t==="asc"?"ascending":t==="desc"?"descending":"none":void 0,className:b.cx("brycks-table-header",a&&"brycks-table-header--sortable",s),style:f,...d,children:a?e.jsxs("button",{type:"button",className:"brycks-table-header__content brycks-table-header__sort",style:T,onClick:()=>r?.(),children:[o,e.jsx(L,{direction:t})]}):e.jsx("span",{className:"brycks-table-header__content",style:T,children:o})})});N.displayName="TableHeader";const x=i.forwardRef(function({align:a="left",truncate:t=!1,className:r,style:l,children:s,...n},o){const d={textAlign:a,...l};return e.jsx("td",{ref:o,className:b.cx("brycks-table-cell",t&&"brycks-table-cell--truncate",r),style:d,title:t&&typeof s=="string"?s:void 0,...n,children:s})});x.displayName="TableCell";const w=i.forwardRef(function({className:a,style:t,children:r,...l},s){return e.jsx("tfoot",{ref:s,className:b.cx("brycks-table-foot",a),style:t,...l,children:r})});w.displayName="TableFoot";const C=i.forwardRef(function({placement:a="bottom",className:t,style:r,children:l,...s},n){const o={captionSide:a,...r};return e.jsx("caption",{ref:n,className:b.cx("brycks-table-caption",t),style:o,...s,children:l})});C.displayName="TableCaption";const g=i.forwardRef(function({colSpan:a,icon:t,title:r,description:l,action:s,className:n},o){return e.jsx("tr",{ref:o,className:b.cx("brycks-table-empty",n),children:e.jsx("td",{colSpan:a,style:{padding:0},children:e.jsx(S.EmptyState,{icon:t,title:r,description:l,action:s})})})});g.displayName="TableEmpty";const m=["70%","45%","85%","55%","60%","40%"];function R({rows:c=5,columns:a,className:t}){return e.jsx(e.Fragment,{children:Array.from({length:c}).map((r,l)=>e.jsx(u,{className:b.cx("brycks-table-skeleton-row",t),"aria-hidden":"true",children:Array.from({length:a}).map((s,n)=>e.jsx(x,{children:e.jsx(H.Skeleton,{variant:"text",width:m[n%m.length]})},n))},l))})}R.displayName="TableSkeleton";exports.Table=h;exports.TableBody=j;exports.TableCaption=C;exports.TableCell=x;exports.TableEmpty=g;exports.TableFoot=w;exports.TableHead=k;exports.TableHeader=N;exports.TableRow=u;exports.TableSkeleton=R;
 //# sourceMappingURL=Table.cjs.map

package/dist/components/data/Table/Table.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Table.cjs","sources":["../../../../src/components/data/Table/Table.tsx"],"sourcesContent":["/**\n * Table Component\n *\n * A flexible table component with sorting, selection, and responsive support.\n * Follows design system patterns for consistent styling.\n */\n\nimport {\n  forwardRef,\n  createContext,\n  useContext,\n  type CSSProperties,\n  type HTMLAttributes,\n  type ThHTMLAttributes,\n  type TdHTMLAttributes,\n  type ReactNode,\n} from 'react'\nimport { cx } from '../../../utils/styles'\nimport { spacing, fontSizes, durations, easings } from '../../../design-system'\nimport { componentGap, componentPaddingX, componentPaddingY } from '../../../design-system/primitives'\nimport { EmptyState } from '../../utility/EmptyState'\nimport { Skeleton } from '../../utility/Skeleton'\n\nexport type TableSize = 'sm' | 'md' | 'lg'\n// `striped` was dead API (no CSS, incompatible with inline row styling) — removed in 0.5.0.\nexport type TableVariant = 'default' | 'bordered'\n\ninterface TableContextValue {\n  size: TableSize\n  variant: TableVariant\n  stickyHeader: boolean\n}\n\nconst TableContext = createContext<TableContextValue>({ size: 'md', variant: 'default', stickyHeader: false })\n\nfunction useTableContext() {\n  return useContext(TableContext)\n}\n\nexport interface TableProps extends HTMLAttributes<HTMLTableElement> {\n  /** Table size */\n  size?: TableSize\n  /** Table variant */\n  variant?: TableVariant\n  /** Whether the table has a sticky header */\n  stickyHeader?: boolean\n  /** Whether the table is in a loading state */\n  loading?: boolean\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\nconst sizeConfig: Record<TableSize, { fontSize: number; paddingY: number; paddingX: number; headerPaddingY: number; headerPaddingX: number }> = {\n  sm: { fontSize: fontSizes.base - 1, paddingY: componentPaddingY.md, paddingX: componentPaddingX.sm, headerPaddingY: componentPaddingY.md, headerPaddingX: componentPaddingX.sm },\n  md: { fontSize: fontSizes.base, paddingY: componentPaddingX.sm, paddingX: componentPaddingX.md, headerPaddingY: componentPaddingX.sm, headerPaddingX: componentPaddingX.md },\n  lg: { fontSize: fontSizes.base + 1, paddingY: componentPaddingX.md, paddingX: componentPaddingX.lg, headerPaddingY: spacing[3.5], headerPaddingX: componentPaddingX.lg },\n}\n\nexport const Table = forwardRef<HTMLTableElement, TableProps>(function Table(\n  {\n    size = 'md',\n    variant = 'default',\n    stickyHeader = false,\n    loading = false,\n    className,\n    style,\n    children,\n    testId,\n    ...props\n  },\n  ref\n) {\n  const containerStyle: CSSProperties = {\n    position: 'relative',\n    width: '100%',\n    overflow: 'auto',\n    ...style,\n  }\n\n  const tableStyle: CSSProperties = {\n    width: '100%',\n    borderCollapse: variant === 'bordered' ? 'separate' : 'collapse',\n    borderSpacing: 0,\n    fontSize: sizeConfig[size].fontSize,\n    fontVariantNumeric: 'tabular-nums',\n    opacity: loading ? 0.6 : 1,\n    transition: `opacity ${durations.quick}ms ${easings.easeOut}`,\n  }\n\n  return (\n    <TableContext.Provider value={{ size, variant, stickyHeader }}>\n      <div className=\"brycks-table-container\" style={containerStyle}>\n        <table\n          ref={ref}\n          className={cx('brycks-table', `brycks-table--${size}`, `brycks-table--${variant}`, className)}\n          style={tableStyle}\n          aria-busy={loading || undefined}\n          data-testid={testId}\n          {...props}\n        >\n          {children}\n        </table>\n      </div>\n    </TableContext.Provider>\n  )\n})\n\nTable.displayName = 'Table'\n\n// TableHead\nexport interface TableHeadProps extends HTMLAttributes<HTMLTableSectionElement> {\n  /** Whether the header is sticky */\n  sticky?: boolean\n  /** Custom class name */\n  className?: string\n}\n\nexport const TableHead = forwardRef<HTMLTableSectionElement, TableHeadProps>(function TableHead(\n  { sticky = false, className, style, children, ...props },\n  ref\n) {\n  const { stickyHeader } = useTableContext()\n  const isSticky = sticky || stickyHeader\n\n  const headStyle: CSSProperties = {\n    backgroundColor: 'var(--brycks-background-muted)',\n    position: isSticky ? 'sticky' : undefined,\n    top: isSticky ? 0 : undefined,\n    zIndex: isSticky ? 1 : undefined,\n    ...style,\n  }\n\n  return (\n    <thead\n      ref={ref}\n      className={cx('brycks-table-head', isSticky && 'brycks-table-head--sticky', className)}\n      style={headStyle}\n      {...props}\n    >\n      {children}\n    </thead>\n  )\n})\n\nTableHead.displayName = 'TableHead'\n\n// TableBody\nexport interface TableBodyProps extends HTMLAttributes<HTMLTableSectionElement> {\n  /** Custom class name */\n  className?: string\n}\n\nexport const TableBody = forwardRef<HTMLTableSectionElement, TableBodyProps>(function TableBody(\n  { className, style, children, ...props },\n  ref\n) {\n  const bodyStyle: CSSProperties = {\n    ...style,\n  }\n\n  return (\n    <tbody\n      ref={ref}\n      className={cx('brycks-table-body', className)}\n      style={bodyStyle}\n      {...props}\n    >\n      {children}\n    </tbody>\n  )\n})\n\nTableBody.displayName = 'TableBody'\n\n// TableRow\nexport interface TableRowProps extends HTMLAttributes<HTMLTableRowElement> {\n  /** Whether the row is selected */\n  selected?: boolean\n  /** Whether the row is clickable */\n  clickable?: boolean\n  /** Custom class name */\n  className?: string\n}\n\nexport const TableRow = forwardRef<HTMLTableRowElement, TableRowProps>(function TableRow(\n  { selected = false, clickable = false, className, style, children, ...props },\n  ref\n) {\n  const { variant } = useTableContext()\n\n  const rowStyle: CSSProperties = {\n    backgroundColor: selected\n      ? 'var(--brycks-primary-muted)'\n      : 'transparent',\n    borderBottom: variant !== 'bordered' ? '1px solid var(--brycks-border-muted)' : undefined,\n    cursor: clickable ? 'pointer' : undefined,\n    transition: `background-color ${durations.quick}ms ${easings.easeOut}`,\n    ...style,\n  }\n\n  return (\n    <tr\n      ref={ref}\n      className={cx(\n        'brycks-table-row',\n        selected && 'brycks-table-row--selected',\n        clickable && 'brycks-table-row--clickable',\n        className\n      )}\n      style={rowStyle}\n      onMouseEnter={(e) => {\n        if (clickable && !selected) {\n          e.currentTarget.style.backgroundColor = 'var(--brycks-background-muted)'\n        }\n      }}\n      onMouseLeave={(e) => {\n        if (!selected) {\n          e.currentTarget.style.backgroundColor = 'transparent'\n        }\n      }}\n      {...props}\n    >\n      {children}\n    </tr>\n  )\n})\n\nTableRow.displayName = 'TableRow'\n\n// TableHeader (th)\nexport interface TableHeaderProps extends ThHTMLAttributes<HTMLTableCellElement> {\n  /** Whether the column is sortable */\n  sortable?: boolean\n  /** Sort direction */\n  sortDirection?: 'asc' | 'desc' | null\n  /** Callback when sort is requested */\n  onSort?: () => void\n  /** Text alignment */\n  align?: 'left' | 'center' | 'right'\n  /** Custom class name */\n  className?: string\n}\n\nfunction SortIcon({ direction }: { direction: 'asc' | 'desc' | null }) {\n  if (!direction) {\n    return (\n      <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" style={{ opacity: 0.4 }} aria-hidden=\"true\">\n        <path d=\"M7 3L10 6H4L7 3Z\" fill=\"currentColor\" />\n        <path d=\"M7 11L4 8H10L7 11Z\" fill=\"currentColor\" />\n      </svg>\n    )\n  }\n\n  return (\n    <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" aria-hidden=\"true\">\n      {direction === 'asc' ? (\n        <path d=\"M7 3L10 6H4L7 3Z\" fill=\"currentColor\" />\n      ) : (\n        <path d=\"M7 11L4 8H10L7 11Z\" fill=\"currentColor\" />\n      )}\n    </svg>\n  )\n}\n\nexport const TableHeader = forwardRef<HTMLTableCellElement, TableHeaderProps>(function TableHeader(\n  {\n    sortable = false,\n    sortDirection = null,\n    onSort,\n    align = 'left',\n    className,\n    style,\n    children,\n    ...props\n  },\n  ref\n) {\n  const { size } = useTableContext()\n  const config = sizeConfig[size]\n\n  const headerStyle: CSSProperties = {\n    padding: `${config.headerPaddingY}px ${config.headerPaddingX}px`,\n    fontWeight: 600,\n    color: 'var(--brycks-foreground-muted)',\n    textAlign: align,\n    whiteSpace: 'nowrap',\n    transition: `color ${durations.quick}ms ${easings.easeOut}`,\n    ...style,\n  }\n\n  const contentStyle: CSSProperties = {\n    display: 'flex',\n    alignItems: 'center',\n    gap: componentGap.sm,\n    justifyContent: align === 'right' ? 'flex-end' : align === 'center' ? 'center' : 'flex-start',\n  }\n\n  // Sorting happens through a real button so it is reachable by keyboard\n  const sortButtonStyle: CSSProperties = {\n    ...contentStyle,\n    width: '100%',\n    padding: 0,\n    background: 'transparent',\n    border: 'none',\n    font: 'inherit',\n    fontWeight: 'inherit',\n    color: 'inherit',\n    cursor: 'pointer',\n    userSelect: 'none',\n  }\n\n  return (\n    <th\n      ref={ref}\n      aria-sort={\n        sortable\n          ? sortDirection === 'asc'\n            ? 'ascending'\n            : sortDirection === 'desc'\n            ? 'descending'\n            : 'none'\n          : undefined\n      }\n      className={cx('brycks-table-header', sortable && 'brycks-table-header--sortable', className)}\n      style={headerStyle}\n      {...props}\n    >\n      {sortable ? (\n        <button\n          type=\"button\"\n          style={sortButtonStyle}\n          onClick={() => onSort?.()}\n          onMouseEnter={(e) => {\n            e.currentTarget.style.color = 'var(--brycks-foreground-default)'\n          }}\n          onMouseLeave={(e) => {\n            e.currentTarget.style.color = 'inherit'\n          }}\n        >\n          {children}\n          <SortIcon direction={sortDirection} />\n        </button>\n      ) : (\n        <span style={contentStyle}>{children}</span>\n      )}\n    </th>\n  )\n})\n\nTableHeader.displayName = 'TableHeader'\n\n// TableCell (td)\nexport interface TableCellProps extends TdHTMLAttributes<HTMLTableCellElement> {\n  /** Text alignment */\n  align?: 'left' | 'center' | 'right'\n  /** Whether to truncate text */\n  truncate?: boolean\n  /** Custom class name */\n  className?: string\n}\n\nexport const TableCell = forwardRef<HTMLTableCellElement, TableCellProps>(function TableCell(\n  { align = 'left', truncate = false, className, style, children, ...props },\n  ref\n) {\n  const { size, variant } = useTableContext()\n  const config = sizeConfig[size]\n\n  const cellStyle: CSSProperties = {\n    padding: `${config.paddingY}px ${config.paddingX}px`,\n    color: 'var(--brycks-foreground-default)',\n    textAlign: align,\n    verticalAlign: 'middle',\n    border: variant === 'bordered' ? '1px solid var(--brycks-border-muted)' : undefined,\n    maxWidth: truncate ? 200 : undefined,\n    overflow: truncate ? 'hidden' : undefined,\n    textOverflow: truncate ? 'ellipsis' : undefined,\n    whiteSpace: truncate ? 'nowrap' : undefined,\n    ...style,\n  }\n\n  return (\n    <td\n      ref={ref}\n      className={cx('brycks-table-cell', truncate && 'brycks-table-cell--truncate', className)}\n      style={cellStyle}\n      title={truncate && typeof children === 'string' ? children : undefined}\n      {...props}\n    >\n      {children}\n    </td>\n  )\n})\n\nTableCell.displayName = 'TableCell'\n\n// TableFoot\nexport interface TableFootProps extends HTMLAttributes<HTMLTableSectionElement> {\n  /** Custom class name */\n  className?: string\n}\n\nexport const TableFoot = forwardRef<HTMLTableSectionElement, TableFootProps>(function TableFoot(\n  { className, style, children, ...props },\n  ref\n) {\n  const footStyle: CSSProperties = {\n    backgroundColor: 'var(--brycks-background-muted)',\n    fontWeight: 500,\n    ...style,\n  }\n\n  return (\n    <tfoot\n      ref={ref}\n      className={cx('brycks-table-foot', className)}\n      style={footStyle}\n      {...props}\n    >\n      {children}\n    </tfoot>\n  )\n})\n\nTableFoot.displayName = 'TableFoot'\n\n// TableCaption\nexport interface TableCaptionProps extends HTMLAttributes<HTMLTableCaptionElement> {\n  /** Caption placement */\n  placement?: 'top' | 'bottom'\n  /** Custom class name */\n  className?: string\n}\n\nexport const TableCaption = forwardRef<HTMLTableCaptionElement, TableCaptionProps>(function TableCaption(\n  { placement = 'bottom', className, style, children, ...props },\n  ref\n) {\n  const captionStyle: CSSProperties = {\n    captionSide: placement,\n    padding: `${spacing[3]}px ${spacing[4]}px`,\n    fontSize: fontSizes.base - 1,\n    color: 'var(--brycks-foreground-muted)',\n    textAlign: 'left',\n    ...style,\n  }\n\n  return (\n    <caption\n      ref={ref}\n      className={cx('brycks-table-caption', className)}\n      style={captionStyle}\n      {...props}\n    >\n      {children}\n    </caption>\n  )\n})\n\nTableCaption.displayName = 'TableCaption'\n\n// TableEmpty — a full-width empty state row, drop inside <TableBody>\nexport interface TableEmptyProps {\n  /** Number of columns to span (match the table's column count) */\n  colSpan: number\n  /** Icon or illustration */\n  icon?: ReactNode\n  /** Title text */\n  title?: ReactNode\n  /** Description text */\n  description?: ReactNode\n  /** Action element (button, link) */\n  action?: ReactNode\n  /** Custom class name */\n  className?: string\n}\n\nexport const TableEmpty = forwardRef<HTMLTableRowElement, TableEmptyProps>(function TableEmpty(\n  { colSpan, icon, title, description, action, className },\n  ref\n) {\n  return (\n    <tr ref={ref} className={cx('brycks-table-empty', className)}>\n      <td colSpan={colSpan} style={{ padding: 0 }}>\n        <EmptyState icon={icon} title={title} description={description} action={action} />\n      </td>\n    </tr>\n  )\n})\n\nTableEmpty.displayName = 'TableEmpty'\n\n// TableSkeleton — placeholder rows shown while data loads, drop inside <TableBody>\nexport interface TableSkeletonProps {\n  /** Number of skeleton rows */\n  rows?: number\n  /** Number of columns per row (match the table's column count) */\n  columns: number\n  /** Custom class name applied to each row */\n  className?: string\n}\n\n// Deterministic per-column widths so the placeholder reads like real data\nconst skeletonWidths = ['70%', '45%', '85%', '55%', '60%', '40%']\n\nexport function TableSkeleton({ rows = 5, columns, className }: TableSkeletonProps) {\n  return (\n    <>\n      {Array.from({ length: rows }).map((_, rowIndex) => (\n        <TableRow key={rowIndex} className={cx('brycks-table-skeleton-row', className)} aria-hidden=\"true\">\n          {Array.from({ length: columns }).map((_, colIndex) => (\n            <TableCell key={colIndex}>\n              <Skeleton variant=\"text\" width={skeletonWidths[colIndex % skeletonWidths.length]} />\n            </TableCell>\n          ))}\n        </TableRow>\n      ))}\n    </>\n  )\n}\n\nTableSkeleton.displayName = 'TableSkeleton'\n"],"names":["TableContext","createContext","useTableContext","useContext","sizeConfig","fontSizes","componentPaddingY","componentPaddingX","spacing","Table","forwardRef","size","variant","stickyHeader","loading","className","style","children","testId","props","ref","containerStyle","tableStyle","durations","easings","jsx","cx","TableHead","sticky","isSticky","headStyle","TableBody","bodyStyle","TableRow","selected","clickable","rowStyle","e","SortIcon","direction","TableHeader","sortable","sortDirection","onSort","align","config","headerStyle","contentStyle","componentGap","sortButtonStyle","jsxs","TableCell","truncate","cellStyle","TableFoot","footStyle","TableCaption","placement","captionStyle","TableEmpty","colSpan","icon","title","description","action","EmptyState","skeletonWidths","TableSkeleton","rows","columns","Fragment","_","rowIndex","colIndex","Skeleton"],"mappings":"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"}
+{"version":3,"file":"Table.cjs","sources":["../../../../src/components/data/Table/Table.tsx"],"sourcesContent":["/**\n * Table Component\n *\n * A flexible table component with sorting, selection, and responsive support.\n * Follows design system patterns for consistent styling.\n */\n\nimport {\n  forwardRef,\n  createContext,\n  useContext,\n  type CSSProperties,\n  type HTMLAttributes,\n  type ThHTMLAttributes,\n  type TdHTMLAttributes,\n  type ReactNode,\n} from 'react'\nimport { cx } from '../../../utils/styles'\nimport { EmptyState } from '../../utility/EmptyState'\nimport { Skeleton } from '../../utility/Skeleton'\n\nexport type TableSize = 'sm' | 'md' | 'lg'\n// `striped` was dead API (no CSS, incompatible with inline row styling) — removed in 0.5.0.\nexport type TableVariant = 'default' | 'bordered'\n\ninterface TableContextValue {\n  size: TableSize\n  variant: TableVariant\n  stickyHeader: boolean\n}\n\nconst TableContext = createContext<TableContextValue>({ size: 'md', variant: 'default', stickyHeader: false })\n\nfunction useTableContext() {\n  return useContext(TableContext)\n}\n\nexport interface TableProps extends HTMLAttributes<HTMLTableElement> {\n  /** Table size */\n  size?: TableSize\n  /** Table variant */\n  variant?: TableVariant\n  /** Whether the table has a sticky header */\n  stickyHeader?: boolean\n  /** Whether the table is in a loading state */\n  loading?: boolean\n  /** Custom class name */\n  className?: string\n  /** Test ID */\n  testId?: string\n}\n\nexport const Table = forwardRef<HTMLTableElement, TableProps>(function Table(\n  {\n    size = 'md',\n    variant = 'default',\n    stickyHeader = false,\n    loading = false,\n    className,\n    style,\n    children,\n    testId,\n    ...props\n  },\n  ref\n) {\n  return (\n    <TableContext.Provider value={{ size, variant, stickyHeader }}>\n      <div className=\"brycks-table-container\" style={style}>\n        <table\n          ref={ref}\n          className={cx('brycks-table', `brycks-table--${size}`, `brycks-table--${variant}`, className)}\n          style={loading ? { opacity: 0.6 } : undefined}\n          aria-busy={loading || undefined}\n          data-testid={testId}\n          {...props}\n        >\n          {children}\n        </table>\n      </div>\n    </TableContext.Provider>\n  )\n})\n\nTable.displayName = 'Table'\n\n// TableHead\nexport interface TableHeadProps extends HTMLAttributes<HTMLTableSectionElement> {\n  /** Whether the header is sticky */\n  sticky?: boolean\n  /** Custom class name */\n  className?: string\n}\n\nexport const TableHead = forwardRef<HTMLTableSectionElement, TableHeadProps>(function TableHead(\n  { sticky = false, className, style, children, ...props },\n  ref\n) {\n  const { stickyHeader } = useTableContext()\n  const isSticky = sticky || stickyHeader\n\n  return (\n    <thead\n      ref={ref}\n      className={cx('brycks-table-head', isSticky && 'brycks-table-head--sticky', className)}\n      style={style}\n      {...props}\n    >\n      {children}\n    </thead>\n  )\n})\n\nTableHead.displayName = 'TableHead'\n\n// TableBody\nexport interface TableBodyProps extends HTMLAttributes<HTMLTableSectionElement> {\n  /** Custom class name */\n  className?: string\n}\n\nexport const TableBody = forwardRef<HTMLTableSectionElement, TableBodyProps>(function TableBody(\n  { className, style, children, ...props },\n  ref\n) {\n  return (\n    <tbody\n      ref={ref}\n      className={cx('brycks-table-body', className)}\n      style={style}\n      {...props}\n    >\n      {children}\n    </tbody>\n  )\n})\n\nTableBody.displayName = 'TableBody'\n\n// TableRow\nexport interface TableRowProps extends HTMLAttributes<HTMLTableRowElement> {\n  /** Whether the row is selected */\n  selected?: boolean\n  /** Whether the row is clickable */\n  clickable?: boolean\n  /** Custom class name */\n  className?: string\n}\n\nexport const TableRow = forwardRef<HTMLTableRowElement, TableRowProps>(function TableRow(\n  { selected = false, clickable = false, className, style, children, ...props },\n  ref\n) {\n  return (\n    <tr\n      ref={ref}\n      className={cx(\n        'brycks-table-row',\n        selected && 'brycks-table-row--selected',\n        clickable && 'brycks-table-row--clickable',\n        className\n      )}\n      style={style}\n      {...props}\n    >\n      {children}\n    </tr>\n  )\n})\n\nTableRow.displayName = 'TableRow'\n\n// TableHeader (th)\nexport interface TableHeaderProps extends ThHTMLAttributes<HTMLTableCellElement> {\n  /** Whether the column is sortable */\n  sortable?: boolean\n  /** Sort direction */\n  sortDirection?: 'asc' | 'desc' | null\n  /** Callback when sort is requested */\n  onSort?: () => void\n  /** Text alignment */\n  align?: 'left' | 'center' | 'right'\n  /** Custom class name */\n  className?: string\n}\n\nfunction SortIcon({ direction }: { direction: 'asc' | 'desc' | null }) {\n  if (!direction) {\n    return (\n      <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" style={{ opacity: 0.4 }} aria-hidden=\"true\">\n        <path d=\"M7 3L10 6H4L7 3Z\" fill=\"currentColor\" />\n        <path d=\"M7 11L4 8H10L7 11Z\" fill=\"currentColor\" />\n      </svg>\n    )\n  }\n\n  return (\n    <svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" aria-hidden=\"true\">\n      {direction === 'asc' ? (\n        <path d=\"M7 3L10 6H4L7 3Z\" fill=\"currentColor\" />\n      ) : (\n        <path d=\"M7 11L4 8H10L7 11Z\" fill=\"currentColor\" />\n      )}\n    </svg>\n  )\n}\n\nexport const TableHeader = forwardRef<HTMLTableCellElement, TableHeaderProps>(function TableHeader(\n  {\n    sortable = false,\n    sortDirection = null,\n    onSort,\n    align = 'left',\n    className,\n    style,\n    children,\n    ...props\n  },\n  ref\n) {\n  // Alignment is dynamic per prop; everything else lives in CSS.\n  const alignStyle: CSSProperties = {\n    textAlign: align,\n    ...style,\n  }\n\n  const contentJustify: CSSProperties = {\n    justifyContent: align === 'right' ? 'flex-end' : align === 'center' ? 'center' : 'flex-start',\n  }\n\n  return (\n    <th\n      ref={ref}\n      aria-sort={\n        sortable\n          ? sortDirection === 'asc'\n            ? 'ascending'\n            : sortDirection === 'desc'\n            ? 'descending'\n            : 'none'\n          : undefined\n      }\n      className={cx('brycks-table-header', sortable && 'brycks-table-header--sortable', className)}\n      style={alignStyle}\n      {...props}\n    >\n      {sortable ? (\n        // Sorting happens through a real button so it is reachable by keyboard\n        <button\n          type=\"button\"\n          className=\"brycks-table-header__content brycks-table-header__sort\"\n          style={contentJustify}\n          onClick={() => onSort?.()}\n        >\n          {children}\n          <SortIcon direction={sortDirection} />\n        </button>\n      ) : (\n        <span className=\"brycks-table-header__content\" style={contentJustify}>\n          {children}\n        </span>\n      )}\n    </th>\n  )\n})\n\nTableHeader.displayName = 'TableHeader'\n\n// TableCell (td)\nexport interface TableCellProps extends TdHTMLAttributes<HTMLTableCellElement> {\n  /** Text alignment */\n  align?: 'left' | 'center' | 'right'\n  /** Whether to truncate text */\n  truncate?: boolean\n  /** Custom class name */\n  className?: string\n}\n\nexport const TableCell = forwardRef<HTMLTableCellElement, TableCellProps>(function TableCell(\n  { align = 'left', truncate = false, className, style, children, ...props },\n  ref\n) {\n  // Alignment is dynamic per prop; everything else lives in CSS.\n  const alignStyle: CSSProperties = {\n    textAlign: align,\n    ...style,\n  }\n\n  return (\n    <td\n      ref={ref}\n      className={cx('brycks-table-cell', truncate && 'brycks-table-cell--truncate', className)}\n      style={alignStyle}\n      title={truncate && typeof children === 'string' ? children : undefined}\n      {...props}\n    >\n      {children}\n    </td>\n  )\n})\n\nTableCell.displayName = 'TableCell'\n\n// TableFoot\nexport interface TableFootProps extends HTMLAttributes<HTMLTableSectionElement> {\n  /** Custom class name */\n  className?: string\n}\n\nexport const TableFoot = forwardRef<HTMLTableSectionElement, TableFootProps>(function TableFoot(\n  { className, style, children, ...props },\n  ref\n) {\n  return (\n    <tfoot\n      ref={ref}\n      className={cx('brycks-table-foot', className)}\n      style={style}\n      {...props}\n    >\n      {children}\n    </tfoot>\n  )\n})\n\nTableFoot.displayName = 'TableFoot'\n\n// TableCaption\nexport interface TableCaptionProps extends HTMLAttributes<HTMLTableCaptionElement> {\n  /** Caption placement */\n  placement?: 'top' | 'bottom'\n  /** Custom class name */\n  className?: string\n}\n\nexport const TableCaption = forwardRef<HTMLTableCaptionElement, TableCaptionProps>(function TableCaption(\n  { placement = 'bottom', className, style, children, ...props },\n  ref\n) {\n  // Caption side is dynamic per prop; everything else lives in CSS.\n  const captionStyle: CSSProperties = {\n    captionSide: placement,\n    ...style,\n  }\n\n  return (\n    <caption\n      ref={ref}\n      className={cx('brycks-table-caption', className)}\n      style={captionStyle}\n      {...props}\n    >\n      {children}\n    </caption>\n  )\n})\n\nTableCaption.displayName = 'TableCaption'\n\n// TableEmpty — a full-width empty state row, drop inside <TableBody>\nexport interface TableEmptyProps {\n  /** Number of columns to span (match the table's column count) */\n  colSpan: number\n  /** Icon or illustration */\n  icon?: ReactNode\n  /** Title text */\n  title?: ReactNode\n  /** Description text */\n  description?: ReactNode\n  /** Action element (button, link) */\n  action?: ReactNode\n  /** Custom class name */\n  className?: string\n}\n\nexport const TableEmpty = forwardRef<HTMLTableRowElement, TableEmptyProps>(function TableEmpty(\n  { colSpan, icon, title, description, action, className },\n  ref\n) {\n  return (\n    <tr ref={ref} className={cx('brycks-table-empty', className)}>\n      <td colSpan={colSpan} style={{ padding: 0 }}>\n        <EmptyState icon={icon} title={title} description={description} action={action} />\n      </td>\n    </tr>\n  )\n})\n\nTableEmpty.displayName = 'TableEmpty'\n\n// TableSkeleton — placeholder rows shown while data loads, drop inside <TableBody>\nexport interface TableSkeletonProps {\n  /** Number of skeleton rows */\n  rows?: number\n  /** Number of columns per row (match the table's column count) */\n  columns: number\n  /** Custom class name applied to each row */\n  className?: string\n}\n\n// Deterministic per-column widths so the placeholder reads like real data\nconst skeletonWidths = ['70%', '45%', '85%', '55%', '60%', '40%']\n\nexport function TableSkeleton({ rows = 5, columns, className }: TableSkeletonProps) {\n  return (\n    <>\n      {Array.from({ length: rows }).map((_, rowIndex) => (\n        <TableRow key={rowIndex} className={cx('brycks-table-skeleton-row', className)} aria-hidden=\"true\">\n          {Array.from({ length: columns }).map((_, colIndex) => (\n            <TableCell key={colIndex}>\n              <Skeleton variant=\"text\" width={skeletonWidths[colIndex % skeletonWidths.length]} />\n            </TableCell>\n          ))}\n        </TableRow>\n      ))}\n    </>\n  )\n}\n\nTableSkeleton.displayName = 'TableSkeleton'\n"],"names":["TableContext","createContext","useTableContext","useContext","Table","forwardRef","size","variant","stickyHeader","loading","className","style","children","testId","props","ref","jsx","cx","TableHead","sticky","isSticky","TableBody","TableRow","selected","clickable","SortIcon","direction","TableHeader","sortable","sortDirection","onSort","align","alignStyle","contentJustify","jsxs","TableCell","truncate","TableFoot","TableCaption","placement","captionStyle","TableEmpty","colSpan","icon","title","description","action","EmptyState","skeletonWidths","TableSkeleton","rows","columns","Fragment","_","rowIndex","colIndex","Skeleton"],"mappings":"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"}