@proyecto-viviana/ui 0.4.1 → 0.6.0

package/dist/card/index.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.jsx","names":[],"sources":["../../src/card/index.tsx"],"sourcesContent":["// @ts-nocheck\nimport {\n  type Accessor,\n  type JSX,\n  createContext,\n  createMemo,\n  mergeProps,\n  splitProps,\n  useContext,\n} from \"solid-js\";\nimport {\n  GridListItem as HeadlessGridListItem,\n  GridListSelectionCheckbox,\n  Link as HeadlessLink,\n  filterDOMProps,\n  type GridListItemProps as HeadlessGridListItemProps,\n  type GridListItemRenderProps,\n  type LinkRenderProps,\n} from \"@proyecto-viviana/solidaria-components\";\nimport type { Key } from \"@proyecto-viviana/solid-stately\";\nimport { ActionMenuContext } from \"../menu/ActionMenu\";\nimport { AvatarContext } from \"../avatar\";\nimport { ButtonContext, LinkButtonContext } from \"../button/context\";\nimport { ContentContext, FooterContext, TextContext } from \"../text\";\nimport { DividerContext } from \"../divider\";\nimport { IconContext, IllustrationContext } from \"../icon\";\nimport { Image, ImageContext, ImageCoordinator } from \"../image\";\nimport { SkeletonContext, SkeletonWrapper, useInertAttribute, useIsSkeleton } from \"../skeleton\";\nimport { pressScale } from \"../pressScale\";\nimport { useProviderProps } from \"../provider\";\nimport type { StyleString } from \"../style\";\nimport { color, focusRing, lightDark, space, style } from \"../style\" with { type: \"macro\" };\nimport { meshStrip } from \"../style/meshStrip\";\nimport { mergeStyles } from \"../style/runtime\";\nimport type { UnsafeClassName } from \"../s2-internal/style-utils\";\nimport { getAllowedOverrides } from \"../s2-internal/style-utils\" with { type: \"macro\" };\nimport {\n  getSlottedContextProps,\n  mergeContextRefs,\n  type RefLike,\n  type SpectrumContextValue,\n} from \"../button/spectrum-context\";\n\nexport type CardSize = \"XS\" | \"S\" | \"M\" | \"L\" | \"XL\";\nexport type CardDensity = \"compact\" | \"regular\" | \"spacious\";\nexport type CardVariant = \"primary\" | \"secondary\" | \"tertiary\" | \"quiet\";\nexport type CardMeshVariant = \"ambient\" | \"signal\";\n\nexport interface CardRenderProps {\n  /** The size of the Card. */\n  size: CardSize;\n}\n\nexport interface CardProps extends Omit<\n  HeadlessGridListItemProps<object>,\n  \"class\" | \"style\" | \"children\" | \"ref\"\n> {\n  /** The children of the Card. */\n  children?: JSX.Element | ((renderProps: CardRenderProps) => JSX.Element);\n  /** The size of the Card. @default 'M' */\n  size?: CardSize;\n  /** The amount of internal padding within the Card. @default 'regular' */\n  density?: CardDensity;\n  /** The visual style of the Card. @default 'primary' */\n  variant?: CardVariant;\n  /**\n   * The register's woven hex-mesh weave, painted behind the glass fill —\n   * `ambient` is the quiet mixed gray/blue/orange weave, `signal` the warm\n   * single-hue amber one. Only the filled variants take it; `tertiary` and\n   * `quiet` have no fill for a weave to sit under.\n   */\n  mesh?: CardMeshVariant;\n  /** Seed for the mesh weave, so neighboring cards don't repeat the same pattern. @default 42 */\n  meshSeed?: number;\n  /** Link target for standalone navigable cards. */\n  href?: string;\n  download?: boolean | string;\n  target?: string;\n  rel?: string;\n  /** Spectrum-defined generated classes. */\n  styles?: StyleString;\n  /** Additional CSS class name. Use only as a last resort. */\n  UNSAFE_className?: UnsafeClassName | string;\n  /** Additional inline styles. Use only as a last resort. */\n  UNSAFE_style?: JSX.CSSProperties;\n  /** Backward-compatible class alias. Prefer UNSAFE_className for S2 parity. */\n  class?: string;\n  /** Slot name when used in a Spectrum context. */\n  slot?: string | null;\n  /** Ref for the rendered card element. */\n  ref?: RefLike<HTMLElement>;\n}\n\nexport interface CardPreviewProps extends JSX.HTMLAttributes<HTMLDivElement> {\n  children?: JSX.Element;\n  /**\n   * Recessed fill behind the preview. `inset` sits the region on\n   * `--surface-inset` — the register's console-strip treatment, where the\n   * full-bleed header bar reads sunk into the card rather than flush with it.\n   */\n  background?: \"inset\";\n  /** Spectrum-defined generated classes. */\n  styles?: StyleString;\n  /** Additional CSS class name. Use only as a last resort. */\n  UNSAFE_className?: UnsafeClassName | string;\n  /** Additional inline styles. Use only as a last resort. */\n  UNSAFE_style?: JSX.CSSProperties;\n  ref?: RefLike<HTMLDivElement>;\n}\n\nexport interface AssetCardProps extends Omit<CardProps, \"density\"> {}\nexport interface UserCardProps extends Omit<CardProps, \"density\" | \"variant\"> {\n  variant?: Exclude<CardVariant, \"quiet\">;\n}\nexport interface ProductCardProps extends Omit<CardProps, \"density\" | \"variant\"> {\n  variant?: Exclude<CardVariant, \"quiet\">;\n}\n\n/* Glasselated: the handoff draws one card corner (12px, primitives.tsx:35) and does\n * not shrink it for small cards. The size ramp is kept anyway — an XS card with a\n * 12px corner is nearly a lozenge — but rebased on the register: `card` at the\n * normal sizes, the control corner for the two smallest. */\nconst borderRadius = {\n  default: \"card\",\n  size: {\n    XS: \"control\",\n    S: \"control\",\n  },\n} as const;\n\ntype CardStyleState = Partial<GridListItemRenderProps | LinkRenderProps> & {\n  size: CardSize;\n  density: CardDensity;\n  variant: CardVariant;\n  isCardView?: boolean;\n  isLink?: boolean;\n};\n\nconst card = style<CardStyleState>(\n  {\n    display: \"flex\",\n    flexDirection: \"column\",\n    position: \"relative\",\n    borderRadius,\n    \"--s2-container-bg\": {\n      type: \"backgroundColor\",\n      value: {\n        variant: {\n          primary: \"elevated\",\n          secondary: \"layer-1\",\n        },\n        forcedColors: \"ButtonFace\",\n      },\n    },\n    backgroundColor: {\n      default: \"--s2-container-bg\",\n      variant: {\n        tertiary: \"transparent\",\n        quiet: \"transparent\",\n      },\n    },\n    /* Glasselated: a card is the handoff's `MeshCard surface=\"card\"` (primitives.tsx:35)\n     * — translucent fill, 14px backdrop blur, a 1px `--border-subtle` edge and the\n     * inset rim. The surface token is already translucent, so without the blur the\n     * card just looks washed out; translucency plus blur is what reads as glass, and\n     * the blur can only ride on the element, never on a background-color. The two\n     * transparent variants opt out — there is no fill for a blur to sit under. */\n    backdropFilter: {\n      default: \"var(--blur-card)\",\n      variant: {\n        tertiary: \"none\",\n        quiet: \"none\",\n      },\n    },\n    borderStyle: {\n      default: \"solid\",\n      variant: {\n        tertiary: \"none\",\n        quiet: \"none\",\n      },\n    },\n    borderWidth: 1,\n    borderColor: {\n      default: \"border-subtle\",\n      variant: {\n        tertiary: \"transparent\",\n        quiet: \"transparent\",\n      },\n    },\n    boxShadow: {\n      /* The rim carries resting elevation instead of Spectrum's cast shadow — the\n       * handoff lifts surfaces with blur plus the inset highlight, and declares\n       * `--shadow-*` tokens it then never references. Interactive states keep a real\n       * lift, composed *with* the rim rather than replacing it, so the glass edge\n       * doesn't blink out from under the pointer. */\n      default: \"edge-glass-surface\",\n      isHovered: \"[var(--edge-glass-surface), 0 4px 14px rgb(0 0 0 / 0.22)]\",\n      isFocusVisible: \"[var(--edge-glass-surface), 0 4px 14px rgb(0 0 0 / 0.22)]\",\n      isSelected: \"[var(--edge-glass-surface), 0 4px 14px rgb(0 0 0 / 0.22)]\",\n      forcedColors: \"[0 0 0 1px var(--hcm-buttonborder, ButtonBorder)]\",\n      variant: {\n        tertiary: {\n          default: `[0 0 0 2px ${color(\"gray-100\")}]`,\n          isHovered: `[0 0 0 2px ${color(\"gray-200\")}]`,\n          isFocusVisible: `[0 0 0 2px ${color(\"gray-200\")}]`,\n          isSelected: \"none\",\n          forcedColors: \"[0 0 0 2px var(--hcm-buttonborder, ButtonBorder)]\",\n        },\n        quiet: \"none\",\n      },\n    },\n    forcedColorAdjust: \"none\",\n    transition: \"default\",\n    fontFamily: \"sans\",\n    textDecoration: \"none\",\n    overflow: {\n      default: \"clip\",\n      variant: {\n        quiet: \"visible\",\n      },\n    },\n    contain: \"layout\",\n    disableTapHighlight: true,\n    userSelect: {\n      isCardView: \"none\",\n    },\n    cursor: {\n      isLink: \"pointer\",\n    },\n    width: {\n      size: {\n        XS: 112,\n        S: 192,\n        M: 240,\n        L: 320,\n        XL: 400,\n      },\n      isCardView: \"full\",\n    },\n    /* `height: full` only makes sense inside a CardView, where the grid cell is\n     * definitely sized and the card should fill it. A standalone card in a flex\n     * row must hug its content — a percentage there resolves against the row's\n     * final height (all wrapped lines included), ballooning every card to the\n     * full band. */\n    height: {\n      default: \"auto\",\n      isCardView: \"full\",\n    },\n    \"--card-spacing\": {\n      type: \"paddingTop\",\n      value: {\n        density: {\n          compact: {\n            size: {\n              XS: \"[6px]\",\n              S: 8,\n              M: 12,\n              L: 16,\n              XL: 20,\n            },\n          },\n          regular: {\n            size: {\n              XS: 8,\n              S: 12,\n              M: 16,\n              L: 20,\n              XL: 24,\n            },\n          },\n          spacious: {\n            size: {\n              XS: 12,\n              S: 16,\n              M: 20,\n              L: 24,\n              XL: 28,\n            },\n          },\n        },\n      },\n    },\n    \"--card-padding-y\": {\n      type: \"paddingTop\",\n      value: {\n        default: \"--card-spacing\",\n        variant: {\n          quiet: 0,\n        },\n      },\n    },\n    \"--card-padding-x\": {\n      type: \"paddingStart\",\n      value: {\n        default: \"--card-spacing\",\n        variant: {\n          quiet: 0,\n        },\n      },\n    },\n    paddingY: \"--card-padding-y\",\n    paddingX: \"--card-padding-x\",\n    boxSizing: \"border-box\",\n    ...focusRing(),\n    outlineStyle: {\n      default: \"none\",\n      isFocusVisible: \"solid\",\n      variant: {\n        quiet: \"none\",\n      },\n    },\n  },\n  getAllowedOverrides(),\n);\n\nconst selectionIndicator = style({\n  position: \"absolute\",\n  inset: 0,\n  zIndex: 2,\n  borderRadius,\n  pointerEvents: \"none\",\n  borderWidth: 1,\n  borderStyle: \"solid\",\n  borderColor: \"gray-1000\",\n  transition: \"default\",\n  opacity: {\n    default: 0,\n    isSelected: 1,\n  },\n  outlineColor: lightDark(\"transparent-white-600\", \"transparent-black-600\"),\n  outlineOffset: -4,\n  outlineStyle: {\n    default: \"none\",\n    isStrokeInner: \"solid\",\n  },\n  outlineWidth: 2,\n});\n\nconst preview = style({\n  position: \"relative\",\n  transition: \"default\",\n  overflow: \"clip\",\n  backgroundColor: {\n    background: {\n      inset: \"pasteboard\",\n    },\n  },\n  marginX: \"calc(var(--card-padding-x) * -1)\",\n  marginTop: \"calc(var(--card-padding-y) * -1)\",\n  marginBottom: {\n    \":last-child\": \"calc(var(--card-padding-y) * -1)\",\n  },\n  borderRadius: {\n    isQuiet: borderRadius,\n  },\n  boxShadow: {\n    isQuiet: {\n      isHovered: \"elevated\",\n      isFocusVisible: \"elevated\",\n      isSelected: \"elevated\",\n    },\n  },\n  ...focusRing(),\n  outlineStyle: {\n    default: \"none\",\n    isQuiet: {\n      isFocusVisible: \"solid\",\n    },\n  },\n});\n\nconst image = style({\n  width: \"full\",\n  aspectRatio: {\n    layout: {\n      grid: \"3/2\",\n    },\n  },\n  objectFit: \"cover\",\n  userSelect: \"none\",\n  pointerEvents: \"none\",\n});\n\nconst title = style({\n  font: \"title\",\n  fontSize: {\n    size: {\n      XS: \"title-xs\",\n      S: \"title-xs\",\n      M: \"title-sm\",\n      L: \"title\",\n      XL: \"title-lg\",\n    },\n  },\n  lineClamp: 3,\n  gridArea: \"title\",\n});\n\nconst description = style({\n  font: \"body\",\n  fontSize: {\n    size: {\n      XS: \"body-2xs\",\n      S: \"body-2xs\",\n      M: \"body-xs\",\n      L: \"body-sm\",\n      XL: \"body\",\n    },\n  },\n  lineClamp: 3,\n  gridArea: \"description\",\n});\n\nconst content = style({\n  display: \"grid\",\n  gridTemplateColumns: {\n    default: [\"1fr\"],\n    \":has([data-slot=menu])\": [\"minmax(0, 1fr)\", \"auto\"],\n  },\n  gridTemplateAreas: {\n    default: [\"title\", \"description\"],\n    \":has([data-slot=menu])\": [\"title menu\", \"description description\"],\n  },\n  columnGap: 4,\n  flexGrow: 1,\n  alignItems: \"baseline\",\n  /* Top-packed, not `space-between`. Cards in a row stretch to the tallest sibling, and\n   * with `flexGrow: 1` the content grid inherits all that slack; `space-between` then spent\n   * it BETWEEN the title and the description, so a short card in a tall row rendered its\n   * title at the top, its body pushed to the bottom, and a growing hole in the middle. The\n   * register packs card content to the top and lets the slack fall below it, which is also\n   * what makes a row of uneven cards read as one band of text rather than as text scattered\n   * down each card's own height. The slack still exists — it just collects at the end. */\n  alignContent: \"start\",\n  rowGap: {\n    size: {\n      XS: 4,\n      S: 4,\n      M: space(6),\n      L: space(6),\n      XL: 8,\n    },\n  },\n  paddingTop: {\n    default: \"--card-spacing\",\n    \":first-child\": 0,\n  },\n  paddingBottom: {\n    default: \"calc(var(--card-spacing) * 1.5 / 2)\",\n    \":last-child\": 0,\n  },\n});\n\nconst actionMenu = style({\n  gridArea: \"menu\",\n  marginY: \"calc(-1 * self(height))\",\n});\n\nconst footer = style({\n  display: \"flex\",\n  flexDirection: \"row\",\n  alignItems: \"end\",\n  justifyContent: \"space-between\",\n  gap: 8,\n  paddingTop: \"calc(var(--card-spacing) * 1.5 / 2)\",\n});\n\nconst displayContents = style({\n  display: \"contents\",\n});\n\nconst cardCheckboxContainer = style({\n  position: \"absolute\",\n  top: \"--card-spacing\",\n  insetStart: \"--card-spacing\",\n  zIndex: 2,\n  padding: 4,\n  backgroundColor: lightDark(\"transparent-white-600\", \"transparent-black-600\"),\n  borderRadius: \"default\",\n  boxShadow: \"emphasized\",\n});\n\nconst cardCheckboxInput = style({\n  display: \"block\",\n  margin: 0,\n  size: {\n    size: {\n      XS: 16,\n      S: 16,\n      M: 18,\n      L: 20,\n      XL: 22,\n    },\n  },\n});\n\nconst previewClip = style({\n  borderRadius: \"inherit\",\n  overflow: \"clip\",\n});\n\nconst collection = style({\n  display: \"grid\",\n  gridTemplateColumns: \"repeat(3, 1fr)\",\n  gap: {\n    default: 4,\n    size: {\n      XS: 2,\n      S: 2,\n    },\n  },\n});\n\nconst collectionImage = style({\n  width: \"full\",\n  aspectRatio: {\n    default: \"square\",\n    \":nth-last-child(4):first-child\": \"3/2\",\n  },\n  gridColumnEnd: {\n    \":nth-last-child(4):first-child\": \"span 3\",\n  },\n  objectFit: \"cover\",\n  pointerEvents: \"none\",\n  userSelect: \"none\",\n});\n\nconst assetImage = style({\n  width: \"full\",\n  aspectRatio: {\n    layout: {\n      grid: \"square\",\n    },\n  },\n  objectFit: \"contain\",\n  pointerEvents: \"none\",\n  userSelect: \"none\",\n});\n\nconst assetIllustrationWrapper = style({\n  display: \"flex\",\n  alignItems: \"center\",\n  justifyContent: \"center\",\n  backgroundColor: \"gray-100\",\n  aspectRatio: \"square\",\n});\n\nconst assetIllustration = style({\n  height: \"auto\",\n  maxSize: 160,\n  width: \"50%\",\n});\n\nconst userImage = style({\n  width: \"full\",\n  aspectRatio: \"3/1\",\n  objectFit: \"cover\",\n  pointerEvents: \"none\",\n  userSelect: \"none\",\n});\n\nconst userAvatar = style({\n  position: \"relative\",\n  marginTop: {\n    default: 0,\n    \":is([slot=preview] + *)\": \"calc(var(--size) / -2)\",\n  },\n});\n\nconst productPreviewImage = style({\n  width: \"full\",\n  aspectRatio: \"5/1\",\n  objectFit: \"cover\",\n  pointerEvents: \"none\",\n  userSelect: \"none\",\n});\n\nconst productThumbnail = style({\n  position: \"relative\",\n  pointerEvents: \"none\",\n  userSelect: \"none\",\n  size: {\n    size: {\n      XS: 24,\n      S: 36,\n      M: 40,\n      L: 44,\n      XL: 56,\n    },\n  },\n  borderRadius: {\n    default: \"default\",\n    size: {\n      XS: \"sm\",\n      S: \"sm\",\n    },\n  },\n  objectFit: \"cover\",\n  marginTop: {\n    default: 0,\n    \":is([slot=preview] + *)\": \"calc(self(height) / -2)\",\n  },\n  outlineStyle: \"solid\",\n  outlineWidth: {\n    default: 2,\n    size: {\n      XS: 1,\n    },\n  },\n  outlineColor: \"--s2-container-bg\",\n});\n\nconst productFooter = style({\n  justifyContent: \"end\",\n});\n\nexport const InternalCardViewContext = createContext({\n  ElementType: \"div\" as \"div\" | typeof HeadlessGridListItem,\n  layout: \"grid\" as \"grid\" | \"waterfall\",\n});\n\nexport const CardContext = createContext<SpectrumContextValue<CardProps>>(null);\n\ninterface InternalCardContextValue {\n  isQuiet: boolean;\n  size: CardSize;\n  itemKey?: Key;\n  isSelected: boolean;\n  isHovered: boolean;\n  isFocusVisible: boolean;\n  isPressed: boolean;\n  isCheckboxSelection: boolean;\n}\n\nconst InternalCardContext = createContext<InternalCardContextValue>({\n  isQuiet: false,\n  size: \"M\",\n  isSelected: false,\n  isHovered: false,\n  isFocusVisible: false,\n  isPressed: false,\n  isCheckboxSelection: true,\n});\n\n/* AssetCard previews accept an icon standing in for an illustration (viviana-ui\n * ships no illustration set yet). The square-wrapper treatment must apply ONLY\n * inside the preview slot — providing IconContext at the card level would leak\n * the wrapper into the Content ActionMenu's own icon — so AssetCard raises this\n * flag and CardPreview scopes the provider to its children. */\nconst InternalAssetPreviewContext = createContext(false);\n\nconst actionButtonSize = {\n  XS: \"XS\",\n  S: \"XS\",\n  M: \"S\",\n  L: \"M\",\n  XL: \"L\",\n} as const;\n\nconst avatarSize = {\n  XS: 24,\n  S: 48,\n  M: 64,\n  L: 64,\n  XL: 80,\n} as const;\n\nconst buttonSize = {\n  XS: \"S\",\n  S: \"S\",\n  M: \"M\",\n  L: \"L\",\n  XL: \"XL\",\n} as const;\n\nfunction renderCardChildren(\n  children: CardProps[\"children\"],\n  renderProps: CardRenderProps,\n): JSX.Element {\n  return typeof children === \"function\" ? children(renderProps) : children;\n}\n\nfunction CardProviders(props: {\n  size: CardSize;\n  layout: \"grid\" | \"waterfall\";\n  isSkeleton: Accessor<boolean>;\n  children: JSX.Element;\n}): JSX.Element {\n  return (\n    <ImageContext.Provider value={{ alt: \"\", styles: image({ layout: props.layout }) }}>\n      <TextContext.Provider\n        value={{\n          slots: {\n            default: {},\n            title: { styles: title({ size: props.size }) },\n            description: { styles: description({ size: props.size }) },\n          },\n        }}\n      >\n        <ContentContext.Provider value={{ styles: content({ size: props.size }) }}>\n          <DividerContext.Provider value={{ size: \"S\" }}>\n            <FooterContext.Provider value={{ styles: footer }}>\n              <ActionMenuContext.Provider\n                value={{\n                  isQuiet: true,\n                  size: actionButtonSize[props.size],\n                  isDisabled: props.isSkeleton(),\n                  \"data-slot\": \"menu\",\n                  styles: actionMenu,\n                }}\n              >\n                <SkeletonContext.Provider value={props.isSkeleton}>\n                  <ImageCoordinator>{props.children}</ImageCoordinator>\n                </SkeletonContext.Provider>\n              </ActionMenuContext.Provider>\n            </FooterContext.Provider>\n          </DividerContext.Provider>\n        </ContentContext.Provider>\n      </TextContext.Provider>\n    </ImageContext.Provider>\n  );\n}\n\nfunction SelectionIndicator(): JSX.Element {\n  const context = useContext(InternalCardContext);\n  return (\n    <div\n      class={selectionIndicator({\n        size: context.size,\n        isSelected: context.isSelected,\n        isStrokeInner: context.isQuiet && !context.isCheckboxSelection,\n      })}\n      aria-hidden=\"true\"\n    />\n  );\n}\n\nfunction CardCheckbox(): JSX.Element {\n  const context = useContext(InternalCardContext);\n\n  if (context.itemKey == null) {\n    return null as unknown as JSX.Element;\n  }\n\n  return (\n    <div\n      class={cardCheckboxContainer}\n      onClick={(event) => event.stopPropagation()}\n      onKeyDown={(event) => event.stopPropagation()}\n    >\n      <GridListSelectionCheckbox\n        itemKey={context.itemKey}\n        class={cardCheckboxInput({ size: context.size })}\n        excludeFromTabOrder\n      />\n    </div>\n  );\n}\n\nfunction cardClassName(\n  local: Pick<CardProps, \"UNSAFE_className\" | \"class\" | \"styles\">,\n  renderProps: Partial<GridListItemRenderProps | LinkRenderProps> & {\n    size: CardSize;\n    density: CardDensity;\n    variant: CardVariant;\n    isCardView?: boolean;\n    isLink?: boolean;\n  },\n): string {\n  return [local.UNSAFE_className, local.class, card(renderProps, local.styles)]\n    .filter(Boolean)\n    .join(\" \");\n}\n\nfunction toInternalCardContext(input: {\n  size: CardSize;\n  itemKey?: Key;\n  isQuiet: boolean;\n  isSelected?: boolean;\n  isHovered?: boolean;\n  isFocusVisible?: boolean;\n  isPressed?: boolean;\n  isCheckboxSelection?: boolean;\n}): InternalCardContextValue {\n  return {\n    size: input.size,\n    itemKey: input.itemKey,\n    isQuiet: input.isQuiet,\n    isSelected: input.isSelected ?? false,\n    isHovered: input.isHovered ?? false,\n    isFocusVisible: input.isFocusVisible ?? false,\n    isPressed: input.isPressed ?? false,\n    isCheckboxSelection: input.isCheckboxSelection ?? false,\n  };\n}\n\n/**\n * A Card summarizes an object that a user can select or navigate to.\n */\nexport function Card(props: CardProps): JSX.Element {\n  const providerProps = useProviderProps(props);\n  const contextProps = getSlottedContextProps(useContext(CardContext), props.slot);\n  const merged = mergeProps(\n    { size: \"M\" as CardSize, density: \"regular\" as CardDensity, variant: \"primary\" as CardVariant },\n    providerProps,\n    contextProps ?? {},\n    props,\n  ) as CardProps;\n  const [local, otherProps] = splitProps(merged, [\n    \"children\",\n    \"size\",\n    \"density\",\n    \"variant\",\n    \"mesh\",\n    \"meshSeed\",\n    \"styles\",\n    \"UNSAFE_className\",\n    \"UNSAFE_style\",\n    \"class\",\n    \"id\",\n    \"textValue\",\n    \"href\",\n    \"download\",\n    \"target\",\n    \"rel\",\n    \"slot\",\n    \"ref\",\n    \"isDisabled\",\n  ]);\n  const { ElementType, layout } = useContext(InternalCardViewContext);\n  const isSkeleton = useIsSkeleton();\n  const inertRef = useInertAttribute(isSkeleton);\n  let rootElement: HTMLElement | undefined;\n  const assignRootRef = mergeContextRefs(\n    (contextProps as { ref?: RefLike<HTMLElement> } | null)?.ref,\n    props.ref,\n    inertRef,\n    (element: HTMLElement) => {\n      rootElement = element;\n    },\n  );\n  const size = () => local.size ?? \"M\";\n  const density = () => local.density ?? \"regular\";\n  const variant = () => local.variant ?? \"primary\";\n  const isQuiet = () => variant() === \"quiet\";\n  const itemKey = () => local.id as Key | undefined;\n  /* The weave is a seeded runtime data URI with per-scheme hues, so neither the\n   * style macro (build-time classes) nor light-dark() (colors only) can carry\n   * it. It rides the same space-toggle atoms every compiled color already\n   * flips on — `initial` fires a slot's var() fallback, `\" \"` suppresses it —\n   * which setColorScheme() maintains on every Provider root. */\n  const meshBackground = createMemo(() => {\n    const mesh = local.mesh;\n    if (mesh == null || variant() === \"tertiary\" || variant() === \"quiet\") {\n      return undefined;\n    }\n    const light = meshStrip({ dark: false, variant: mesh, seed: local.meshSeed });\n    const dark = meshStrip({ dark: true, variant: mesh, seed: local.meshSeed });\n    return `var(--lightningcss-light, ${light}) var(--lightningcss-dark, ${dark})`;\n  });\n  const meshVariant = () => (meshBackground() != null ? local.mesh : undefined);\n  const rootStyle = () => {\n    const backgroundImage = meshBackground();\n    return backgroundImage == null\n      ? local.UNSAFE_style\n      : { \"background-image\": backgroundImage, ...local.UNSAFE_style };\n  };\n  const children = () => (\n    <CardProviders size={size()} layout={layout} isSkeleton={isSkeleton}>\n      {renderCardChildren(local.children, { size: size() })}\n    </CardProviders>\n  );\n  const press = () => pressScale(() => rootElement, rootStyle());\n\n  if (ElementType === \"div\" && !isSkeleton() && local.href) {\n    return (\n      <HeadlessLink\n        {...filterDOMProps(otherProps as Record<string, unknown>, { global: true })}\n        href={local.href}\n        download={local.download}\n        target={local.target}\n        rel={local.rel}\n        isDisabled={local.isDisabled}\n        ref={(element: HTMLElement) => assignRootRef(element)}\n        class={(renderProps) =>\n          cardClassName(local, {\n            ...renderProps,\n            size: size(),\n            density: density(),\n            variant: variant(),\n            isCardView: false,\n            isLink: true,\n          })\n        }\n        style={(renderProps) => (isQuiet() ? (local.UNSAFE_style ?? {}) : press()(renderProps))}\n        data-size={size()}\n        data-density={density()}\n        data-variant={variant()}\n        data-mesh={meshVariant()}\n      >\n        {(renderProps: LinkRenderProps) => (\n          <InternalCardContext.Provider\n            value={toInternalCardContext({\n              size: size(),\n              itemKey: itemKey(),\n              isQuiet: isQuiet(),\n              isHovered: renderProps.isHovered,\n              isFocusVisible: renderProps.isFocusVisible,\n              isPressed: renderProps.isPressed,\n            })}\n          >\n            {children()}\n          </InternalCardContext.Provider>\n        )}\n      </HeadlessLink>\n    );\n  }\n\n  if (ElementType === \"div\" || isSkeleton()) {\n    return (\n      <div\n        {...filterDOMProps(otherProps as Record<string, unknown>, { global: true })}\n        id={local.id != null ? String(local.id) : undefined}\n        ref={(element) => assignRootRef(element)}\n        class={cardClassName(local, {\n          size: size(),\n          density: density(),\n          variant: variant(),\n          isCardView: ElementType !== \"div\",\n        })}\n        style={rootStyle()}\n        data-size={size()}\n        data-density={density()}\n        data-variant={variant()}\n        data-mesh={meshVariant()}\n      >\n        <InternalCardContext.Provider\n          value={toInternalCardContext({\n            size: size(),\n            itemKey: itemKey(),\n            isQuiet: isQuiet(),\n          })}\n        >\n          {children()}\n        </InternalCardContext.Provider>\n      </div>\n    );\n  }\n\n  return (\n    <HeadlessGridListItem\n      {...otherProps}\n      id={local.id}\n      textValue={local.textValue}\n      ref={(element: HTMLElement) => assignRootRef(element)}\n      class={(renderProps) =>\n        cardClassName(local, {\n          ...renderProps,\n          size: size(),\n          density: density(),\n          variant: variant(),\n          isCardView: true,\n          isLink: !!local.href,\n        })\n      }\n      style={(renderProps) => (isQuiet() ? (local.UNSAFE_style ?? {}) : press()(renderProps))}\n      data-size={size()}\n      data-density={density()}\n      data-variant={variant()}\n      data-mesh={meshVariant()}\n    >\n      {(renderProps: GridListItemRenderProps) => {\n        const isCheckboxSelection =\n          renderProps.selectionMode !== \"none\" && renderProps.selectionBehavior === \"toggle\";\n        return (\n          <InternalCardContext.Provider\n            value={toInternalCardContext({\n              size: size(),\n              itemKey: itemKey(),\n              isQuiet: isQuiet(),\n              isSelected: renderProps.isSelected,\n              isHovered: renderProps.isHovered,\n              isFocusVisible: renderProps.isFocusVisible,\n              isPressed: renderProps.isPressed,\n              isCheckboxSelection,\n            })}\n          >\n            {!isQuiet() && <SelectionIndicator />}\n            {!isQuiet() && isCheckboxSelection && <CardCheckbox />}\n            <div class={displayContents}>{children()}</div>\n          </InternalCardContext.Provider>\n        );\n      }}\n    </HeadlessGridListItem>\n  );\n}\n\nexport function CardPreview(props: CardPreviewProps): JSX.Element {\n  const context = useContext(InternalCardContext);\n  const isAssetPreview = useContext(InternalAssetPreviewContext);\n  const [local, domProps] = splitProps(props, [\n    \"children\",\n    \"background\",\n    \"styles\",\n    \"UNSAFE_className\",\n    \"UNSAFE_style\",\n    \"class\",\n    \"ref\",\n  ]);\n  let previewElement: HTMLDivElement | undefined;\n  const assignPreviewRef = mergeContextRefs(props.ref, (element: HTMLDivElement) => {\n    previewElement = element;\n  });\n  const className = () =>\n    [\n      local.UNSAFE_className,\n      local.class,\n      preview(\n        {\n          size: context.size,\n          isQuiet: context.isQuiet,\n          isHovered: context.isHovered,\n          isFocusVisible: context.isFocusVisible,\n          isSelected: context.isSelected,\n          background: local.background,\n        },\n        local.styles,\n      ),\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n  return (\n    <div\n      {...filterDOMProps(domProps as Record<string, unknown>, { global: true })}\n      slot=\"preview\"\n      ref={(element) => assignPreviewRef(element)}\n      class={className()}\n      style={\n        context.isQuiet\n          ? pressScale(() => previewElement, local.UNSAFE_style)({ isPressed: context.isPressed })\n          : local.UNSAFE_style\n      }\n    >\n      {context.isQuiet && <SelectionIndicator />}\n      {context.isQuiet && context.isCheckboxSelection && <CardCheckbox />}\n      <div class={previewClip}>\n        {isAssetPreview ? (\n          <IconContext.Provider\n            value={{\n              render: (icon) => (\n                <SkeletonWrapper>\n                  <div class={assetIllustrationWrapper}>{icon}</div>\n                </SkeletonWrapper>\n              ),\n              styles: assetIllustration,\n            }}\n          >\n            {local.children}\n          </IconContext.Provider>\n        ) : (\n          local.children\n        )}\n      </div>\n    </div>\n  );\n}\n\nexport function CollectionCardPreview(props: CardPreviewProps): JSX.Element {\n  const context = useContext(InternalCardContext);\n  return (\n    <CardPreview {...props}>\n      <div class={collection({ size: context.size })}>\n        {/* `collectionImage` takes no size condition, so the macro bakes it to a class string,\n            not a selector function — passing `size` here threw at render. Inherited from the\n            port; unnoticed because nothing rendered a collection preview until now. */}\n        <ImageContext.Provider value={{ styles: collectionImage }}>\n          {props.children}\n        </ImageContext.Provider>\n      </div>\n    </CardPreview>\n  );\n}\n\nexport function AssetCard(props: AssetCardProps): JSX.Element {\n  const { layout } = useContext(InternalCardViewContext);\n  return (\n    <Card {...props} density=\"regular\">\n      {(renderProps) => (\n        <ImageContext.Provider value={{ alt: \"\", styles: assetImage({ layout }) }}>\n          <IllustrationContext.Provider\n            value={{\n              render: (icon) => (\n                <SkeletonWrapper>\n                  <div class={assetIllustrationWrapper}>{icon}</div>\n                </SkeletonWrapper>\n              ),\n              styles: assetIllustration,\n            }}\n          >\n            <InternalAssetPreviewContext.Provider value={true}>\n              {renderCardChildren(props.children, renderProps)}\n            </InternalAssetPreviewContext.Provider>\n          </IllustrationContext.Provider>\n        </ImageContext.Provider>\n      )}\n    </Card>\n  );\n}\n\nexport function UserCard(props: UserCardProps): JSX.Element {\n  return (\n    <Card {...props} density=\"spacious\">\n      {(renderProps) => (\n        <ImageContext.Provider value={{ alt: \"\", styles: userImage }}>\n          <AvatarContext.Provider\n            value={{\n              size: avatarSize[renderProps.size],\n              UNSAFE_style: {\n                \"--size\": `${avatarSize[renderProps.size] / 16}rem`,\n              },\n              styles: userAvatar,\n              isOverBackground: true,\n            }}\n          >\n            {renderCardChildren(props.children, renderProps)}\n          </AvatarContext.Provider>\n        </ImageContext.Provider>\n      )}\n    </Card>\n  );\n}\n\nexport function ProductCard(props: ProductCardProps): JSX.Element {\n  return (\n    <Card {...props} density=\"spacious\">\n      {(renderProps) => (\n        <ImageContext.Provider\n          value={{\n            slots: {\n              preview: {\n                alt: \"\",\n                styles: productPreviewImage,\n              },\n              thumbnail: {\n                alt: \"\",\n                styles: productThumbnail({ size: renderProps.size }),\n              },\n            },\n          }}\n        >\n          <FooterContext.Provider value={{ styles: mergeStyles(footer, productFooter) }}>\n            <ButtonContext.Provider value={{ size: buttonSize[renderProps.size] }}>\n              <LinkButtonContext.Provider value={{ size: buttonSize[renderProps.size] }}>\n                {renderCardChildren(props.children, renderProps)}\n              </LinkButtonContext.Provider>\n            </ButtonContext.Provider>\n          </FooterContext.Provider>\n        </ImageContext.Provider>\n      )}\n    </Card>\n  );\n}\n\nexport { Image };\n"],"mappings":"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"}

