@cdx-ui/components 0.0.1-beta.4 → 0.0.1-beta.6

package/lib/module/components/ListItem/index.js

@@ -0,0 +1,226 @@
+"use strict";
+
+import { forwardRef } from 'react';
+import { Pressable, Text, View } from 'react-native';
+import { createListItem } from '@cdx-ui/primitives';
+import { cn, useStyleContext, withStyleContext } from '@cdx-ui/utils';
+import { listItemContentVariants, listItemDescriptionVariants, listItemLeadingSlotVariants, listItemMetaVariants, listItemRootVariants, listItemSectionHeaderLabelVariants, listItemSectionHeaderVariants, listItemTitleVariants, listItemTrailingSlotVariants } from './styles';
+import { jsx as _jsx } from "react/jsx-runtime";
+const SCOPE = 'LIST_ITEM';
+const RootView = withStyleContext(View, SCOPE);
+const RootPressable = withStyleContext(Pressable, SCOPE);
+const ListItemPrimitive = createListItem({
+  View: RootView,
+  Pressable: RootPressable,
+  LeadingSlot: View,
+  Content: View,
+  Title: Text,
+  Description: Text,
+  Meta: Text,
+  TrailingSlot: View,
+  SectionHeader: View
+});
+const useListItemStyleContext = () => {
+  const ctx = useStyleContext(SCOPE);
+  return {
+    size: ctx?.size ?? 'default',
+    crossAlign: ctx?.crossAlign ?? 'center'
+  };
+};
+
+// =============================================================================
+// ROOT
+// =============================================================================
+
+const ListItemRoot = /*#__PURE__*/forwardRef(({
+  size = 'default',
+  surface = 'default',
+  showSeparator = true,
+  crossAlign = 'center',
+  className,
+  style,
+  ...props
+}, ref) => {
+  const computedClassName = cn(listItemRootVariants({
+    size,
+    surface,
+    showSeparator,
+    crossAlign
+  }), className);
+  return /*#__PURE__*/_jsx(ListItemPrimitive, {
+    ref: ref,
+    className: computedClassName,
+    context: {
+      size,
+      surface,
+      showSeparator,
+      crossAlign
+    },
+    crossAlign: crossAlign,
+    showSeparator: showSeparator,
+    size: size,
+    style: style,
+    surface: surface,
+    ...props
+  });
+});
+ListItemRoot.displayName = 'ListItem';
+
+// =============================================================================
+// SLOTS & TEXT
+// =============================================================================
+
+const ListItemLeadingSlot = /*#__PURE__*/forwardRef(({
+  className,
+  style,
+  ...props
+}, ref) => /*#__PURE__*/_jsx(ListItemPrimitive.LeadingSlot, {
+  ref: ref,
+  className: cn(listItemLeadingSlotVariants(), className),
+  style: style,
+  ...props
+}));
+ListItemLeadingSlot.displayName = 'ListItem.LeadingSlot';
+const ListItemContent = /*#__PURE__*/forwardRef(({
+  className,
+  style,
+  ...props
+}, ref) => {
+  const {
+    crossAlign
+  } = useListItemStyleContext();
+  return /*#__PURE__*/_jsx(ListItemPrimitive.Content, {
+    ref: ref,
+    className: cn(listItemContentVariants({
+      crossAlign
+    }), className),
+    style: style,
+    ...props
+  });
+});
+ListItemContent.displayName = 'ListItem.Content';
+const ListItemTitle = /*#__PURE__*/forwardRef(({
+  className,
+  numberOfLines = 1,
+  style,
+  ...props
+}, ref) => {
+  const {
+    size
+  } = useListItemStyleContext();
+  return /*#__PURE__*/_jsx(ListItemPrimitive.Title, {
+    ref: ref,
+    className: cn(listItemTitleVariants({
+      size
+    }), className),
+    numberOfLines: numberOfLines,
+    style: style,
+    ...props
+  });
+});
+ListItemTitle.displayName = 'ListItem.Title';
+const ListItemDescription = /*#__PURE__*/forwardRef(({
+  className,
+  style,
+  ...props
+}, ref) => {
+  const {
+    size
+  } = useListItemStyleContext();
+  return /*#__PURE__*/_jsx(ListItemPrimitive.Description, {
+    ref: ref,
+    className: cn(listItemDescriptionVariants({
+      size
+    }), className),
+    style: style,
+    ...props
+  });
+});
+ListItemDescription.displayName = 'ListItem.Description';
+const ListItemMeta = /*#__PURE__*/forwardRef(({
+  className,
+  numberOfLines = 1,
+  style,
+  ...props
+}, ref) => {
+  const {
+    size
+  } = useListItemStyleContext();
+  return /*#__PURE__*/_jsx(ListItemPrimitive.Meta, {
+    ref: ref,
+    className: cn(listItemMetaVariants({
+      size
+    }), className),
+    numberOfLines: numberOfLines,
+    style: style,
+    ...props
+  });
+});
+ListItemMeta.displayName = 'ListItem.Meta';
+const ListItemTrailingSlot = /*#__PURE__*/forwardRef(({
+  className,
+  style,
+  ...props
+}, ref) => {
+  const {
+    crossAlign
+  } = useListItemStyleContext();
+  return /*#__PURE__*/_jsx(ListItemPrimitive.TrailingSlot, {
+    ref: ref,
+    className: cn(listItemTrailingSlotVariants({
+      crossAlign
+    }), className),
+    style: style,
+    ...props
+  });
+});
+ListItemTrailingSlot.displayName = 'ListItem.TrailingSlot';
+const wrapSectionHeaderLabel = children => {
+  if (typeof children === 'string' || typeof children === 'number') {
+    return /*#__PURE__*/_jsx(Text, {
+      className: cn(listItemSectionHeaderLabelVariants()),
+      children: children
+    });
+  }
+  return children;
+};
+
+// =============================================================================
+// SECTION HEADER
+// =============================================================================
+
+const ListItemSectionHeader = /*#__PURE__*/forwardRef(({
+  children,
+  className,
+  showDivider = true,
+  style,
+  trailing,
+  ...props
+}, ref) => /*#__PURE__*/_jsx(ListItemPrimitive.SectionHeader, {
+  ref: ref,
+  className: cn(listItemSectionHeaderVariants({
+    showDivider
+  }), className),
+  showDivider: showDivider,
+  style: style,
+  trailing: trailing,
+  ...props,
+  children: wrapSectionHeaderLabel(children)
+}));
+ListItemSectionHeader.displayName = 'ListItem.SectionHeader';
+
+// =============================================================================
+// COMPOUND EXPORT
+// =============================================================================
+
+export const ListItem = Object.assign(ListItemRoot, {
+  LeadingSlot: ListItemLeadingSlot,
+  Content: ListItemContent,
+  Title: ListItemTitle,
+  Description: ListItemDescription,
+  Meta: ListItemMeta,
+  TrailingSlot: ListItemTrailingSlot,
+  SectionHeader: ListItemSectionHeader
+});
+export { listItemContentVariants, listItemDescriptionVariants, listItemLeadingSlotVariants, listItemMetaVariants, listItemRootVariants, listItemSectionHeaderLabelVariants, listItemSectionHeaderVariants, listItemTitleVariants, listItemTrailingSlotVariants } from './styles';
+//# sourceMappingURL=index.js.map

package/lib/module/components/ListItem/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["forwardRef","Pressable","Text","View","createListItem","cn","useStyleContext","withStyleContext","listItemContentVariants","listItemDescriptionVariants","listItemLeadingSlotVariants","listItemMetaVariants","listItemRootVariants","listItemSectionHeaderLabelVariants","listItemSectionHeaderVariants","listItemTitleVariants","listItemTrailingSlotVariants","jsx","_jsx","SCOPE","RootView","RootPressable","ListItemPrimitive","LeadingSlot","Content","Title","Description","Meta","TrailingSlot","SectionHeader","useListItemStyleContext","ctx","size","crossAlign","ListItemRoot","surface","showSeparator","className","style","props","ref","computedClassName","context","displayName","ListItemLeadingSlot","ListItemContent","ListItemTitle","numberOfLines","ListItemDescription","ListItemMeta","ListItemTrailingSlot","wrapSectionHeaderLabel","children","ListItemSectionHeader","showDivider","trailing","ListItem","Object","assign"],"sourceRoot":"../../../../src","sources":["components/ListItem/index.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/ListItem/styles.js

@@ -0,0 +1,127 @@
+"use strict";
+
+import { Platform } from 'react-native';
+import { cva } from 'class-variance-authority';
+import { COLOR_BORDER_DEFAULT, COLOR_TEXT_MUTED, COLOR_TEXT_PRIMARY, COLOR_TEXT_SECONDARY, TRANSITION_COLORS } from '../../styles/primitives';
+
+// ── Root (row): density, surface, separator, interactive feedback ──────────
+
+export const listItemRootVariants = cva(['flex-row self-stretch w-full px-4', 'data-[disabled=true]:opacity-50 data-[disabled=true]:pointer-events-none', 'data-[active=true]:opacity-70', TRANSITION_COLORS, Platform.select({
+  web: ['outline-none', 'web:data-[hovered=true]:bg-slate-50', 'web:focus-visible:data-[disabled=false]:bg-slate-50', 'web:focus-visible:data-[disabled=false]:ring-2 web:focus-visible:data-[disabled=false]:ring-slate-400/40 web:focus-visible:data-[disabled=false]:ring-offset-2'].join(' '),
+  default: ''
+})], {
+  variants: {
+    size: {
+      default: 'gap-3 py-4',
+      compact: 'gap-2 py-3'
+    },
+    surface: {
+      default: 'bg-white',
+      negative: 'bg-red-50'
+    },
+    showSeparator: {
+      true: ['border-b border-solid', COLOR_BORDER_DEFAULT],
+      false: 'border-b-0'
+    },
+    crossAlign: {
+      center: 'items-center',
+      start: 'items-start'
+    }
+  },
+  compoundVariants: [{
+    surface: 'negative',
+    className: Platform.select({
+      web: 'web:data-[hovered=true]:bg-red-100/90',
+      default: ''
+    })
+  }],
+  defaultVariants: {
+    size: 'default',
+    surface: 'default',
+    showSeparator: true,
+    crossAlign: 'center'
+  }
+});
+
+// ── Leading / trailing slots ─────────────────────────────────────────────────
+
+export const listItemLeadingSlotVariants = cva(['flex shrink-0 items-center justify-center']);
+export const listItemTrailingSlotVariants = cva(['flex shrink-0 flex-row justify-end gap-2'], {
+  variants: {
+    crossAlign: {
+      center: 'items-center',
+      start: 'items-start self-start'
+    }
+  },
+  defaultVariants: {
+    crossAlign: 'center'
+  }
+});
+
+// ── Content stack (title / description / meta) ───────────────────────────────
+
+export const listItemContentVariants = cva(['flex min-w-0 flex-1 flex-col gap-1'], {
+  variants: {
+    crossAlign: {
+      center: 'justify-center',
+      start: 'justify-start'
+    }
+  },
+  defaultVariants: {
+    crossAlign: 'center'
+  }
+});
+
+// ── Typography ───────────────────────────────────────────────────────────────
+
+export const listItemTitleVariants = cva([COLOR_TEXT_PRIMARY, 'font-medium'], {
+  variants: {
+    size: {
+      default: 'text-base leading-snug',
+      compact: 'text-sm leading-snug'
+    }
+  },
+  defaultVariants: {
+    size: 'default'
+  }
+});
+export const listItemDescriptionVariants = cva([COLOR_TEXT_SECONDARY], {
+  variants: {
+    size: {
+      default: 'text-sm leading-normal',
+      compact: 'text-xs leading-normal'
+    }
+  },
+  defaultVariants: {
+    size: 'default'
+  }
+});
+export const listItemMetaVariants = cva([COLOR_TEXT_MUTED], {
+  variants: {
+    size: {
+      default: 'text-xs leading-normal',
+      compact: 'text-[11px] leading-normal'
+    }
+  },
+  defaultVariants: {
+    size: 'default'
+  }
+});
+
+// ── Section header (group label row inside lists / cards) ───────────────────
+
+export const listItemSectionHeaderVariants = cva(['flex-row items-center justify-between gap-2 border-b border-solid px-4 py-3', COLOR_BORDER_DEFAULT], {
+  variants: {
+    showDivider: {
+      true: ['border-t-4 border-solid border-t-surface-brand-strong/40', 'border-x-0'],
+      false: 'border-t-0'
+    }
+  },
+  defaultVariants: {
+    showDivider: true
+  }
+});
+
+/** Default section-title typography; applied by `ListItem.SectionHeader` for string/number children. Exported for rare custom composition. */
+export const listItemSectionHeaderLabelVariants = cva(['text-xs font-semibold uppercase tracking-wide', COLOR_TEXT_SECONDARY]);
+//# sourceMappingURL=styles.js.map

package/lib/module/components/ListItem/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Platform","cva","COLOR_BORDER_DEFAULT","COLOR_TEXT_MUTED","COLOR_TEXT_PRIMARY","COLOR_TEXT_SECONDARY","TRANSITION_COLORS","listItemRootVariants","select","web","join","default","variants","size","compact","surface","negative","showSeparator","true","false","crossAlign","center","start","compoundVariants","className","defaultVariants","listItemLeadingSlotVariants","listItemTrailingSlotVariants","listItemContentVariants","listItemTitleVariants","listItemDescriptionVariants","listItemMetaVariants","listItemSectionHeaderVariants","showDivider","listItemSectionHeaderLabelVariants"],"sourceRoot":"../../../../src","sources":["components/ListItem/styles.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/components/index.js

@@ -15,6 +15,7 @@ export * from './Image';
 export * from './Input';
 export * from './OtpInput';
 export * from './Link';
+export * from './ListItem';
 export * from './ProgressBar';
 export * from './ProgressSegmented';
 export * from './Select';

package/lib/module/components/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["HStack","VStack"],"sourceRoot":"../../../src","sources":["components/index.ts"],"mappings":";;AAAA,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,eAAe;AAC7B,cAAc,OAAO;AACrB,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,SAAS;AACvB,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,eAAe;AAC7B,cAAc,qBAAqB;AACnC,cAAc,UAAU;AACxB,cAAc,mBAAmB;AACjC,cAAc,UAAU;AACxB,SAASA,MAAM,EAAEC,MAAM,QAAQ,SAAS;AACxC,cAAc,WAAW;AACzB,cAAc,QAAQ;AACtB,cAAc,QAAQ;AACtB,cAAc,cAAc","ignoreList":[]}
+{"version":3,"names":["HStack","VStack"],"sourceRoot":"../../../src","sources":["components/index.ts"],"mappings":";;AAAA,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,eAAe;AAC7B,cAAc,OAAO;AACrB,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,SAAS;AACvB,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,eAAe;AAC7B,cAAc,qBAAqB;AACnC,cAAc,UAAU;AACxB,cAAc,mBAAmB;AACjC,cAAc,UAAU;AACxB,SAASA,MAAM,EAAEC,MAAM,QAAQ,SAAS;AACxC,cAAc,WAAW;AACzB,cAAc,QAAQ;AACtB,cAAc,QAAQ;AACtB,cAAc,cAAc","ignoreList":[]}