package/dist/cardview/index.d.ts

@@ -0,0 +1,49 @@
+import { type JSX } from "solid-js";
+import { Collection, type GridListProps as HeadlessGridListProps } from "@proyecto-viviana/solidaria-components";
+import type { Key } from "@proyecto-viviana/solid-stately";
+import type { StyleString } from "../style";
+import type { UnsafeClassName } from "../s2-internal/style-utils";
+import type { RefLike, SpectrumContextValue } from "../button/spectrum-context";
+export type CardViewLayout = "grid" | "waterfall";
+export type CardViewSize = "XS" | "S" | "M" | "L" | "XL";
+export type CardViewDensity = "compact" | "regular" | "spacious";
+export type CardViewVariant = "primary" | "secondary" | "tertiary" | "quiet";
+export type CardViewSelectionStyle = "checkbox" | "highlight";
+export type CardViewLoadingState = "idle" | "loading" | "loadingMore" | "sorting" | "filtering";
+export interface CardViewProps<T extends object> extends Omit<HeadlessGridListProps<T>, "class" | "style" | "children" | "selectionBehavior" | "isLoading"> {
+    /** The cards contained within the CardView. */
+    children: (item: T) => JSX.Element;
+    /** The layout of the cards. @default 'grid' */
+    layout?: CardViewLayout;
+    /** The size of the cards. @default 'M' */
+    size?: CardViewSize;
+    /** The amount of space between cards. @default 'regular' */
+    density?: CardViewDensity;
+    /** The visual style of the cards. @default 'primary' */
+    variant?: CardViewVariant;
+    /** How selection should be displayed. @default 'checkbox' */
+    selectionStyle?: CardViewSelectionStyle;
+    /** The loading state of the CardView. */
+    loadingState?: CardViewLoadingState;
+    /** Spectrum-defined generated classes. */
+    styles?: StyleString;
+    /** Provides an action bar when cards are selected. */
+    renderActionBar?: (selectedKeys: "all" | Set<Key>) => JSX.Element;
+    /** Additional CSS class name. Use only as a last resort. */
+    UNSAFE_className?: UnsafeClassName | string;
+    /** Additional inline styles. Use only as a last resort. */
+    UNSAFE_style?: JSX.CSSProperties;
+    /** Backward-compatible class alias. Prefer UNSAFE_className for S2 parity. */
+    class?: string;
+    /** Ref for the grid list root element. */
+    ref?: RefLike<HTMLDivElement>;
+}
+export declare const CardViewContext: import("solid-js").Context<SpectrumContextValue<CardViewProps<any>>>;
+/**
+ * A CardView displays a group of related objects, with support for selection and bulk actions.
+ */
+export declare function CardView<T extends object>(props: CardViewProps<T>): JSX.Element;
+export { Collection };
+export { Card, CardPreview, CollectionCardPreview, AssetCard, UserCard, ProductCard, CardContext, Image, } from "../card/index";
+export type { CardProps, CardPreviewProps, AssetCardProps, UserCardProps, ProductCardProps, CardRenderProps, CardDensity, CardSize, CardVariant, } from "../card/index";
+//# sourceMappingURL=index.d.ts.map