package/lib/typescript/components/Card/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/styles.ts"],"names":[],"mappings":"AAWA,eAAO,MAAM,gBAAgB,oFAM3B,CAAC;AAIH,eAAO,MAAM,kBAAkB,oFAG7B,CAAC;AAIH,eAAO,MAAM,iBAAiB,oFAAkB,CAAC;AAIjD,eAAO,MAAM,mBAAmB,oFAAmC,CAAC;AAIpE,eAAO,MAAM,kBAAkB,oFAI7B,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/styles.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,gBAAgB,oFAK3B,CAAC;AAIH,eAAO,MAAM,kBAAkB,oFAI7B,CAAC;AAIH,eAAO,MAAM,iBAAiB,oFAAkB,CAAC;AAIjD,eAAO,MAAM,mBAAmB,oFAAuC,CAAC;AAIxE,eAAO,MAAM,kBAAkB,oFAI7B,CAAC"}

package/lib/typescript/components/ListItem/index.d.ts

@@ -0,0 +1,49 @@
+import { Text, View, type TextProps, type ViewProps } from 'react-native';
+import { type IListItemLeadingSlotProps, type IListItemProps, type IListItemSectionHeaderProps, type ListItemCrossAlign } from '@cdx-ui/primitives';
+import { type WithStyleContextProps } from '@cdx-ui/utils';
+import { type ListItemVariantProps } from './styles';
+export interface ListItemProps extends IListItemProps, WithStyleContextProps {
+    className?: string;
+}
+declare const ListItemRoot: import("react").ForwardRefExoticComponent<ListItemProps & import("react").RefAttributes<View>>;
+export interface ListItemLeadingSlotProps extends IListItemLeadingSlotProps {
+    className?: string;
+}
+declare const ListItemLeadingSlot: import("react").ForwardRefExoticComponent<ListItemLeadingSlotProps & import("react").RefAttributes<View>>;
+export interface ListItemContentProps extends ViewProps {
+    className?: string;
+}
+declare const ListItemContent: import("react").ForwardRefExoticComponent<ListItemContentProps & import("react").RefAttributes<View>>;
+export interface ListItemTitleProps extends TextProps {
+    className?: string;
+}
+declare const ListItemTitle: import("react").ForwardRefExoticComponent<ListItemTitleProps & import("react").RefAttributes<Text>>;
+export interface ListItemDescriptionProps extends TextProps {
+    className?: string;
+}
+declare const ListItemDescription: import("react").ForwardRefExoticComponent<ListItemDescriptionProps & import("react").RefAttributes<Text>>;
+export interface ListItemMetaProps extends TextProps {
+    className?: string;
+}
+declare const ListItemMeta: import("react").ForwardRefExoticComponent<ListItemMetaProps & import("react").RefAttributes<Text>>;
+export interface ListItemTrailingSlotProps extends ViewProps {
+    className?: string;
+}
+declare const ListItemTrailingSlot: import("react").ForwardRefExoticComponent<ListItemTrailingSlotProps & import("react").RefAttributes<View>>;
+export interface ListItemSectionHeaderComponentProps extends IListItemSectionHeaderProps {
+    className?: string;
+}
+declare const ListItemSectionHeader: import("react").ForwardRefExoticComponent<ListItemSectionHeaderComponentProps & import("react").RefAttributes<View>>;
+type ListItemCompound = typeof ListItemRoot & {
+    LeadingSlot: typeof ListItemLeadingSlot;
+    Content: typeof ListItemContent;
+    Title: typeof ListItemTitle;
+    Description: typeof ListItemDescription;
+    Meta: typeof ListItemMeta;
+    TrailingSlot: typeof ListItemTrailingSlot;
+    SectionHeader: typeof ListItemSectionHeader;
+};
+export declare const ListItem: ListItemCompound;
+export type { ListItemCrossAlign, ListItemVariantProps };
+export { listItemContentVariants, listItemDescriptionVariants, listItemLeadingSlotVariants, listItemMetaVariants, listItemRootVariants, listItemSectionHeaderLabelVariants, listItemSectionHeaderVariants, listItemTitleVariants, listItemTrailingSlotVariants, } from './styles';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/components/ListItem/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ListItem/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAa,IAAI,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AACrF,OAAO,EAEL,KAAK,yBAAyB,EAC9B,KAAK,cAAc,EACnB,KAAK,2BAA2B,EAChC,KAAK,kBAAkB,EACxB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAyC,KAAK,qBAAqB,EAAE,MAAM,eAAe,CAAC;AAClG,OAAO,EAUL,KAAK,oBAAoB,EAC1B,MAAM,UAAU,CAAC;AA4BlB,MAAM,WAAW,aAAc,SAAQ,cAAc,EAAE,qBAAqB;IAC1E,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,YAAY,gGAgCjB,CAAC;AAQF,MAAM,WAAW,wBAAyB,SAAQ,yBAAyB;IACzE,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,mBAAmB,2GASxB,CAAC;AAIF,MAAM,WAAW,oBAAqB,SAAQ,SAAS;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,eAAe,uGAapB,CAAC;AAIF,MAAM,WAAW,kBAAmB,SAAQ,SAAS;IACnD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,aAAa,qGAclB,CAAC;AAIF,MAAM,WAAW,wBAAyB,SAAQ,SAAS;IACzD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,mBAAmB,2GAaxB,CAAC;AAIF,MAAM,WAAW,iBAAkB,SAAQ,SAAS;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,YAAY,oGAcjB,CAAC;AAIF,MAAM,WAAW,yBAA0B,SAAQ,SAAS;IAC1D,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,oBAAoB,4GAazB,CAAC;AAeF,MAAM,WAAW,mCAAoC,SAAQ,2BAA2B;IACtF,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,qBAAqB,sHAa1B,CAAC;AAQF,KAAK,gBAAgB,GAAG,OAAO,YAAY,GAAG;IAC5C,WAAW,EAAE,OAAO,mBAAmB,CAAC;IACxC,OAAO,EAAE,OAAO,eAAe,CAAC;IAChC,KAAK,EAAE,OAAO,aAAa,CAAC;IAC5B,WAAW,EAAE,OAAO,mBAAmB,CAAC;IACxC,IAAI,EAAE,OAAO,YAAY,CAAC;IAC1B,YAAY,EAAE,OAAO,oBAAoB,CAAC;IAC1C,aAAa,EAAE,OAAO,qBAAqB,CAAC;CAC7C,CAAC;AAEF,eAAO,MAAM,QAAQ,EAQf,gBAAgB,CAAC;AAEvB,YAAY,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,CAAC;AACzD,OAAO,EACL,uBAAuB,EACvB,2BAA2B,EAC3B,2BAA2B,EAC3B,oBAAoB,EACpB,oBAAoB,EACpB,kCAAkC,EAClC,6BAA6B,EAC7B,qBAAqB,EACrB,4BAA4B,GAC7B,MAAM,UAAU,CAAC"}