package/dist/cardview/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/cardview/index.tsx"],"names":[],"mappings":"AACA,OAAO,EACL,KAAK,GAAG,EAQT,MAAM,UAAU,CAAC;AAClB,OAAO,EACL,UAAU,EAGV,KAAK,aAAa,IAAI,qBAAqB,EAE5C,MAAM,wCAAwC,CAAC;AAChD,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,iCAAiC,CAAC;AAG3D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAI5C,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAElE,OAAO,KAAK,EAAE,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAGhF,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,WAAW,CAAC;AAClD,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;AACzD,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC;AACjE,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,GAAG,OAAO,CAAC;AAC7E,MAAM,MAAM,sBAAsB,GAAG,UAAU,GAAG,WAAW,CAAC;AAC9D,MAAM,MAAM,oBAAoB,GAAG,MAAM,GAAG,SAAS,GAAG,aAAa,GAAG,SAAS,GAAG,WAAW,CAAC;AAEhG,MAAM,WAAW,aAAa,CAAC,CAAC,SAAS,MAAM,CAAE,SAAQ,IAAI,CAC3D,qBAAqB,CAAC,CAAC,CAAC,EACxB,OAAO,GAAG,OAAO,GAAG,UAAU,GAAG,mBAAmB,GAAG,WAAW,CACnE;IACC,+CAA+C;IAC/C,QAAQ,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,GAAG,CAAC,OAAO,CAAC;IACnC,+CAA+C;IAC/C,MAAM,CAAC,EAAE,cAAc,CAAC;IACxB,0CAA0C;IAC1C,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,wDAAwD;IACxD,OAAO,CAAC,EAAE,eAAe,CAAC;IAC1B,6DAA6D;IAC7D,cAAc,CAAC,EAAE,sBAAsB,CAAC;IACxC,yCAAyC;IACzC,YAAY,CAAC,EAAE,oBAAoB,CAAC;IACpC,0CAA0C;IAC1C,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,sDAAsD;IACtD,eAAe,CAAC,EAAE,CAAC,YAAY,EAAE,KAAK,GAAG,GAAG,CAAC,GAAG,CAAC,KAAK,GAAG,CAAC,OAAO,CAAC;IAClE,4DAA4D;IAC5D,gBAAgB,CAAC,EAAE,eAAe,GAAG,MAAM,CAAC;IAC5C,2DAA2D;IAC3D,YAAY,CAAC,EAAE,GAAG,CAAC,aAAa,CAAC;IACjC,8EAA8E;IAC9E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,0CAA0C;IAC1C,GAAG,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAC;CAC/B;AAED,eAAO,MAAM,eAAe,sEAAgE,CAAC;AAkI7F;;GAEG;AACH,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,EAAE,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,OAAO,CA4I/E;AAED,OAAO,EAAE,UAAU,EAAE,CAAC;AACtB,OAAO,EACL,IAAI,EACJ,WAAW,EACX,qBAAqB,EACrB,SAAS,EACT,QAAQ,EACR,WAAW,EACX,WAAW,EACX,KAAK,GACN,MAAM,eAAe,CAAC;AACvB,YAAY,EACV,SAAS,EACT,gBAAgB,EAChB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,eAAe,EACf,WAAW,EACX,QAAQ,EACR,WAAW,GACZ,MAAM,eAAe,CAAC"}

package/dist/cardview/index.js

@@ -0,0 +1,356 @@
+import { mergeStyles } from "../style/runtime.js";
+import { useProviderProps } from "../provider/index.js";
+import { r as mergeContextRefs } from "../_chunk/spectrum-context.js";
+import { Image, ImageCoordinator } from "../image/index.js";
+import { AssetCard, Card, CardContext, CardPreview, CollectionCardPreview, InternalCardViewContext, ProductCard, UserCard } from "../card/index.js";
+import { className, createComponent, effect, getNextElement, getNextMarker, insert, mergeProps, style, template } from "solid-js/web";
+import { createContext, createEffect, createSignal, onCleanup, onMount, splitProps } from "solid-js";
+import { Collection, GridList, GridListItem } from "@proyecto-viviana/solidaria-components";
+//#region src/cardview/index.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<div><!$><!/><!$><!/>`);
+const CardViewContext = createContext(null);
+const layoutOptions = {
+	XS: {
+		compact: {
+			minSpace: 6,
+			minItemSize: 100,
+			maxItemSize: 140
+		},
+		regular: {
+			minSpace: 8,
+			minItemSize: 100,
+			maxItemSize: 140
+		},
+		spacious: {
+			minSpace: 12,
+			minItemSize: 100,
+			maxItemSize: 140
+		}
+	},
+	S: {
+		compact: {
+			minSpace: 8,
+			minItemSize: 150,
+			maxItemSize: 210
+		},
+		regular: {
+			minSpace: 12,
+			minItemSize: 150,
+			maxItemSize: 210
+		},
+		spacious: {
+			minSpace: 16,
+			minItemSize: 150,
+			maxItemSize: 210
+		}
+	},
+	M: {
+		compact: {
+			minSpace: 12,
+			minItemSize: 200,
+			maxItemSize: 280
+		},
+		regular: {
+			minSpace: 16,
+			minItemSize: 200,
+			maxItemSize: 280
+		},
+		spacious: {
+			minSpace: 20,
+			minItemSize: 200,
+			maxItemSize: 280
+		}
+	},
+	L: {
+		compact: {
+			minSpace: 16,
+			minItemSize: 270,
+			maxItemSize: 370
+		},
+		regular: {
+			minSpace: 20,
+			minItemSize: 270,
+			maxItemSize: 370
+		},
+		spacious: {
+			minSpace: 24,
+			minItemSize: 270,
+			maxItemSize: 370
+		}
+	},
+	XL: {
+		compact: {
+			minSpace: 20,
+			minItemSize: 340,
+			maxItemSize: 460
+		},
+		regular: {
+			minSpace: 24,
+			minItemSize: 340,
+			maxItemSize: 460
+		},
+		spacious: {
+			minSpace: 28,
+			minItemSize: 340,
+			maxItemSize: 460
+		}
+	}
+};
+const SIZES = [
+	"XS",
+	"S",
+	"M",
+	"L",
+	"XL"
+];
+const cardViewStyles = function anonymous(props, overrides) {
+	let rules = " ";
+	let height = false;
+	let matches = String(overrides || "").matchAll(/(?:^|\s)(J|G|I|H|_u|_v|_s|__A|_d|_J|z|y|B|A|_P|_9|W|_l|_A|_z|_6|Z|N|L|F|M|K)[^\s]+/g);
+	for (let p of matches) {
+		if (p[1] === "F") height = true;
+		rules += p[0];
+	}
+	if (props.isLoading) rules += " Pc151";
+	else rules += " Pa151";
+	if (props.isEmpty) rules += " sd151";
+	else rules += " se151";
+	rules += " _oa151";
+	rules += " _ta151";
+	if (props.isEmpty) rules += " eb151";
+	else rules += " ee151";
+	if (props.isEmpty) rules += " _Ca151";
+	else rules += " _Cg151";
+	if (props.density === "spacious") {
+		if (props.size === "XL") rules += " Uk151";
+		else if (props.size === "L") rules += " Uj151";
+		else if (props.size === "M") rules += " Ui151";
+		else if (props.size === "S") rules += " Ul151";
+		else if (props.size === "XS") rules += " Ug151";
+	} else if (props.density === "regular") {
+		if (props.size === "XL") rules += " Uj151";
+		else if (props.size === "L") rules += " Ui151";
+		else if (props.size === "M") rules += " Ul151";
+		else if (props.size === "S") rules += " Ug151";
+		else if (props.size === "XS") rules += " Ue151";
+	} else if (props.density === "compact") {
+		if (props.size === "XL") rules += " Ui151";
+		else if (props.size === "L") rules += " Ul151";
+		else if (props.size === "M") rules += " Ug151";
+		else if (props.size === "S") rules += " Ue151";
+		else if (props.size === "XS") rules += " U1DOfn151";
+	}
+	if (props.density === "spacious") {
+		if (props.size === "XL") rules += " qk151";
+		else if (props.size === "L") rules += " qj151";
+		else if (props.size === "M") rules += " qi151";
+		else if (props.size === "S") rules += " ql151";
+		else if (props.size === "XS") rules += " qg151";
+	} else if (props.density === "regular") {
+		if (props.size === "XL") rules += " qj151";
+		else if (props.size === "L") rules += " qi151";
+		else if (props.size === "M") rules += " ql151";
+		else if (props.size === "S") rules += " qg151";
+		else if (props.size === "XS") rules += " qe151";
+	} else if (props.density === "compact") {
+		if (props.size === "XL") rules += " qi151";
+		else if (props.size === "L") rules += " ql151";
+		else if (props.size === "M") rules += " qg151";
+		else if (props.size === "S") rules += " qe151";
+		else if (props.size === "XS") rules += " q1DOfn151";
+	}
+	if (props.size === "XL") rules += " Do1AxKd151";
+	else if (props.size === "L") rules += " DyXgpCd151";
+	else if (props.size === "M") rules += " DzHwgF151";
+	else if (props.size === "S") rules += " DIndvod151";
+	else if (props.size === "XS") rules += " Dl5GOjc151";
+	if (props.isEmpty) {
+		if (props.isFocusVisible) rules += " _Lf151";
+	} else rules += " _Le151";
+	rules += " O8KaFke151";
+	rules += " Olc151";
+	rules += " _Mc151";
+	rules += " _Kb151";
+	if (props.isActionBar) {
+		if (!height) rules += " Fb151";
+	}
+	return rules;
+};
+const wrapperStyles = function anonymous(props, overrides) {
+	let rules = " ";
+	let position = false;
+	let matches = String(overrides || "").matchAll(/(?:^|\s)(J|G|I|H|_u|_v|_s|__A|_d|_J|z|y|B|A|_P|_9|W|_l|_A|_z|_6|Z|N|L|F|M|K)[^\s]+/g);
+	for (let p of matches) {
+		if (p[1] === "_P") position = true;
+		rules += p[0];
+	}
+	if (!position) rules += " _Pc151";
+	rules += " _Nb151";
+	rules += " Pb151";
+	return rules;
+};
+function selectedKeySet(keys) {
+	if (keys === "all") return "all";
+	return new Set(keys ?? []);
+}
+/**
+* A CardView displays a group of related objects, with support for selection and bulk actions.
+*/
+function CardView(props) {
+	const [local, headlessProps] = splitProps(useProviderProps(props), [
+		"children",
+		"layout",
+		"size",
+		"density",
+		"variant",
+		"selectionStyle",
+		"loadingState",
+		"styles",
+		"renderActionBar",
+		"UNSAFE_className",
+		"UNSAFE_style",
+		"class",
+		"ref",
+		"isLoading",
+		"hasMore",
+		"onLoadMore"
+	]);
+	const requestedSize = () => local.size ?? "M";
+	const density = () => local.density ?? "regular";
+	const variant = () => local.variant ?? "primary";
+	const layout = () => local.layout ?? "grid";
+	const selectionStyle = () => local.selectionStyle ?? "checkbox";
+	const isLoading = () => local.isLoading || local.loadingState === "loading" || local.loadingState === "loadingMore";
+	const [maxSizeIndex, setMaxSizeIndex] = createSignal(SIZES.length - 1);
+	let rootElement;
+	const assignRootRef = mergeContextRefs(local.ref, (element) => {
+		rootElement = element;
+	});
+	const updateSize = () => {
+		const width = rootElement?.clientWidth ?? 0;
+		if (width <= 0) {
+			setMaxSizeIndex(SIZES.length - 1);
+			return;
+		}
+		let index = SIZES.length - 1;
+		while (index > 0) {
+			const options = layoutOptions[SIZES[index]][density()];
+			if (width >= options.minItemSize * 2 + options.minSpace * 3) break;
+			index--;
+		}
+		setMaxSizeIndex(index);
+	};
+	onMount(() => {
+		updateSize();
+		if (typeof ResizeObserver !== "function" || !rootElement) return;
+		const observer = new ResizeObserver(updateSize);
+		observer.observe(rootElement);
+		onCleanup(() => observer.disconnect());
+	});
+	createEffect(() => {
+		density();
+		requestedSize();
+		updateSize();
+	});
+	const size = () => SIZES[Math.min(maxSizeIndex(), Math.max(0, SIZES.indexOf(requestedSize())))];
+	const [actionSelectedKeys, setActionSelectedKeys] = createSignal(selectedKeySet(headlessProps.selectedKeys ?? headlessProps.defaultSelectedKeys));
+	createEffect(() => {
+		setActionSelectedKeys(selectedKeySet(headlessProps.selectedKeys ?? headlessProps.defaultSelectedKeys));
+	});
+	const onSelectionChange = (keys) => {
+		setActionSelectedKeys(keys === "all" ? "all" : new Set(keys));
+		headlessProps.onSelectionChange?.(keys);
+	};
+	const className$1 = (renderProps) => [
+		local.UNSAFE_className,
+		local.class,
+		mergeStyles(cardViewStyles({
+			...renderProps,
+			size: size(),
+			density: density(),
+			isLoading: isLoading(),
+			isActionBar: !!local.renderActionBar
+		}), local.styles)
+	].filter(Boolean).join(" ");
+	const cardView = createComponent(InternalCardViewContext.Provider, {
+		get value() {
+			return {
+				ElementType: GridListItem,
+				layout: layout()
+			};
+		},
+		get children() {
+			return createComponent(CardContext.Provider, {
+				get value() {
+					return {
+						size: size(),
+						variant: variant()
+					};
+				},
+				get children() {
+					return createComponent(ImageCoordinator, { get children() {
+						return createComponent(GridList, mergeProps(headlessProps, {
+							ref: (element) => assignRootRef(element),
+							"class": className$1,
+							get style() {
+								return local.UNSAFE_style;
+							},
+							get selectionBehavior() {
+								return selectionStyle() === "highlight" ? "replace" : "toggle";
+							},
+							onSelectionChange,
+							get isLoading() {
+								return isLoading();
+							},
+							get hasMore() {
+								return local.hasMore ?? !!local.onLoadMore;
+							},
+							get onLoadMore() {
+								return local.onLoadMore;
+							},
+							get ["data-layout"]() {
+								return layout();
+							},
+							get ["data-size"]() {
+								return size();
+							},
+							get ["data-requested-size"]() {
+								return requestedSize();
+							},
+							get ["data-density"]() {
+								return density();
+							},
+							get ["data-variant"]() {
+								return variant();
+							},
+							get ["data-selection-style"]() {
+								return selectionStyle();
+							},
+							children: (item) => local.children(item)
+						}));
+					} });
+				}
+			});
+		}
+	});
+	if (!local.renderActionBar) return cardView;
+	return (() => {
+		var _el$ = getNextElement(_tmpl$), _el$2 = _el$.firstChild, [_el$3, _co$] = getNextMarker(_el$2.nextSibling), _el$4 = _el$3.nextSibling, [_el$5, _co$2] = getNextMarker(_el$4.nextSibling);
+		insert(_el$, cardView, _el$3, _co$);
+		insert(_el$, () => local.renderActionBar(actionSelectedKeys()), _el$5, _co$2);
+		effect((_p$) => {
+			var _v$ = wrapperStyles({}, local.styles), _v$2 = local.UNSAFE_style;
+			_v$ !== _p$.e && className(_el$, _p$.e = _v$);
+			_p$.t = style(_el$, _v$2, _p$.t);
+			return _p$;
+		}, {
+			e: void 0,
+			t: void 0
+		});
+		return _el$;
+	})();
+}
+//#endregion
+export { AssetCard, Card, CardContext, CardPreview, CardView, CardViewContext, Collection, CollectionCardPreview, Image, ProductCard, UserCard };
+
+//# sourceMappingURL=index.js.map