package/lib/typescript/components/ListItem/styles.d.ts

@@ -0,0 +1,30 @@
+import { type VariantProps } from 'class-variance-authority';
+export declare const listItemRootVariants: (props?: ({
+    size?: "default" | "compact" | null | undefined;
+    surface?: "default" | "negative" | null | undefined;
+    showSeparator?: boolean | null | undefined;
+    crossAlign?: "start" | "center" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const listItemLeadingSlotVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const listItemTrailingSlotVariants: (props?: ({
+    crossAlign?: "start" | "center" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const listItemContentVariants: (props?: ({
+    crossAlign?: "start" | "center" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const listItemTitleVariants: (props?: ({
+    size?: "default" | "compact" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const listItemDescriptionVariants: (props?: ({
+    size?: "default" | "compact" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const listItemMetaVariants: (props?: ({
+    size?: "default" | "compact" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const listItemSectionHeaderVariants: (props?: ({
+    showDivider?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+/** Default section-title typography; applied by `ListItem.SectionHeader` for string/number children. Exported for rare custom composition. */
+export declare const listItemSectionHeaderLabelVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export type ListItemVariantProps = VariantProps<typeof listItemRootVariants>;
+//# sourceMappingURL=styles.d.ts.map

package/lib/typescript/components/ListItem/styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/ListItem/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAWlE,eAAO,MAAM,oBAAoB;;;;;8EAmDhC,CAAC;AAIF,eAAO,MAAM,2BAA2B,oFAAqD,CAAC;AAE9F,eAAO,MAAM,4BAA4B;;8EAUvC,CAAC;AAIH,eAAO,MAAM,uBAAuB;;8EAUlC,CAAC;AAIH,eAAO,MAAM,qBAAqB;;8EAUhC,CAAC;AAEH,eAAO,MAAM,2BAA2B;;8EAUtC,CAAC;AAEH,eAAO,MAAM,oBAAoB;;8EAU/B,CAAC;AAIH,eAAO,MAAM,6BAA6B;;8EAgBzC,CAAC;AAEF,8IAA8I;AAC9I,eAAO,MAAM,kCAAkC,oFAG7C,CAAC;AAEH,MAAM,MAAM,oBAAoB,GAAG,YAAY,CAAC,OAAO,oBAAoB,CAAC,CAAC"}

package/lib/typescript/components/index.d.ts

@@ -13,6 +13,7 @@ export * from './Image';
 export * from './Input';
 export * from './OtpInput';
 export * from './Link';
+export * from './ListItem';
 export * from './ProgressBar';
 export * from './ProgressSegmented';
 export * from './Select';

package/lib/typescript/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,UAAU,CAAC;AACzB,cAAc,mBAAmB,CAAC;AAClC,cAAc,UAAU,CAAC;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AACzC,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,UAAU,CAAC;AACzB,cAAc,mBAAmB,CAAC;AAClC,cAAc,UAAU,CAAC;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AACzC,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cdx-ui/components",
-  "version": "0.0.1-beta.4",
+  "version": "0.0.1-beta.6",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
   "react-native": "src/index.ts",
@@ -67,9 +67,9 @@
     "@gorhom/bottom-sheet": "^5.2.6",
     "class-variance-authority": "^0.7.1",
     "uniwind": "1.6.1",
-    "@cdx-ui/utils": "0.0.1-beta.4",
-    "@cdx-ui/primitives": "0.0.1-beta.4",
-    "@cdx-ui/icons": "0.0.1-beta.4"
+    "@cdx-ui/primitives": "0.0.1-beta.6",
+    "@cdx-ui/utils": "0.0.1-beta.6",
+    "@cdx-ui/icons": "0.0.1-beta.6"
   },
   "devDependencies": {
     "@types/react": "*",

package/src/components/Card/styles.ts

@@ -1,27 +1,20 @@
 import { cva } from 'class-variance-authority';
-import {
-  COLOR_BG_PRIMARY,
-  COLOR_BORDER_DEFAULT,
-  COLOR_TEXT_PRIMARY,
-  RADIUS_SM,
-  SHADOW_SM,
-} from '../../styles/primitives';
 
 // ── Root ────────────────────────────────────────────────────
 
 export const cardRootVariants = cva([
-  COLOR_BG_PRIMARY,
-  `border ${COLOR_BORDER_DEFAULT}`,
-  RADIUS_SM,
-  SHADOW_SM,
+  'bg-surface-primary',
+  'border border-stroke-secondary',
+  'rounded-[var(--border-radius-default)]',
   'overflow-hidden',
 ]);
 
 // ── Header ──────────────────────────────────────────────────
 
 export const cardHeaderVariants = cva([
-  'flex-row items-center justify-between p-4 border-b border-t-8',
-  COLOR_BORDER_DEFAULT,
+  'flex-row items-center justify-between p-4',
+  'border-t-8 border-t-surface-brand-strong',
+  'border-b border-b-solid border-b-stroke-secondary',
 ]);
 
 // ── Title ───────────────────────────────────────────────────
@@ -30,12 +23,12 @@ export const cardTitleVariants = cva(['flex-1']);
 
 // ── Content ─────────────────────────────────────────────────
 
-export const cardContentVariants = cva([COLOR_TEXT_PRIMARY, 'p-4']);
+export const cardContentVariants = cva(['text-content-primary', 'p-4']);
 
 // ── Footer ──────────────────────────────────────────────────
 
 export const cardFooterVariants = cva([
   'p-4 border-t',
-  COLOR_BORDER_DEFAULT,
+  'border-stroke-secondary',
   'flex-row items-center gap-2',
 ]);