package/dist/cardview/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../src/cardview/index.tsx"],"sourcesContent":["// @ts-nocheck\nimport {\n  type JSX,\n  createContext,\n  createEffect,\n  createMemo,\n  createSignal,\n  onCleanup,\n  onMount,\n  splitProps,\n} from \"solid-js\";\nimport {\n  Collection,\n  GridList as HeadlessGridList,\n  GridListItem as HeadlessGridListItem,\n  type GridListProps as HeadlessGridListProps,\n  type GridListRenderProps,\n} from \"@proyecto-viviana/solidaria-components\";\nimport type { Key } from \"@proyecto-viviana/solid-stately\";\nimport { CardContext, InternalCardViewContext } from \"../card/index\";\nimport { ImageCoordinator } from \"../image\";\nimport type { StyleString } from \"../style\";\nimport { focusRing, style } from \"../style\" with { type: \"macro\" };\nimport { mergeStyles } from \"../style/runtime\";\nimport { useProviderProps } from \"../provider\";\nimport type { UnsafeClassName } from \"../s2-internal/style-utils\";\nimport { getAllowedOverrides } from \"../s2-internal/style-utils\" with { type: \"macro\" };\nimport type { RefLike, SpectrumContextValue } from \"../button/spectrum-context\";\nimport { mergeContextRefs } from \"../button/spectrum-context\";\n\nexport type CardViewLayout = \"grid\" | \"waterfall\";\nexport type CardViewSize = \"XS\" | \"S\" | \"M\" | \"L\" | \"XL\";\nexport type CardViewDensity = \"compact\" | \"regular\" | \"spacious\";\nexport type CardViewVariant = \"primary\" | \"secondary\" | \"tertiary\" | \"quiet\";\nexport type CardViewSelectionStyle = \"checkbox\" | \"highlight\";\nexport type CardViewLoadingState = \"idle\" | \"loading\" | \"loadingMore\" | \"sorting\" | \"filtering\";\n\nexport interface CardViewProps<T extends object> extends Omit<\n  HeadlessGridListProps<T>,\n  \"class\" | \"style\" | \"children\" | \"selectionBehavior\" | \"isLoading\"\n> {\n  /** The cards contained within the CardView. */\n  children: (item: T) => JSX.Element;\n  /** The layout of the cards. @default 'grid' */\n  layout?: CardViewLayout;\n  /** The size of the cards. @default 'M' */\n  size?: CardViewSize;\n  /** The amount of space between cards. @default 'regular' */\n  density?: CardViewDensity;\n  /** The visual style of the cards. @default 'primary' */\n  variant?: CardViewVariant;\n  /** How selection should be displayed. @default 'checkbox' */\n  selectionStyle?: CardViewSelectionStyle;\n  /** The loading state of the CardView. */\n  loadingState?: CardViewLoadingState;\n  /** Spectrum-defined generated classes. */\n  styles?: StyleString;\n  /** Provides an action bar when cards are selected. */\n  renderActionBar?: (selectedKeys: \"all\" | Set<Key>) => JSX.Element;\n  /** Additional CSS class name. Use only as a last resort. */\n  UNSAFE_className?: UnsafeClassName | string;\n  /** Additional inline styles. Use only as a last resort. */\n  UNSAFE_style?: JSX.CSSProperties;\n  /** Backward-compatible class alias. Prefer UNSAFE_className for S2 parity. */\n  class?: string;\n  /** Ref for the grid list root element. */\n  ref?: RefLike<HTMLDivElement>;\n}\n\nexport const CardViewContext = createContext<SpectrumContextValue<CardViewProps<any>>>(null);\n\nconst layoutOptions = {\n  XS: {\n    compact: { minSpace: 6, minItemSize: 100, maxItemSize: 140 },\n    regular: { minSpace: 8, minItemSize: 100, maxItemSize: 140 },\n    spacious: { minSpace: 12, minItemSize: 100, maxItemSize: 140 },\n  },\n  S: {\n    compact: { minSpace: 8, minItemSize: 150, maxItemSize: 210 },\n    regular: { minSpace: 12, minItemSize: 150, maxItemSize: 210 },\n    spacious: { minSpace: 16, minItemSize: 150, maxItemSize: 210 },\n  },\n  M: {\n    compact: { minSpace: 12, minItemSize: 200, maxItemSize: 280 },\n    regular: { minSpace: 16, minItemSize: 200, maxItemSize: 280 },\n    spacious: { minSpace: 20, minItemSize: 200, maxItemSize: 280 },\n  },\n  L: {\n    compact: { minSpace: 16, minItemSize: 270, maxItemSize: 370 },\n    regular: { minSpace: 20, minItemSize: 270, maxItemSize: 370 },\n    spacious: { minSpace: 24, minItemSize: 270, maxItemSize: 370 },\n  },\n  XL: {\n    compact: { minSpace: 20, minItemSize: 340, maxItemSize: 460 },\n    regular: { minSpace: 24, minItemSize: 340, maxItemSize: 460 },\n    spacious: { minSpace: 28, minItemSize: 340, maxItemSize: 460 },\n  },\n} as const;\n\nconst SIZES: CardViewSize[] = [\"XS\", \"S\", \"M\", \"L\", \"XL\"];\n\nconst cardViewStyles = style<\n  GridListRenderProps & {\n    size: CardViewSize;\n    density: CardViewDensity;\n    isLoading?: boolean;\n    isActionBar?: boolean;\n  }\n>(\n  {\n    overflowY: {\n      default: \"auto\",\n      isLoading: \"hidden\",\n    },\n    display: {\n      default: \"grid\",\n      isEmpty: \"flex\",\n    },\n    boxSizing: \"border-box\",\n    flexDirection: \"column\",\n    alignItems: {\n      default: \"stretch\",\n      isEmpty: \"center\",\n    },\n    justifyContent: {\n      default: \"start\",\n      isEmpty: \"center\",\n    },\n    gap: {\n      density: {\n        compact: {\n          size: {\n            XS: \"[6px]\",\n            S: 8,\n            M: 12,\n            L: 16,\n            XL: 20,\n          },\n        },\n        regular: {\n          size: {\n            XS: 8,\n            S: 12,\n            M: 16,\n            L: 20,\n            XL: 24,\n          },\n        },\n        spacious: {\n          size: {\n            XS: 12,\n            S: 16,\n            M: 20,\n            L: 24,\n            XL: 28,\n          },\n        },\n      },\n    },\n    gridTemplateColumns: {\n      size: {\n        XS: \"[repeat(auto-fit,minmax(100px,140px))]\",\n        S: \"[repeat(auto-fit,minmax(150px,210px))]\",\n        M: \"[repeat(auto-fit,minmax(200px,280px))]\",\n        L: \"[repeat(auto-fit,minmax(270px,370px))]\",\n        XL: \"[repeat(auto-fit,minmax(340px,460px))]\",\n      },\n    },\n    ...focusRing(),\n    outlineStyle: {\n      default: \"none\",\n      isEmpty: {\n        isFocusVisible: \"solid\",\n      },\n    },\n    outlineOffset: -2,\n    height: {\n      isActionBar: \"full\",\n    },\n  },\n  getAllowedOverrides({ height: true }),\n);\n\nconst wrapperStyles = style(\n  {\n    position: \"relative\",\n    overflow: \"clip\",\n  },\n  getAllowedOverrides({ height: true }),\n);\n\nfunction selectedKeySet(keys: \"all\" | Iterable<Key> | undefined): \"all\" | Set<Key> {\n  if (keys === \"all\") {\n    return \"all\";\n  }\n\n  return new Set(keys ?? []);\n}\n\n/**\n * A CardView displays a group of related objects, with support for selection and bulk actions.\n */\nexport function CardView<T extends object>(props: CardViewProps<T>): JSX.Element {\n  const providerProps = useProviderProps(props);\n  const [local, headlessProps] = splitProps(providerProps, [\n    \"children\",\n    \"layout\",\n    \"size\",\n    \"density\",\n    \"variant\",\n    \"selectionStyle\",\n    \"loadingState\",\n    \"styles\",\n    \"renderActionBar\",\n    \"UNSAFE_className\",\n    \"UNSAFE_style\",\n    \"class\",\n    \"ref\",\n    \"isLoading\",\n    \"hasMore\",\n    \"onLoadMore\",\n  ]);\n  const requestedSize = (): CardViewSize => local.size ?? \"M\";\n  const density = (): CardViewDensity => local.density ?? \"regular\";\n  const variant = (): CardViewVariant => local.variant ?? \"primary\";\n  const layout = (): CardViewLayout => local.layout ?? \"grid\";\n  const selectionStyle = (): CardViewSelectionStyle => local.selectionStyle ?? \"checkbox\";\n  const isLoading = () =>\n    local.isLoading || local.loadingState === \"loading\" || local.loadingState === \"loadingMore\";\n  const [maxSizeIndex, setMaxSizeIndex] = createSignal(SIZES.length - 1);\n  let rootElement: HTMLDivElement | undefined;\n  const assignRootRef = mergeContextRefs(local.ref, (element: HTMLDivElement) => {\n    rootElement = element;\n  });\n\n  const updateSize = () => {\n    const width = rootElement?.clientWidth ?? 0;\n    if (width <= 0) {\n      setMaxSizeIndex(SIZES.length - 1);\n      return;\n    }\n\n    let index = SIZES.length - 1;\n    while (index > 0) {\n      const options = layoutOptions[SIZES[index]][density()];\n      if (width >= options.minItemSize * 2 + options.minSpace * 3) {\n        break;\n      }\n      index--;\n    }\n    setMaxSizeIndex(index);\n  };\n\n  onMount(() => {\n    updateSize();\n    if (typeof ResizeObserver !== \"function\" || !rootElement) {\n      return;\n    }\n\n    const observer = new ResizeObserver(updateSize);\n    observer.observe(rootElement);\n    onCleanup(() => observer.disconnect());\n  });\n\n  createEffect(() => {\n    density();\n    requestedSize();\n    updateSize();\n  });\n\n  const size = (): CardViewSize =>\n    SIZES[Math.min(maxSizeIndex(), Math.max(0, SIZES.indexOf(requestedSize())))];\n  const [actionSelectedKeys, setActionSelectedKeys] = createSignal<\"all\" | Set<Key>>(\n    selectedKeySet(headlessProps.selectedKeys ?? headlessProps.defaultSelectedKeys),\n  );\n  createEffect(() => {\n    setActionSelectedKeys(\n      selectedKeySet(headlessProps.selectedKeys ?? headlessProps.defaultSelectedKeys),\n    );\n  });\n  const onSelectionChange = (keys: \"all\" | Set<Key>) => {\n    setActionSelectedKeys(keys === \"all\" ? \"all\" : new Set(keys));\n    headlessProps.onSelectionChange?.(keys);\n  };\n  const className = (renderProps: GridListRenderProps): string =>\n    [\n      local.UNSAFE_className,\n      local.class,\n      mergeStyles(\n        cardViewStyles({\n          ...renderProps,\n          size: size(),\n          density: density(),\n          isLoading: isLoading(),\n          isActionBar: !!local.renderActionBar,\n        }),\n        local.styles,\n      ),\n    ]\n      .filter(Boolean)\n      .join(\" \");\n\n  const cardView = (\n    <InternalCardViewContext.Provider\n      value={{ ElementType: HeadlessGridListItem, layout: layout() }}\n    >\n      <CardContext.Provider value={{ size: size(), variant: variant() }}>\n        <ImageCoordinator>\n          <HeadlessGridList\n            {...headlessProps}\n            ref={(element: HTMLDivElement) => assignRootRef(element)}\n            class={className}\n            style={local.UNSAFE_style}\n            selectionBehavior={selectionStyle() === \"highlight\" ? \"replace\" : \"toggle\"}\n            onSelectionChange={onSelectionChange}\n            isLoading={isLoading()}\n            hasMore={local.hasMore ?? !!local.onLoadMore}\n            onLoadMore={local.onLoadMore}\n            data-layout={layout()}\n            data-size={size()}\n            data-requested-size={requestedSize()}\n            data-density={density()}\n            data-variant={variant()}\n            data-selection-style={selectionStyle()}\n          >\n            {(item: T) => local.children(item)}\n          </HeadlessGridList>\n        </ImageCoordinator>\n      </CardContext.Provider>\n    </InternalCardViewContext.Provider>\n  );\n\n  if (!local.renderActionBar) {\n    return cardView;\n  }\n\n  return (\n    <div class={wrapperStyles({}, local.styles)} style={local.UNSAFE_style}>\n      {cardView}\n      {local.renderActionBar(actionSelectedKeys())}\n    </div>\n  );\n}\n\nexport { Collection };\nexport {\n  Card,\n  CardPreview,\n  CollectionCardPreview,\n  AssetCard,\n  UserCard,\n  ProductCard,\n  CardContext,\n  Image,\n} from \"../card/index\";\nexport type {\n  CardProps,\n  CardPreviewProps,\n  AssetCardProps,\n  UserCardProps,\n  ProductCardProps,\n  CardRenderProps,\n  CardDensity,\n  CardSize,\n  CardVariant,\n} from \"../card/index\";\n"],"mappings":"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"}