@postenbring/hedwig-react 3.0.6 → 4.0.0

package/dist/card/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/card/index.tsx","../../src/card/card.tsx"],"sourcesContent":["export {\n  Card,\n  CardMedia,\n  CardMediaImg,\n  CardBody,\n  CardBodyHeader,\n  CardBodyHeaderOverline,\n  CardBodyHeaderTitle,\n  CardBodyDescription,\n  CardBodyAction,\n  CardBodyActionArrow,\n} from \"./card\";\n\nexport type * from \"./card\";\n","import type { ReactNode } from \"react\";\nimport { forwardRef } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\n\nexport const CardMedia = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component {...rest} className={clsx(\"hds-card__media\", className as undefined)} ref={ref}>\n        {children}\n      </Component>\n    );\n  },\n);\nCardMedia.displayName = \"Card.Media\";\n\nexport interface CardImageMediaProps extends React.ImgHTMLAttributes<HTMLImageElement> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n  /**\n   * Define image scaling behavior when the image are varies in both width and height across different page breaks and  sizes of the card.\n   * \"crop\": Image always fills the available space.\n   *         If the aspect ratio doesn't match, then the top/bottom or left/right edges are cropped away.\n   * \"scale\": No cropping, image scales to the maximum size available and centers.\n   *          If the aspect ratio doesn't match, then the background will show on the top/bottom or left/right sides of the image.\n   *\n   * @default \"crop\"\n   */\n  variant?: \"crop\" | \"scale\";\n}\nexport const CardMediaImg = forwardRef<HTMLImageElement, CardImageMediaProps>(\n  ({ asChild, variant, className, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"img\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\n          \"hds-card__media__img\",\n          { \"hds-card__img__scale\": variant === \"scale\" },\n          className as undefined,\n        )}\n        ref={ref}\n      />\n    );\n  },\n);\nCardMediaImg.displayName = \"Card.MediaImg\";\n\nexport const CardBody = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component {...rest} className={clsx(\"hds-card__body\", className as undefined)} ref={ref}>\n        <div className={clsx(\"hds-card__centerbody\", className as undefined)}>{children}</div>\n      </Component>\n    );\n  },\n);\nCardBody.displayName = \"Card.Body\";\n\nexport const CardBodyHeader = forwardRef<\n  HTMLHeadingElement,\n  CardBaseProps &\n    (\n      | {\n          /**\n           * Heading level of the card heading\n           */\n          as: \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\";\n          asChild?: never;\n        }\n      | {\n          asChild: true;\n          as?: never;\n        }\n    )\n>(({ as: Tag, asChild, className, children, ...rest }, ref) => {\n  const Component = asChild ? Slot : Tag;\n  return (\n    <Component\n      {...rest}\n      className={clsx(\"hds-card__body-header\", className as undefined)}\n      ref={ref}\n    >\n      {children}\n    </Component>\n  );\n});\nCardBodyHeader.displayName = \"Card.BodyHeader\";\n\nexport const CardBodyHeaderOverline = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"span\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\"hds-card__body-header-overline\", className as undefined)}\n        ref={ref}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nCardBodyHeaderOverline.displayName = \"Card.BodyHeaderOverline\";\n\nexport const CardBodyHeaderTitle = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\"hds-card__body-header-title\", className as undefined)}\n        ref={ref}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nCardBodyHeaderTitle.displayName = \"Card.BodyHeaderTitle\";\n\nexport const CardBodyDescription = forwardRef<HTMLParagraphElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"p\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\"hds-card__body-description\", className as undefined)}\n        ref={ref}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nCardBodyDescription.displayName = \"Card.BodyDescription\";\n\nexport const CardBodyAction = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\"hds-card__body-action\", className as undefined)}\n        ref={ref}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nCardBodyAction.displayName = \"Card.BodyAction\";\n\nexport const CardBodyActionRow = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\"hds-card__body-action-row\", className as undefined)}\n        ref={ref}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nCardBodyActionRow.displayName = \"Card.BodyActionRow\";\n\ninterface CardBodyActionArrowProps extends React.HTMLAttributes<HTMLSpanElement> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n\n  /**\n   * Set direction of the arrow\n   *\n   * @default \"right\"\n   */\n  direction?: \"right\" | \"up-right\";\n}\nexport const CardBodyActionArrow = forwardRef<HTMLSpanElement, CardBodyActionArrowProps>(\n  ({ asChild, className, direction, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"span\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\n          \"hds-card__body-action-arrow\",\n          { \"hds-card__body-action-arrow-up-right\": direction === \"up-right\" },\n          className as undefined,\n        )}\n        ref={ref}\n      />\n    );\n  },\n);\nCardBodyActionArrow.displayName = \"Card.BodyActionArrow\";\n\nexport interface CardBaseProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: ReactNode;\n\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n}\n\nexport interface CardSlimAndMiniatureProps extends CardBaseProps {\n  /**\n   * Change the default rendered element for Card.\n   */\n  as?: \"section\" | \"div\" | \"article\" | \"aside\";\n  /**\n   * Allows for a horizontal variant for sizes above small.\n   *\n   * @default \"slim\"\n   */\n  variant?: \"slim\" | \"miniature\";\n  /**\n   * The color of the card.\n   *\n   * @default \"lighter-brand\"\n   * */\n  color?: \"white\" | \"lighter-brand\" | \"light-grey-fill\";\n\n  /* Only fullwidth or focus cards can have images to the left or right of the text: */\n  imagePosition?: never;\n}\n\nexport interface CardFocusProps extends CardBaseProps {\n  as?: \"section\" | \"div\" | \"article\" | \"aside\";\n  variant: \"focus\";\n  color?: \"darker\" | \"dark\";\n  /**\n   * fullwidth or focus cards can have images to the left or right of the text.\n   *\n   * @default \"left\"\n   * */\n  imagePosition?: \"left\" | \"right\";\n}\n\nexport interface CardFullwidthProps extends CardBaseProps {\n  as?: \"section\" | \"div\" | \"article\" | \"aside\";\n  variant: \"full-width\";\n  color: \"white\" | \"lighter-brand\" | \"light-grey-fill\";\n  /**\n   * fullwidth or focus cards can have images to the left or right of the text.\n   *\n   * @default \"left\"\n   * */\n  imagePosition?: \"left\" | \"right\";\n}\n\nexport type CardProps = CardSlimAndMiniatureProps | CardFocusProps | CardFullwidthProps;\n\nexport const Card = forwardRef<HTMLDivElement, CardProps>(\n  (\n    {\n      as: Tag = \"section\",\n      asChild,\n      className,\n      children,\n      variant = \"slim\",\n      color,\n      imagePosition,\n      ...rest\n    },\n    ref,\n  ) => {\n    const Component = asChild ? Slot : Tag;\n    const effectiveColor = variant === \"focus\" && !color ? \"darker\" : color;\n    return (\n      <Component\n        {...rest}\n        className={clsx(\n          \"hds-card\",\n          { \"hds-card--full-width\": variant === \"full-width\" },\n          { \"hds-card--miniature\": variant === \"miniature\" },\n          { \"hds-card--focus\": variant === \"focus\" },\n          { \"hds-card--slim\": variant === \"slim\" },\n          { \"hds-card--color-white\": effectiveColor === \"white\" },\n          { \"hds-card--color-light-grey-fill\": effectiveColor === \"light-grey-fill\" },\n          { \"hds-card--color-dark\": effectiveColor === \"dark\" },\n          { \"hds-card--color-darker\": effectiveColor === \"darker\" },\n          { \"hds-card--image-position-right\": imagePosition === \"right\" },\n          className as undefined,\n        )}\n        ref={ref}\n      >\n        {variant === \"full-width\" || variant === \"focus\" ? (\n          <div className={clsx(\"hds-card__layoutwrapper\", className as undefined)}>{children}</div>\n        ) : (\n          children\n        )}\n      </Component>\n    );\n  },\n) as CardType;\nCard.displayName = \"Card\";\n\nCard.Media = CardMedia;\nCard.MediaImg = CardMediaImg;\nCard.Body = CardBody;\nCard.BodyHeader = CardBodyHeader;\nCard.BodyHeaderOverline = CardBodyHeaderOverline;\nCard.BodyHeaderTitle = CardBodyHeaderTitle;\nCard.BodyDescription = CardBodyDescription;\nCard.BodyAction = CardBodyAction;\nCard.BodyActionRow = CardBodyActionRow;\nCard.BodyActionArrow = CardBodyActionArrow;\n\ntype CardType = ReturnType<typeof forwardRef<HTMLDivElement, CardProps>> & {\n  Media: typeof CardMedia;\n  MediaImg: typeof CardMediaImg;\n  Body: typeof CardBody;\n  BodyHeader: typeof CardBodyHeader;\n  BodyHeaderOverline: typeof CardBodyHeaderOverline;\n  BodyHeaderTitle: typeof CardBodyHeaderTitle;\n  BodyDescription: typeof CardBodyDescription;\n  BodyAction: typeof CardBodyAction;\n  BodyActionRow: typeof CardBodyActionRow;\n  BodyActionArrow: typeof CardBodyActionArrow;\n};\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/card/index.tsx","../../src/card/card.tsx"],"sourcesContent":["export {\n  Card,\n  CardMedia,\n  CardMediaImg,\n  CardBody,\n  CardBodyHeader,\n  CardBodyHeaderOverline,\n  CardBodyHeaderTitle,\n  CardBodyDescription,\n  CardBodyAction,\n  CardBodyActionArrow,\n} from \"./card\";\n\nexport type * from \"./card\";\n","import type { ReactNode } from \"react\";\nimport { forwardRef } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\n\nexport const CardMedia = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component {...rest} className={clsx(\"hds-card__media\", className as undefined)} ref={ref}>\n        {children}\n      </Component>\n    );\n  },\n);\nCardMedia.displayName = \"Card.Media\";\n\nexport interface CardImageMediaProps extends React.ImgHTMLAttributes<HTMLImageElement> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n  /**\n   * Define image scaling behavior when the image are varies in both width and height across different page breaks and  sizes of the card.\n   * \"crop\": Image always fills the available space.\n   *         If the aspect ratio doesn't match, then the top/bottom or left/right edges are cropped away.\n   * \"scale\": No cropping, image scales to the maximum size available and centers.\n   *          If the aspect ratio doesn't match, then the background will show on the top/bottom or left/right sides of the image.\n   *\n   * @default \"crop\"\n   */\n  variant?: \"crop\" | \"scale\";\n}\nexport const CardMediaImg = forwardRef<HTMLImageElement, CardImageMediaProps>(\n  ({ asChild, variant, className, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"img\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\n          \"hds-card__media__img\",\n          { \"hds-card__img__scale\": variant === \"scale\" },\n          className as undefined,\n        )}\n        ref={ref}\n      />\n    );\n  },\n);\nCardMediaImg.displayName = \"Card.MediaImg\";\n\nexport const CardBody = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component {...rest} className={clsx(\"hds-card__body\", className as undefined)} ref={ref}>\n        <div className={clsx(\"hds-card__centerbody\", className as undefined)}>{children}</div>\n      </Component>\n    );\n  },\n);\nCardBody.displayName = \"Card.Body\";\n\nexport const CardBodyHeader = forwardRef<\n  HTMLHeadingElement,\n  CardBaseProps &\n    (\n      | {\n          /**\n           * Heading level of the card heading\n           */\n          as: \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\";\n          asChild?: never;\n        }\n      | {\n          asChild: true;\n          as?: never;\n        }\n    )\n>(({ as: Tag, asChild, className, children, ...rest }, ref) => {\n  const Component = asChild ? Slot : Tag;\n  return (\n    <Component\n      {...rest}\n      className={clsx(\"hds-card__body-header\", className as undefined)}\n      ref={ref}\n    >\n      {children}\n    </Component>\n  );\n});\nCardBodyHeader.displayName = \"Card.BodyHeader\";\n\nexport const CardBodyHeaderOverline = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"span\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\"hds-card__body-header-overline\", className as undefined)}\n        ref={ref}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nCardBodyHeaderOverline.displayName = \"Card.BodyHeaderOverline\";\n\nexport const CardBodyHeaderTitle = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\"hds-card__body-header-title\", className as undefined)}\n        ref={ref}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nCardBodyHeaderTitle.displayName = \"Card.BodyHeaderTitle\";\n\nexport const CardBodyDescription = forwardRef<HTMLParagraphElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"p\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\"hds-card__body-description\", className as undefined)}\n        ref={ref}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nCardBodyDescription.displayName = \"Card.BodyDescription\";\n\nexport const CardBodyAction = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\"hds-card__body-action\", className as undefined)}\n        ref={ref}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nCardBodyAction.displayName = \"Card.BodyAction\";\n\nexport const CardBodyActionRow = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\"hds-card__body-action-row\", className as undefined)}\n        ref={ref}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nCardBodyActionRow.displayName = \"Card.BodyActionRow\";\n\ninterface CardBodyActionArrowProps extends React.HTMLAttributes<HTMLSpanElement> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n\n  /**\n   * Set direction of the arrow\n   *\n   * @default \"right\"\n   */\n  direction?: \"right\" | \"up-right\";\n}\nexport const CardBodyActionArrow = forwardRef<HTMLSpanElement, CardBodyActionArrowProps>(\n  ({ asChild, className, direction, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"span\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\n          \"hds-card__body-action-arrow\",\n          { \"hds-card__body-action-arrow-up-right\": direction === \"up-right\" },\n          className as undefined,\n        )}\n        ref={ref}\n      />\n    );\n  },\n);\nCardBodyActionArrow.displayName = \"Card.BodyActionArrow\";\n\nexport interface CardBaseProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: ReactNode;\n\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n}\n\n/**\n * @deprecated This interface is deprecated and will be removed in a future release.\n * Use `CardSlimAndMiniatureProps` with props `data-color` and `theme` instead.\n */\nexport interface CardSlimAndMiniaturePropsDeprecated extends CardBaseProps {\n  /**\n   * Change the default rendered element for Card.\n   */\n  as?: \"section\" | \"div\" | \"article\" | \"aside\";\n  /**\n   * Allows for a horizontal variant for sizes above small.\n   *\n   * @default \"slim\"\n   */\n  variant?: \"slim\" | \"miniature\";\n  \"data-color\"?: never;\n  theme?: never;\n  /**\n   * @deprecated\n   * Use props `data-color` and `theme` instead.\n   * These colors will be removed in a future release.\n   */\n  color?: \"white\" | \"lighter-brand\" | \"light-grey-fill\";\n\n  /* Only fullwidth or focus cards can have images to the left or right of the text: */\n  imagePosition?: never;\n}\n\nexport interface CardSlimAndMiniatureProps extends CardBaseProps {\n  /**\n   * Change the default rendered element for Card.\n   */\n  as?: \"section\" | \"div\" | \"article\" | \"aside\";\n  /**\n   * Allows for a horizontal variant for sizes above small.\n   *\n   * @default \"slim\"\n   */\n  variant?: \"slim\" | \"miniature\";\n  /**\n   * Set theme for card\n   * @default \"default\"\n   */\n  theme?: \"default\" | \"tinted\" | \"base\";\n  /**\n   * Set data-color for card.\n   */\n  \"data-color\"?: \"neutral\" | \"posten\" | \"bring\";\n  /* Only fullwidth or focus cards can have images to the left or right of the text: */\n  imagePosition?: never;\n}\n\n/**\n * @deprecated Use Full-width card instead\n */\nexport interface CardFocusProps extends CardBaseProps {\n  /**\n   * Change the default rendered element for Card.\n   */\n  as?: \"section\" | \"div\" | \"article\" | \"aside\";\n  /** @deprecated Use Full-width card instead */\n  variant: \"focus\";\n  /**\n   * @deprecated\n   * Use props `data-color` and `theme` instead.\n   * The color prop will be removed in a future release.\n   */\n  color?: \"darker\" | \"dark\";\n  \"data-color\"?: never;\n  theme?: never;\n  /**\n   * fullwidth or focus cards can have images to the left or right of the text.\n   *\n   * @default \"left\"\n   * */\n  imagePosition?: \"left\" | \"right\";\n}\n\n/**\n * @deprecated This interface is deprecated and will be removed in a future release.\n * Use `CardSlimAndMiniatureProps` with props `data-color` and `theme` instead.\n */\nexport interface CardFullwidthPropsDeprecated extends CardBaseProps {\n  /**\n   * Change the default rendered element for Card.\n   */\n  as?: \"section\" | \"div\" | \"article\" | \"aside\";\n  variant: \"full-width\";\n  \"data-color\"?: never;\n  theme?: never;\n  /**\n   * @deprecated\n   * Use `data-color` and `theme` instead.\n   * The color prop will be removed in a future release.\n   */\n  color: \"white\" | \"lighter-brand\" | \"light-grey-fill\";\n  /**\n   * fullwidth or focus cards can have images to the left or right of the text.\n   *\n   * @default \"left\"\n   * */\n  imagePosition?: \"left\" | \"right\";\n}\n\nexport interface CardFullwidthProps extends CardBaseProps {\n  /**\n   * Change the default rendered element for Card.\n   */\n  as?: \"section\" | \"div\" | \"article\" | \"aside\";\n  variant: \"full-width\";\n  /**\n   * Set theme for card\n   * @default \"default\"\n   */\n  theme?: \"default\" | \"tinted\" | \"base\";\n  /**\n   * Set data-color for card.\n   */\n  \"data-color\"?: \"neutral\" | \"posten\" | \"bring\";\n  /**\n   * fullwidth or focus cards can have images to the left or right of the text.\n   *\n   * @default \"left\"\n   * */\n  imagePosition?: \"left\" | \"right\";\n}\n\nexport type CardProps =\n  | CardSlimAndMiniatureProps\n  | CardFocusProps\n  | CardFullwidthProps\n  | CardSlimAndMiniaturePropsDeprecated\n  | CardFullwidthPropsDeprecated;\n\n/**\n * Converts deprecated colors to current colors\n * @param color\n * @returns\n */\nconst convertDeprecatedColor = (\n  color: string | undefined,\n): Partial<{\n  theme: NonNullable<CardSlimAndMiniatureProps[\"theme\"]>;\n  dataColor: NonNullable<CardSlimAndMiniatureProps[\"data-color\"]>;\n  dataColorScheme: \"light\" | \"dark\";\n}> => {\n  switch (color) {\n    case \"lighter-brand\":\n      return { theme: \"default\" };\n    case \"light-grey-fill\":\n      return { theme: \"base\", dataColor: \"neutral\" };\n    case \"white\":\n      return { theme: \"default\", dataColor: \"neutral\" };\n    case \"dark\":\n      return { theme: \"base\" };\n    case \"darker\":\n      return { theme: \"tinted\", dataColorScheme: \"dark\" };\n    default:\n      return {};\n  }\n};\n\nexport const Card = forwardRef<HTMLDivElement, CardProps>(\n  (\n    {\n      as: Tag = \"section\",\n      asChild,\n      className,\n      children,\n      variant = \"slim\",\n      \"data-color\": dataColorAttr,\n      theme = \"default\",\n      color,\n      imagePosition,\n      ...rest\n    },\n    ref,\n  ) => {\n    const Component = asChild ? Slot : Tag;\n\n    const {\n      theme: themeFromDeprecated,\n      dataColor: dataColorFromDeprecated,\n      dataColorScheme: dataColorSchemeFromDeprecated,\n    } = convertDeprecatedColor(color ?? (variant === \"focus\" ? \"darker\" : undefined));\n\n    return (\n      <Component\n        {...rest}\n        {...(dataColorAttr ? { \"data-color\": dataColorAttr } : {})}\n        {...(dataColorFromDeprecated ? { \"data-color\": dataColorFromDeprecated } : {})}\n        {...(dataColorSchemeFromDeprecated\n          ? { \"data-color-scheme\": dataColorSchemeFromDeprecated }\n          : {})}\n        className={clsx(\n          \"hds-card\",\n          { \"hds-card--full-width\": variant === \"full-width\" },\n          { \"hds-card--miniature\": variant === \"miniature\" },\n          { \"hds-card--focus\": variant === \"focus\" }, // @deprecated\n          { \"hds-card--slim\": variant === \"slim\" },\n          { \"hds-card--theme-default\": (themeFromDeprecated ?? theme) === \"default\" },\n          { \"hds-card--theme-tinted\": (themeFromDeprecated ?? theme) === \"tinted\" },\n          { \"hds-card--theme-base\": (themeFromDeprecated ?? theme) === \"base\" },\n          { \"hds-card--image-position-right\": imagePosition === \"right\" },\n          className as undefined,\n        )}\n        ref={ref}\n      >\n        {variant === \"full-width\" || variant === \"focus\" ? (\n          <div className={clsx(\"hds-card__layoutwrapper\", className as undefined)}>{children}</div>\n        ) : (\n          children\n        )}\n      </Component>\n    );\n  },\n) as CardType;\nCard.displayName = \"Card\";\n\nCard.Media = CardMedia;\nCard.MediaImg = CardMediaImg;\nCard.Body = CardBody;\nCard.BodyHeader = CardBodyHeader;\nCard.BodyHeaderOverline = CardBodyHeaderOverline;\nCard.BodyHeaderTitle = CardBodyHeaderTitle;\nCard.BodyDescription = CardBodyDescription;\nCard.BodyAction = CardBodyAction;\nCard.BodyActionRow = CardBodyActionRow;\nCard.BodyActionArrow = CardBodyActionArrow;\n\ntype CardType = ReturnType<typeof forwardRef<HTMLDivElement, CardProps>> & {\n  Media: typeof CardMedia;\n  MediaImg: typeof CardMediaImg;\n  Body: typeof CardBody;\n  BodyHeader: typeof CardBodyHeader;\n  BodyHeaderOverline: typeof CardBodyHeaderOverline;\n  BodyHeaderTitle: typeof CardBodyHeaderTitle;\n  BodyDescription: typeof CardBodyDescription;\n  BodyAction: typeof CardBodyAction;\n  BodyActionRow: typeof CardBodyActionRow;\n  BodyActionArrow: typeof CardBodyActionArrow;\n};\n"],"mappings":"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","names":[]}

package/dist/card/index.mjs

@@ -10,7 +10,7 @@ import {
   CardBodyHeaderTitle,
   CardMedia,
   CardMediaImg
-} from "../chunk-JOEPTRHW.mjs";
+} from "../chunk-BFM6UZGI.mjs";
 import "../chunk-YOSPWY5K.mjs";
 export {
   Card,

package/dist/{chunk-JOEPTRHW.mjs → chunk-BFM6UZGI.mjs}

@@ -149,6 +149,22 @@ var CardBodyActionArrow = forwardRef(
   }
 );
 CardBodyActionArrow.displayName = "Card.BodyActionArrow";
+var convertDeprecatedColor = (color) => {
+  switch (color) {
+    case "lighter-brand":
+      return { theme: "default" };
+    case "light-grey-fill":
+      return { theme: "base", dataColor: "neutral" };
+    case "white":
+      return { theme: "default", dataColor: "neutral" };
+    case "dark":
+      return { theme: "base" };
+    case "darker":
+      return { theme: "tinted", dataColorScheme: "dark" };
+    default:
+      return {};
+  }
+};
 var Card = forwardRef(
   (_a, ref) => {
     var _b = _a, {
@@ -157,6 +173,8 @@ var Card = forwardRef(
       className,
       children,
       variant = "slim",
+      "data-color": dataColorAttr,
+      theme = "default",
       color,
       imagePosition
     } = _b, rest = __objRest(_b, [
@@ -165,24 +183,30 @@ var Card = forwardRef(
       "className",
       "children",
       "variant",
+      "data-color",
+      "theme",
       "color",
       "imagePosition"
     ]);
     const Component = asChild ? Slot : Tag;
-    const effectiveColor = variant === "focus" && !color ? "darker" : color;
+    const {
+      theme: themeFromDeprecated,
+      dataColor: dataColorFromDeprecated,
+      dataColorScheme: dataColorSchemeFromDeprecated
+    } = convertDeprecatedColor(color != null ? color : variant === "focus" ? "darker" : void 0);
     return /* @__PURE__ */ jsx(
       Component,
-      __spreadProps(__spreadValues({}, rest), {
+      __spreadProps(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, rest), dataColorAttr ? { "data-color": dataColorAttr } : {}), dataColorFromDeprecated ? { "data-color": dataColorFromDeprecated } : {}), dataColorSchemeFromDeprecated ? { "data-color-scheme": dataColorSchemeFromDeprecated } : {}), {
         className: clsx(
           "hds-card",
           { "hds-card--full-width": variant === "full-width" },
           { "hds-card--miniature": variant === "miniature" },
           { "hds-card--focus": variant === "focus" },
+          // @deprecated
           { "hds-card--slim": variant === "slim" },
-          { "hds-card--color-white": effectiveColor === "white" },
-          { "hds-card--color-light-grey-fill": effectiveColor === "light-grey-fill" },
-          { "hds-card--color-dark": effectiveColor === "dark" },
-          { "hds-card--color-darker": effectiveColor === "darker" },
+          { "hds-card--theme-default": (themeFromDeprecated != null ? themeFromDeprecated : theme) === "default" },
+          { "hds-card--theme-tinted": (themeFromDeprecated != null ? themeFromDeprecated : theme) === "tinted" },
+          { "hds-card--theme-base": (themeFromDeprecated != null ? themeFromDeprecated : theme) === "base" },
           { "hds-card--image-position-right": imagePosition === "right" },
           className
         ),
@@ -217,4 +241,4 @@ export {
   CardBodyActionArrow,
   Card
 };
-//# sourceMappingURL=chunk-JOEPTRHW.mjs.map
+//# sourceMappingURL=chunk-BFM6UZGI.mjs.map

package/dist/chunk-BFM6UZGI.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/card/card.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { forwardRef } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\n\nexport const CardMedia = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component {...rest} className={clsx(\"hds-card__media\", className as undefined)} ref={ref}>\n        {children}\n      </Component>\n    );\n  },\n);\nCardMedia.displayName = \"Card.Media\";\n\nexport interface CardImageMediaProps extends React.ImgHTMLAttributes<HTMLImageElement> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n  /**\n   * Define image scaling behavior when the image are varies in both width and height across different page breaks and  sizes of the card.\n   * \"crop\": Image always fills the available space.\n   *         If the aspect ratio doesn't match, then the top/bottom or left/right edges are cropped away.\n   * \"scale\": No cropping, image scales to the maximum size available and centers.\n   *          If the aspect ratio doesn't match, then the background will show on the top/bottom or left/right sides of the image.\n   *\n   * @default \"crop\"\n   */\n  variant?: \"crop\" | \"scale\";\n}\nexport const CardMediaImg = forwardRef<HTMLImageElement, CardImageMediaProps>(\n  ({ asChild, variant, className, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"img\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\n          \"hds-card__media__img\",\n          { \"hds-card__img__scale\": variant === \"scale\" },\n          className as undefined,\n        )}\n        ref={ref}\n      />\n    );\n  },\n);\nCardMediaImg.displayName = \"Card.MediaImg\";\n\nexport const CardBody = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component {...rest} className={clsx(\"hds-card__body\", className as undefined)} ref={ref}>\n        <div className={clsx(\"hds-card__centerbody\", className as undefined)}>{children}</div>\n      </Component>\n    );\n  },\n);\nCardBody.displayName = \"Card.Body\";\n\nexport const CardBodyHeader = forwardRef<\n  HTMLHeadingElement,\n  CardBaseProps &\n    (\n      | {\n          /**\n           * Heading level of the card heading\n           */\n          as: \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\";\n          asChild?: never;\n        }\n      | {\n          asChild: true;\n          as?: never;\n        }\n    )\n>(({ as: Tag, asChild, className, children, ...rest }, ref) => {\n  const Component = asChild ? Slot : Tag;\n  return (\n    <Component\n      {...rest}\n      className={clsx(\"hds-card__body-header\", className as undefined)}\n      ref={ref}\n    >\n      {children}\n    </Component>\n  );\n});\nCardBodyHeader.displayName = \"Card.BodyHeader\";\n\nexport const CardBodyHeaderOverline = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"span\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\"hds-card__body-header-overline\", className as undefined)}\n        ref={ref}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nCardBodyHeaderOverline.displayName = \"Card.BodyHeaderOverline\";\n\nexport const CardBodyHeaderTitle = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\"hds-card__body-header-title\", className as undefined)}\n        ref={ref}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nCardBodyHeaderTitle.displayName = \"Card.BodyHeaderTitle\";\n\nexport const CardBodyDescription = forwardRef<HTMLParagraphElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"p\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\"hds-card__body-description\", className as undefined)}\n        ref={ref}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nCardBodyDescription.displayName = \"Card.BodyDescription\";\n\nexport const CardBodyAction = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\"hds-card__body-action\", className as undefined)}\n        ref={ref}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nCardBodyAction.displayName = \"Card.BodyAction\";\n\nexport const CardBodyActionRow = forwardRef<HTMLDivElement, CardBaseProps>(\n  ({ asChild, className, children, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\"hds-card__body-action-row\", className as undefined)}\n        ref={ref}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nCardBodyActionRow.displayName = \"Card.BodyActionRow\";\n\ninterface CardBodyActionArrowProps extends React.HTMLAttributes<HTMLSpanElement> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n\n  /**\n   * Set direction of the arrow\n   *\n   * @default \"right\"\n   */\n  direction?: \"right\" | \"up-right\";\n}\nexport const CardBodyActionArrow = forwardRef<HTMLSpanElement, CardBodyActionArrowProps>(\n  ({ asChild, className, direction, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"span\";\n    return (\n      <Component\n        {...rest}\n        className={clsx(\n          \"hds-card__body-action-arrow\",\n          { \"hds-card__body-action-arrow-up-right\": direction === \"up-right\" },\n          className as undefined,\n        )}\n        ref={ref}\n      />\n    );\n  },\n);\nCardBodyActionArrow.displayName = \"Card.BodyActionArrow\";\n\nexport interface CardBaseProps extends React.HTMLAttributes<HTMLDivElement> {\n  children: ReactNode;\n\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n}\n\n/**\n * @deprecated This interface is deprecated and will be removed in a future release.\n * Use `CardSlimAndMiniatureProps` with props `data-color` and `theme` instead.\n */\nexport interface CardSlimAndMiniaturePropsDeprecated extends CardBaseProps {\n  /**\n   * Change the default rendered element for Card.\n   */\n  as?: \"section\" | \"div\" | \"article\" | \"aside\";\n  /**\n   * Allows for a horizontal variant for sizes above small.\n   *\n   * @default \"slim\"\n   */\n  variant?: \"slim\" | \"miniature\";\n  \"data-color\"?: never;\n  theme?: never;\n  /**\n   * @deprecated\n   * Use props `data-color` and `theme` instead.\n   * These colors will be removed in a future release.\n   */\n  color?: \"white\" | \"lighter-brand\" | \"light-grey-fill\";\n\n  /* Only fullwidth or focus cards can have images to the left or right of the text: */\n  imagePosition?: never;\n}\n\nexport interface CardSlimAndMiniatureProps extends CardBaseProps {\n  /**\n   * Change the default rendered element for Card.\n   */\n  as?: \"section\" | \"div\" | \"article\" | \"aside\";\n  /**\n   * Allows for a horizontal variant for sizes above small.\n   *\n   * @default \"slim\"\n   */\n  variant?: \"slim\" | \"miniature\";\n  /**\n   * Set theme for card\n   * @default \"default\"\n   */\n  theme?: \"default\" | \"tinted\" | \"base\";\n  /**\n   * Set data-color for card.\n   */\n  \"data-color\"?: \"neutral\" | \"posten\" | \"bring\";\n  /* Only fullwidth or focus cards can have images to the left or right of the text: */\n  imagePosition?: never;\n}\n\n/**\n * @deprecated Use Full-width card instead\n */\nexport interface CardFocusProps extends CardBaseProps {\n  /**\n   * Change the default rendered element for Card.\n   */\n  as?: \"section\" | \"div\" | \"article\" | \"aside\";\n  /** @deprecated Use Full-width card instead */\n  variant: \"focus\";\n  /**\n   * @deprecated\n   * Use props `data-color` and `theme` instead.\n   * The color prop will be removed in a future release.\n   */\n  color?: \"darker\" | \"dark\";\n  \"data-color\"?: never;\n  theme?: never;\n  /**\n   * fullwidth or focus cards can have images to the left or right of the text.\n   *\n   * @default \"left\"\n   * */\n  imagePosition?: \"left\" | \"right\";\n}\n\n/**\n * @deprecated This interface is deprecated and will be removed in a future release.\n * Use `CardSlimAndMiniatureProps` with props `data-color` and `theme` instead.\n */\nexport interface CardFullwidthPropsDeprecated extends CardBaseProps {\n  /**\n   * Change the default rendered element for Card.\n   */\n  as?: \"section\" | \"div\" | \"article\" | \"aside\";\n  variant: \"full-width\";\n  \"data-color\"?: never;\n  theme?: never;\n  /**\n   * @deprecated\n   * Use `data-color` and `theme` instead.\n   * The color prop will be removed in a future release.\n   */\n  color: \"white\" | \"lighter-brand\" | \"light-grey-fill\";\n  /**\n   * fullwidth or focus cards can have images to the left or right of the text.\n   *\n   * @default \"left\"\n   * */\n  imagePosition?: \"left\" | \"right\";\n}\n\nexport interface CardFullwidthProps extends CardBaseProps {\n  /**\n   * Change the default rendered element for Card.\n   */\n  as?: \"section\" | \"div\" | \"article\" | \"aside\";\n  variant: \"full-width\";\n  /**\n   * Set theme for card\n   * @default \"default\"\n   */\n  theme?: \"default\" | \"tinted\" | \"base\";\n  /**\n   * Set data-color for card.\n   */\n  \"data-color\"?: \"neutral\" | \"posten\" | \"bring\";\n  /**\n   * fullwidth or focus cards can have images to the left or right of the text.\n   *\n   * @default \"left\"\n   * */\n  imagePosition?: \"left\" | \"right\";\n}\n\nexport type CardProps =\n  | CardSlimAndMiniatureProps\n  | CardFocusProps\n  | CardFullwidthProps\n  | CardSlimAndMiniaturePropsDeprecated\n  | CardFullwidthPropsDeprecated;\n\n/**\n * Converts deprecated colors to current colors\n * @param color\n * @returns\n */\nconst convertDeprecatedColor = (\n  color: string | undefined,\n): Partial<{\n  theme: NonNullable<CardSlimAndMiniatureProps[\"theme\"]>;\n  dataColor: NonNullable<CardSlimAndMiniatureProps[\"data-color\"]>;\n  dataColorScheme: \"light\" | \"dark\";\n}> => {\n  switch (color) {\n    case \"lighter-brand\":\n      return { theme: \"default\" };\n    case \"light-grey-fill\":\n      return { theme: \"base\", dataColor: \"neutral\" };\n    case \"white\":\n      return { theme: \"default\", dataColor: \"neutral\" };\n    case \"dark\":\n      return { theme: \"base\" };\n    case \"darker\":\n      return { theme: \"tinted\", dataColorScheme: \"dark\" };\n    default:\n      return {};\n  }\n};\n\nexport const Card = forwardRef<HTMLDivElement, CardProps>(\n  (\n    {\n      as: Tag = \"section\",\n      asChild,\n      className,\n      children,\n      variant = \"slim\",\n      \"data-color\": dataColorAttr,\n      theme = \"default\",\n      color,\n      imagePosition,\n      ...rest\n    },\n    ref,\n  ) => {\n    const Component = asChild ? Slot : Tag;\n\n    const {\n      theme: themeFromDeprecated,\n      dataColor: dataColorFromDeprecated,\n      dataColorScheme: dataColorSchemeFromDeprecated,\n    } = convertDeprecatedColor(color ?? (variant === \"focus\" ? \"darker\" : undefined));\n\n    return (\n      <Component\n        {...rest}\n        {...(dataColorAttr ? { \"data-color\": dataColorAttr } : {})}\n        {...(dataColorFromDeprecated ? { \"data-color\": dataColorFromDeprecated } : {})}\n        {...(dataColorSchemeFromDeprecated\n          ? { \"data-color-scheme\": dataColorSchemeFromDeprecated }\n          : {})}\n        className={clsx(\n          \"hds-card\",\n          { \"hds-card--full-width\": variant === \"full-width\" },\n          { \"hds-card--miniature\": variant === \"miniature\" },\n          { \"hds-card--focus\": variant === \"focus\" }, // @deprecated\n          { \"hds-card--slim\": variant === \"slim\" },\n          { \"hds-card--theme-default\": (themeFromDeprecated ?? theme) === \"default\" },\n          { \"hds-card--theme-tinted\": (themeFromDeprecated ?? theme) === \"tinted\" },\n          { \"hds-card--theme-base\": (themeFromDeprecated ?? theme) === \"base\" },\n          { \"hds-card--image-position-right\": imagePosition === \"right\" },\n          className as undefined,\n        )}\n        ref={ref}\n      >\n        {variant === \"full-width\" || variant === \"focus\" ? (\n          <div className={clsx(\"hds-card__layoutwrapper\", className as undefined)}>{children}</div>\n        ) : (\n          children\n        )}\n      </Component>\n    );\n  },\n) as CardType;\nCard.displayName = \"Card\";\n\nCard.Media = CardMedia;\nCard.MediaImg = CardMediaImg;\nCard.Body = CardBody;\nCard.BodyHeader = CardBodyHeader;\nCard.BodyHeaderOverline = CardBodyHeaderOverline;\nCard.BodyHeaderTitle = CardBodyHeaderTitle;\nCard.BodyDescription = CardBodyDescription;\nCard.BodyAction = CardBodyAction;\nCard.BodyActionRow = CardBodyActionRow;\nCard.BodyActionArrow = CardBodyActionArrow;\n\ntype CardType = ReturnType<typeof forwardRef<HTMLDivElement, CardProps>> & {\n  Media: typeof CardMedia;\n  MediaImg: typeof CardMediaImg;\n  Body: typeof CardBody;\n  BodyHeader: typeof CardBodyHeader;\n  BodyHeaderOverline: typeof CardBodyHeaderOverline;\n  BodyHeaderTitle: typeof CardBodyHeaderTitle;\n  BodyDescription: typeof CardBodyDescription;\n  BodyAction: typeof CardBodyAction;\n  BodyActionRow: typeof CardBodyActionRow;\n  BodyActionArrow: typeof CardBodyActionArrow;\n};\n"],"mappings":"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","names":[]}

package/dist/{chunk-3OGHJOJF.mjs → chunk-DEABU7DB.mjs}

@@ -9,23 +9,47 @@ import { forwardRef, useCallback, useState } from "react";
 import { clsx } from "@postenbring/hedwig-css/typed-classname";
 import { Slot, Slottable } from "@radix-ui/react-slot";
 import { jsx, jsxs } from "react/jsx-runtime";
+function CloseIcon() {
+  return /* @__PURE__ */ jsx("svg", { "aria-hidden": true, xmlns: "http://www.w3.org/2000/svg", width: 32, height: 32, viewBox: "0 0 32 32", children: /* @__PURE__ */ jsx(
+    "path",
+    {
+      d: "M17.5469 16.3333L22.375 11.5521L23.3594 10.5677C23.5 10.4271 23.5 10.1927 23.3594 10.0052L22.3281 8.97394C22.1406 8.83331 21.9062 8.83331 21.7656 8.97394L16 14.7864L10.1875 8.97394C10.0469 8.83331 9.8125 8.83331 9.625 8.97394L8.59375 10.0052C8.45312 10.1927 8.45312 10.4271 8.59375 10.5677L14.4062 16.3333L8.59375 22.1458C8.45312 22.2864 8.45312 22.5208 8.59375 22.7083L9.625 23.7396C9.8125 23.8802 10.0469 23.8802 10.1875 23.7396L16 17.9271L20.7812 22.7552L21.7656 23.7396C21.9062 23.8802 22.1406 23.8802 22.3281 23.7396L23.3594 22.7083C23.5 22.5208 23.5 22.2864 23.3594 22.1458L17.5469 16.3333Z",
+      fill: "currentColor"
+    }
+  ) });
+}
 var BoxCloseButton = forwardRef(
   (_a, ref) => {
     var _b = _a, { className } = _b, rest = __objRest(_b, ["className"]);
     return /* @__PURE__ */ jsx(
       "button",
-      __spreadValues({
+      __spreadProps(__spreadValues({
         className: clsx("hds-box__close-button", className),
         ref,
         type: "button"
-      }, rest)
+      }, rest), {
+        children: /* @__PURE__ */ jsx(CloseIcon, {})
+      })
     );
   }
 );
 BoxCloseButton.displayName = "Box.CloseButton";
+var convertVariantToColor = (variant) => {
+  switch (variant) {
+    case "lighter":
+      return "";
+    case "white":
+      return "";
+    case "warning":
+      return "warning";
+    default:
+      return "neutral";
+  }
+};
 var Box = forwardRef(
   (_a, ref) => {
     var _b = _a, {
+      "data-color": color = "",
       asChild,
       variant,
       closeable = false,
@@ -35,6 +59,7 @@ var Box = forwardRef(
       children,
       className
     } = _b, rest = __objRest(_b, [
+      "data-color",
       "asChild",
       "variant",
       "closeable",
@@ -57,12 +82,15 @@ var Box = forwardRef(
     }, []);
     const closed = closedProp != null ? closedProp : closedState;
     const Component = asChild ? Slot : "div";
+    const resolvedColor = color && color !== "" ? color : convertVariantToColor(variant);
     return /* @__PURE__ */ jsxs(
       Component,
       __spreadProps(__spreadValues({
+        "data-color": resolvedColor,
         className: clsx(
           "hds-box",
-          variant && `hds-box--${variant}`,
+          { "hds-box--lighter": variant === "lighter" },
+          { "hds-box--white": variant === "white" },
           { "hds-box--closed": closed },
           className
         ),
@@ -83,4 +111,4 @@ export {
   BoxCloseButton,
   Box
 };
-//# sourceMappingURL=chunk-3OGHJOJF.mjs.map
+//# sourceMappingURL=chunk-DEABU7DB.mjs.map

package/dist/chunk-DEABU7DB.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/box/box.tsx"],"sourcesContent":["import { forwardRef, useCallback, useState } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot, Slottable } from \"@radix-ui/react-slot\";\n\nfunction CloseIcon() {\n  return (\n    <svg aria-hidden xmlns=\"http://www.w3.org/2000/svg\" width={32} height={32} viewBox=\"0 0 32 32\">\n      <path\n        d=\"M17.5469 16.3333L22.375 11.5521L23.3594 10.5677C23.5 10.4271 23.5 10.1927 23.3594 10.0052L22.3281 8.97394C22.1406 8.83331 21.9062 8.83331 21.7656 8.97394L16 14.7864L10.1875 8.97394C10.0469 8.83331 9.8125 8.83331 9.625 8.97394L8.59375 10.0052C8.45312 10.1927 8.45312 10.4271 8.59375 10.5677L14.4062 16.3333L8.59375 22.1458C8.45312 22.2864 8.45312 22.5208 8.59375 22.7083L9.625 23.7396C9.8125 23.8802 10.0469 23.8802 10.1875 23.7396L16 17.9271L20.7812 22.7552L21.7656 23.7396C21.9062 23.8802 22.1406 23.8802 22.3281 23.7396L23.3594 22.7083C23.5 22.5208 23.5 22.2864 23.3594 22.1458L17.5469 16.3333Z\"\n        fill=\"currentColor\"\n      />\n    </svg>\n  );\n}\n\nexport type BoxCloseButtonProps = Omit<React.HTMLAttributes<HTMLButtonElement>, \"children\">;\nexport const BoxCloseButton = forwardRef<HTMLButtonElement, BoxCloseButtonProps>(\n  ({ className, ...rest }, ref) => {\n    return (\n      <button\n        className={clsx(\"hds-box__close-button\", className as undefined)}\n        ref={ref}\n        type=\"button\"\n        {...rest}\n      >\n        <CloseIcon />\n      </button>\n    );\n  },\n);\nBoxCloseButton.displayName = \"Box.CloseButton\";\n\nexport interface BoxProps extends React.HTMLAttributes<HTMLDivElement> {\n  children?: React.ReactNode;\n\n  /**\n   * Posten/Bring-spesific variant of the box. NB: warning variant is deprecated, use data-color=\"warning\" instead.\n   *\n   * @default \"light-grey\"\n   */\n  variant?:\n    | \"light-grey\"\n    | \"lighter\"\n    | \"white\"\n    /** @deprecated use data-color=\"warning\" instead */\n    | \"warning\";\n\n  /**\n   * Color variant of the box\n   *\n   */\n\n  \"data-color\"?: \"neutral\" | \"info\" | \"success\" | \"warning\" | \"error\";\n\n  /**\n   * If `true`, a close button will be shown.\n   * Use when you want to control the close button using the BoxCloseButton component.\n   *\n   * @default false\n   */\n  closeable?: boolean;\n\n  /**\n   * Callback fired when the component requests to be closed.\n   * If not set, the component will be closed without any user interaction.\n   *\n   * If set, and the handler returns non-true value, the component will not be closed.\n   * Use this if you want to control the closing of the component, using the `closed` prop\n   *\n   * If set, and the handler returns the true, the component will be closed.\n   * Use this with `window.confirm()` to ask the user to confirm closing the component.\n   */\n  // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents -- It's fine, I want to have the boolean in the type\n  onClose?: () => boolean | unknown;\n\n  /**\n   * If `true`, the box will be closed and hidden from view\n   */\n  closed?: boolean;\n\n  /**\n   * Props applied to the close button element.\n   */\n  closeButtonProps?: BoxCloseButtonProps;\n\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n}\n\nconst convertVariantToColor = (variant: BoxProps[\"variant\"] | \"\") => {\n  switch (variant) {\n    case \"lighter\":\n      return \"\";\n    case \"white\":\n      return \"\";\n    case \"warning\":\n      return \"warning\";\n    default:\n      return \"neutral\";\n  }\n};\n\nexport const Box = forwardRef<HTMLDivElement, BoxProps>(\n  (\n    {\n      \"data-color\": color = \"\",\n      asChild,\n      variant,\n      closeable = false,\n      onClose: onCloseProp,\n      closed: closedProp,\n      closeButtonProps,\n      children,\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    const [closedState, setClosedState] = useState(false);\n    const onClose = useCallback(() => {\n      if (onCloseProp) {\n        const result = onCloseProp();\n        if (result === true) {\n          setClosedState(true);\n        }\n      } else {\n        setClosedState(true);\n      }\n      // eslint-disable-next-line react-hooks/exhaustive-deps -- I know better\n    }, []);\n    const closed = closedProp ?? closedState;\n    const Component = asChild ? Slot : \"div\";\n\n    const resolvedColor = color && color !== \"\" ? color : convertVariantToColor(variant);\n\n    return (\n      <Component\n        data-color={resolvedColor}\n        className={clsx(\n          \"hds-box\",\n          { \"hds-box--lighter\": variant === \"lighter\" },\n          { \"hds-box--white\": variant === \"white\" },\n          { \"hds-box--closed\": closed },\n          className as undefined,\n        )}\n        ref={ref}\n        {...rest}\n      >\n        {closeable ? <BoxCloseButton onClick={onClose} {...closeButtonProps} /> : null}\n        <Slottable>{children}</Slottable>\n      </Component>\n    );\n  },\n) as BoxType;\nBox.displayName = \"Box\";\n\nBox.CloseButton = BoxCloseButton;\n\ntype BoxType = ReturnType<typeof forwardRef<HTMLDivElement, BoxProps>> & {\n  CloseButton: typeof BoxCloseButton;\n};\n"],"mappings":";;;;;;;AAAA,SAAS,YAAY,aAAa,gBAAgB;AAClD,SAAS,YAAY;AACrB,SAAS,MAAM,iBAAiB;AAK1B,cAqIA,YArIA;AAHN,SAAS,YAAY;AACnB,SACE,oBAAC,SAAI,eAAW,MAAC,OAAM,8BAA6B,OAAO,IAAI,QAAQ,IAAI,SAAQ,aACjF;AAAA,IAAC;AAAA;AAAA,MACC,GAAE;AAAA,MACF,MAAK;AAAA;AAAA,EACP,GACF;AAEJ;AAGO,IAAM,iBAAiB;AAAA,EAC5B,CAAC,IAAwB,QAAQ;AAAhC,iBAAE,YAjBL,IAiBG,IAAgB,iBAAhB,IAAgB,CAAd;AACD,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,KAAK,yBAAyB,SAAsB;AAAA,QAC/D;AAAA,QACA,MAAK;AAAA,SACD,OAJL;AAAA,QAMC,8BAAC,aAAU;AAAA;AAAA,IACb;AAAA,EAEJ;AACF;AACA,eAAe,cAAc;AA+D7B,IAAM,wBAAwB,CAAC,YAAsC;AACnE,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT,KAAK;AACH,aAAO;AAAA,IACT;AACE,aAAO;AAAA,EACX;AACF;AAEO,IAAM,MAAM;AAAA,EACjB,CACE,IAYA,QACG;AAbH,iBACE;AAAA,oBAAc,QAAQ;AAAA,MACtB;AAAA,MACA;AAAA,MACA,YAAY;AAAA,MACZ,SAAS;AAAA,MACT,QAAQ;AAAA,MACR;AAAA,MACA;AAAA,MACA;AAAA,IArHN,IA4GI,IAUK,iBAVL,IAUK;AAAA,MATH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAKF,UAAM,CAAC,aAAa,cAAc,IAAI,SAAS,KAAK;AACpD,UAAM,UAAU,YAAY,MAAM;AAChC,UAAI,aAAa;AACf,cAAM,SAAS,YAAY;AAC3B,YAAI,WAAW,MAAM;AACnB,yBAAe,IAAI;AAAA,QACrB;AAAA,MACF,OAAO;AACL,uBAAe,IAAI;AAAA,MACrB;AAAA,IAEF,GAAG,CAAC,CAAC;AACL,UAAM,SAAS,kCAAc;AAC7B,UAAM,YAAY,UAAU,OAAO;AAEnC,UAAM,gBAAgB,SAAS,UAAU,KAAK,QAAQ,sBAAsB,OAAO;AAEnF,WACE;AAAA,MAAC;AAAA;AAAA,QACC,cAAY;AAAA,QACZ,WAAW;AAAA,UACT;AAAA,UACA,EAAE,oBAAoB,YAAY,UAAU;AAAA,UAC5C,EAAE,kBAAkB,YAAY,QAAQ;AAAA,UACxC,EAAE,mBAAmB,OAAO;AAAA,UAC5B;AAAA,QACF;AAAA,QACA;AAAA,SACI,OAVL;AAAA,QAYE;AAAA,sBAAY,oBAAC,iCAAe,SAAS,WAAa,iBAAkB,IAAK;AAAA,UAC1E,oBAAC,aAAW,UAAS;AAAA;AAAA;AAAA,IACvB;AAAA,EAEJ;AACF;AACA,IAAI,cAAc;AAElB,IAAI,cAAc;","names":[]}

package/dist/{chunk-EQFY63YP.mjs → chunk-EDPWJWQO.mjs}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-77M2ZTP7.mjs";
 import {
   Box
-} from "./chunk-3OGHJOJF.mjs";
+} from "./chunk-DEABU7DB.mjs";
 import {
   __objRest,
   __spreadProps,
@@ -127,4 +127,4 @@ export {
   ModalFooter,
   Modal
 };
-//# sourceMappingURL=chunk-EQFY63YP.mjs.map
+//# sourceMappingURL=chunk-EDPWJWQO.mjs.map

package/dist/chunk-F4VC5NPP.mjs

@@ -0,0 +1,54 @@
+import {
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./chunk-YOSPWY5K.mjs";
+
+// src/badge/badge.tsx
+import { clsx } from "@postenbring/hedwig-css/typed-classname";
+import { Slot } from "@radix-ui/react-slot";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+var Badge = forwardRef(
+  (_a, ref) => {
+    var _b = _a, {
+      "data-color": color = "",
+      children,
+      asChild,
+      variant = "",
+      size = "small",
+      className
+    } = _b, rest = __objRest(_b, [
+      "data-color",
+      "children",
+      "asChild",
+      "variant",
+      "size",
+      "className"
+    ]);
+    const Component = asChild ? Slot : "span";
+    return /* @__PURE__ */ jsx(
+      Component,
+      __spreadProps(__spreadValues(__spreadProps(__spreadValues({}, variant === "warning" || variant === "lighter" || variant === "darker" ? { "data-color-scheme": "light" } : {}), {
+        "data-color": color,
+        ref,
+        className: clsx(
+          "hds-badge",
+          `hds-badge--${size}`,
+          { "hds-badge--lighter": variant === "lighter" },
+          { "hds-badge--darker": variant === "darker" },
+          { "hds-badge--white": variant === "white" },
+          className
+        )
+      }), rest), {
+        children
+      })
+    );
+  }
+);
+Badge.displayName = "Badge";
+
+export {
+  Badge
+};
+//# sourceMappingURL=chunk-F4VC5NPP.mjs.map

package/dist/chunk-F4VC5NPP.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/badge/badge.tsx"],"sourcesContent":["import { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { forwardRef } from \"react\";\n\nexport interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement> {\n  children: React.ReactNode;\n\n  /**\n   * Color of the badge\n   *\n   * @deprecated\n   * @default \"lighter\"\n   * \"lighter\", \"darker\", and \"white\" are deprecated and will be removed in a future release.\n   * Use data-color \"neutral\", \"info\", \"success\", \"warning\", or \"error\" instead.\n   */\n  variant?: /** @deprecated */\n  | \"lighter\"\n    /** @deprecated */\n    | \"darker\"\n    /** @deprecated */\n    | \"white\"\n    /** @deprecated */\n    | \"warning\";\n\n  \"data-color\"?: \"neutral\" | \"info\" | \"success\" | \"warning\" | \"error\";\n\n  /**\n   * Font size of the badge\n   *\n   * @default \"small\"\n   */\n  size?: \"small\" | \"smaller\";\n\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n}\n\n/**\n * Badges are used to label, categorize or organize items using keywords to describe them.\n *\n * @example\n *\n * ```tsx\n * <Badge variant=\"info\">Info</Badge>\n * ```\n *\n */\n\nexport const Badge = forwardRef<HTMLSpanElement, BadgeProps>(\n  (\n    {\n      \"data-color\": color = \"\",\n      children,\n      asChild,\n      variant = \"\",\n      size = \"small\",\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    const Component = asChild ? Slot : \"span\";\n    return (\n      <Component\n        {...(variant === \"warning\" || variant === \"lighter\" || variant === \"darker\"\n          ? { \"data-color-scheme\": \"light\" }\n          : {})}\n        data-color={color}\n        ref={ref}\n        className={clsx(\n          \"hds-badge\",\n          `hds-badge--${size}`,\n          { \"hds-badge--lighter\": variant === \"lighter\" },\n          { \"hds-badge--darker\": variant === \"darker\" },\n          { \"hds-badge--white\": variant === \"white\" },\n          className as undefined,\n        )}\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nBadge.displayName = \"Badge\";\n"],"mappings":";;;;;;;AAAA,SAAS,YAAY;AACrB,SAAS,YAAY;AACrB,SAAS,kBAAkB;AAiErB;AAfC,IAAM,QAAQ;AAAA,EACnB,CACE,IASA,QACG;AAVH,iBACE;AAAA,oBAAc,QAAQ;AAAA,MACtB;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACV,OAAO;AAAA,MACP;AAAA,IA5DN,IAsDI,IAOK,iBAPL,IAOK;AAAA,MANH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAKF,UAAM,YAAY,UAAU,OAAO;AACnC,WACE;AAAA,MAAC;AAAA,oEACM,YAAY,aAAa,YAAY,aAAa,YAAY,WAC/D,EAAE,qBAAqB,QAAQ,IAC/B,CAAC,IAHN;AAAA,QAIC,cAAY;AAAA,QACZ;AAAA,QACA,WAAW;AAAA,UACT;AAAA,UACA,cAAc,IAAI;AAAA,UAClB,EAAE,sBAAsB,YAAY,UAAU;AAAA,UAC9C,EAAE,qBAAqB,YAAY,SAAS;AAAA,UAC5C,EAAE,oBAAoB,YAAY,QAAQ;AAAA,UAC1C;AAAA,QACF;AAAA,UACI,OAdL;AAAA,QAgBE;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,MAAM,cAAc;","names":[]}

package/dist/{chunk-W7CPW23K.mjs → chunk-F7MLQ6JI.mjs}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-CKAL5ZJZ.mjs";
 import {
   Link
-} from "./chunk-OHDHIRAW.mjs";
+} from "./chunk-QE2ZES72.mjs";
 import {
   UnorderedList
 } from "./chunk-3QHKPEXO.mjs";
@@ -12,7 +12,7 @@ import {
 } from "./chunk-77M2ZTP7.mjs";
 import {
   Box
-} from "./chunk-3OGHJOJF.mjs";
+} from "./chunk-DEABU7DB.mjs";
 import {
   __objRest,
   __spreadProps,
@@ -56,17 +56,7 @@ var ErrorSummaryItem = forwardRef(
         e.preventDefault();
       }
     }
-    return /* @__PURE__ */ jsx("li", __spreadProps(__spreadValues({ className: clsx(`hds-error-summary__list-item`), ref }, rest), { children: /* @__PURE__ */ jsx(
-      Link,
-      __spreadProps(__spreadValues({
-        size: "small",
-        href,
-        variant: "inverted-no-underline"
-      }, linkProps), {
-        onClick,
-        children
-      })
-    ) }));
+    return /* @__PURE__ */ jsx("li", __spreadProps(__spreadValues({ className: clsx(`hds-error-summary__list-item`), ref }, rest), { children: /* @__PURE__ */ jsx(Link, __spreadProps(__spreadValues({ size: "small", href, variant: "solid" }, linkProps), { onClick, children })) }));
   }
 );
 ErrorSummaryItem.displayName = "ErrorSummary.Item";
@@ -87,4 +77,4 @@ export {
   ErrorSummaryItem,
   ErrorSummary
 };
-//# sourceMappingURL=chunk-W7CPW23K.mjs.map
+//# sourceMappingURL=chunk-F7MLQ6JI.mjs.map

package/dist/{chunk-W7CPW23K.mjs.map → chunk-F7MLQ6JI.mjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/form/error-summary/error-summary.tsx"],"sourcesContent":["import { forwardRef, useEffect, useRef, type HTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { Box, type BoxProps } from \"../../box\";\nimport { UnorderedList, type ListProps } from \"../../list\";\nimport { Link } from \"../../link\";\nimport { useMergeRefs } from \"../../utils\";\nimport { focusWithLegendOrLabelInViewport } from \"./focus\";\n\ninterface ErrorSummaryHeadingPropsAutoFocus {\n  /**\n   * The heading will be focused when the component mounts\n   *\n   * On following errornous form submissions you should manually focus the heading\n   * e.g. by passing a ref and calling `ref.current.focus()`\n   *\n   * @default true\n   */\n  autoFocus?: boolean;\n}\n\ninterface ErrorSummaryHeadingPropsAs {\n  /**\n   * A heading level must be selected, or optionally opting out for a different element\n   *\n   * Use {@link ErrorSummaryHeadingPropsAsChild.asChild} if you need more control of the rendered element.\n   */\n  as: \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"span\" | \"div\" | \"label\" | \"p\";\n  asChild?: never;\n}\n\ninterface ErrorSummaryHeadingPropsAsChild {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild: true;\n  as?: never;\n}\n\nexport type ErrorSummaryHeadingProps = HTMLAttributes<HTMLElement> &\n  ErrorSummaryHeadingPropsAutoFocus &\n  (ErrorSummaryHeadingPropsAs | ErrorSummaryHeadingPropsAsChild);\n\nexport const ErrorSummaryHeading = forwardRef<\n  HTMLParagraphElement,\n  ErrorSummaryHeadingProps & (ErrorSummaryHeadingPropsAs | ErrorSummaryHeadingPropsAsChild)\n>(({ asChild, children, as: Tag, autoFocus = true, ...rest }, ref) => {\n  const focusRef = useRef<HTMLElement>(null);\n  const mergedRef = useMergeRefs([focusRef, ref]);\n  const Component = asChild ? Slot : Tag;\n\n  useEffect(() => {\n    /**\n     * Hack: Safari 18 on mac at the time of writing\n     * does not correctly focus it with VoiceOver without the timeout\n     */\n    setTimeout(() => {\n      if (focusRef.current && autoFocus) {\n        focusRef.current.focus();\n      }\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps -- Only on initial render\n  }, []);\n\n  return (\n    <Component className={clsx(`hds-error-summary__title`)} ref={mergedRef} tabIndex={-1} {...rest}>\n      {children}\n    </Component>\n  );\n});\nErrorSummaryHeading.displayName = \"ErrorSummary.Heading\";\n\nexport interface ErrorSummaryListProps extends ListProps {\n  /**\n   * Sets the size of the items (font)\n   *\n   * @default \"small\"\n   */\n  size?: ListProps[\"size\"];\n}\nexport const ErrorSummaryList = forwardRef<HTMLUListElement, ErrorSummaryListProps>(\n  ({ children, size = \"small\", ...rest }, ref) => (\n    <UnorderedList size={size} ref={ref} {...rest}>\n      {children}\n    </UnorderedList>\n  ),\n);\nErrorSummaryList.displayName = \"ErrorSummary.List\";\n\nexport interface ErrorSummaryItemProps extends React.HTMLAttributes<HTMLLIElement> {\n  /**\n   * A hash link to the element that the error message refers to\n   *\n   * Must start with \"#\" as it's passed to the `href` attribute of an anchor element\n   *\n   * @example \"#email\"\n   */\n  href: `#${string}`;\n\n  /**\n   * Extra props to pass to the link element\n   */\n  linkProps?: React.AnchorHTMLAttributes<HTMLAnchorElement>;\n}\nexport const ErrorSummaryItem = forwardRef<HTMLLIElement, ErrorSummaryItemProps>(\n  ({ children, href, linkProps, ...rest }, ref) => {\n    function onClick(e: React.MouseEvent<HTMLAnchorElement>) {\n      linkProps?.onClick?.(e);\n      if (focusWithLegendOrLabelInViewport(href.replace(\"#\", \"\"))) {\n        e.preventDefault();\n      }\n    }\n\n    return (\n      <li className={clsx(`hds-error-summary__list-item`)} ref={ref} {...rest}>\n        <Link\n          size=\"small\"\n          href={href}\n          variant=\"inverted-no-underline\"\n          {...linkProps}\n          onClick={onClick}\n        >\n          {children}\n        </Link>\n      </li>\n    );\n  },\n);\nErrorSummaryItem.displayName = \"ErrorSummary.Item\";\n\nexport type ErrorSummaryProps = Omit<\n  BoxProps,\n  \"variant\" | \"closeable\" | \"onClose\" | \"closed\" | \"closeButtonProps\"\n>;\n\nexport const ErrorSummary = forwardRef<HTMLDivElement, ErrorSummaryProps>(\n  ({ children, className, ...rest }, ref) => (\n    <Box ref={ref} {...rest} className={clsx(`hds-error-summary`, className as undefined)}>\n      {children}\n    </Box>\n  ),\n) as ErrorSummaryType;\nErrorSummary.displayName = \"ErrorSummary\";\n\ntype ErrorSummaryType = ReturnType<typeof forwardRef<HTMLDivElement, ErrorSummaryProps>> & {\n  Heading: typeof ErrorSummaryHeading;\n  List: typeof ErrorSummaryList;\n  Item: typeof ErrorSummaryItem;\n};\nErrorSummary.Heading = ErrorSummaryHeading;\nErrorSummary.List = ErrorSummaryList;\nErrorSummary.Item = ErrorSummaryItem;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,SAAS,YAAY,WAAW,cAAmC;AACnE,SAAS,YAAY;AACrB,SAAS,YAAY;AA+DjB;AAtBG,IAAM,sBAAsB,WAGjC,CAAC,IAA2D,QAAQ;AAAnE,eAAE,WAAS,UAAU,IAAI,KAAK,YAAY,KA9C7C,IA8CG,IAAmD,iBAAnD,IAAmD,CAAjD,WAAS,YAAU,MAAS;AAC/B,QAAM,WAAW,OAAoB,IAAI;AACzC,QAAM,YAAY,aAAa,CAAC,UAAU,GAAG,CAAC;AAC9C,QAAM,YAAY,UAAU,OAAO;AAEnC,YAAU,MAAM;AAKd,eAAW,MAAM;AACf,UAAI,SAAS,WAAW,WAAW;AACjC,iBAAS,QAAQ,MAAM;AAAA,MACzB;AAAA,IACF,CAAC;AAAA,EAEH,GAAG,CAAC,CAAC;AAEL,SACE,oBAAC,0CAAU,WAAW,KAAK,0BAA0B,GAAG,KAAK,WAAW,UAAU,MAAQ,OAAzF,EACE,WACH;AAEJ,CAAC;AACD,oBAAoB,cAAc;AAU3B,IAAM,mBAAmB;AAAA,EAC9B,CAAC,IAAuC,QAAK;AAA5C,iBAAE,YAAU,OAAO,QAjFtB,IAiFG,IAA+B,iBAA/B,IAA+B,CAA7B,YAAU;AACX,+BAAC,8CAAc,MAAY,OAAc,OAAxC,EACE,WACH;AAAA;AAEJ;AACA,iBAAiB,cAAc;AAiBxB,IAAM,mBAAmB;AAAA,EAC9B,CAAC,IAAwC,QAAQ;AAAhD,iBAAE,YAAU,MAAM,UAzGrB,IAyGG,IAAgC,iBAAhC,IAAgC,CAA9B,YAAU,QAAM;AACjB,aAAS,QAAQ,GAAwC;AA1G7D,UAAAA;AA2GM,OAAAA,MAAA,uCAAW,YAAX,gBAAAA,IAAA,gBAAqB;AACrB,UAAI,iCAAiC,KAAK,QAAQ,KAAK,EAAE,CAAC,GAAG;AAC3D,UAAE,eAAe;AAAA,MACnB;AAAA,IACF;AAEA,WACE,oBAAC,qCAAG,WAAW,KAAK,8BAA8B,GAAG,OAAc,OAAlE,EACC;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL;AAAA,QACA,SAAQ;AAAA,SACJ,YAJL;AAAA,QAKC;AAAA,QAEC;AAAA;AAAA,IACH,IACF;AAAA,EAEJ;AACF;AACA,iBAAiB,cAAc;AAOxB,IAAM,eAAe;AAAA,EAC1B,CAAC,IAAkC,QAAK;AAAvC,iBAAE,YAAU,UAxIf,IAwIG,IAA0B,iBAA1B,IAA0B,CAAxB,YAAU;AACX,+BAAC,oCAAI,OAAc,OAAlB,EAAwB,WAAW,KAAK,qBAAqB,SAAsB,GACjF,WACH;AAAA;AAEJ;AACA,aAAa,cAAc;AAO3B,aAAa,UAAU;AACvB,aAAa,OAAO;AACpB,aAAa,OAAO;","names":["_a"]}
+{"version":3,"sources":["../src/form/error-summary/error-summary.tsx"],"sourcesContent":["import { forwardRef, useEffect, useRef, type HTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { Box, type BoxProps } from \"../../box\";\nimport { UnorderedList, type ListProps } from \"../../list\";\nimport { Link } from \"../../link\";\nimport { useMergeRefs } from \"../../utils\";\nimport { focusWithLegendOrLabelInViewport } from \"./focus\";\n\ninterface ErrorSummaryHeadingPropsAutoFocus {\n  /**\n   * The heading will be focused when the component mounts\n   *\n   * On following errornous form submissions you should manually focus the heading\n   * e.g. by passing a ref and calling `ref.current.focus()`\n   *\n   * @default true\n   */\n  autoFocus?: boolean;\n}\n\ninterface ErrorSummaryHeadingPropsAs {\n  /**\n   * A heading level must be selected, or optionally opting out for a different element\n   *\n   * Use {@link ErrorSummaryHeadingPropsAsChild.asChild} if you need more control of the rendered element.\n   */\n  as: \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"span\" | \"div\" | \"label\" | \"p\";\n  asChild?: never;\n}\n\ninterface ErrorSummaryHeadingPropsAsChild {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   */\n  asChild: true;\n  as?: never;\n}\n\nexport type ErrorSummaryHeadingProps = HTMLAttributes<HTMLElement> &\n  ErrorSummaryHeadingPropsAutoFocus &\n  (ErrorSummaryHeadingPropsAs | ErrorSummaryHeadingPropsAsChild);\n\nexport const ErrorSummaryHeading = forwardRef<\n  HTMLParagraphElement,\n  ErrorSummaryHeadingProps & (ErrorSummaryHeadingPropsAs | ErrorSummaryHeadingPropsAsChild)\n>(({ asChild, children, as: Tag, autoFocus = true, ...rest }, ref) => {\n  const focusRef = useRef<HTMLElement>(null);\n  const mergedRef = useMergeRefs([focusRef, ref]);\n  const Component = asChild ? Slot : Tag;\n\n  useEffect(() => {\n    /**\n     * Hack: Safari 18 on mac at the time of writing\n     * does not correctly focus it with VoiceOver without the timeout\n     */\n    setTimeout(() => {\n      if (focusRef.current && autoFocus) {\n        focusRef.current.focus();\n      }\n    });\n    // eslint-disable-next-line react-hooks/exhaustive-deps -- Only on initial render\n  }, []);\n\n  return (\n    <Component className={clsx(`hds-error-summary__title`)} ref={mergedRef} tabIndex={-1} {...rest}>\n      {children}\n    </Component>\n  );\n});\nErrorSummaryHeading.displayName = \"ErrorSummary.Heading\";\n\nexport interface ErrorSummaryListProps extends ListProps {\n  /**\n   * Sets the size of the items (font)\n   *\n   * @default \"small\"\n   */\n  size?: ListProps[\"size\"];\n}\nexport const ErrorSummaryList = forwardRef<HTMLUListElement, ErrorSummaryListProps>(\n  ({ children, size = \"small\", ...rest }, ref) => (\n    <UnorderedList size={size} ref={ref} {...rest}>\n      {children}\n    </UnorderedList>\n  ),\n);\nErrorSummaryList.displayName = \"ErrorSummary.List\";\n\nexport interface ErrorSummaryItemProps extends React.HTMLAttributes<HTMLLIElement> {\n  /**\n   * A hash link to the element that the error message refers to\n   *\n   * Must start with \"#\" as it's passed to the `href` attribute of an anchor element\n   *\n   * @example \"#email\"\n   */\n  href: `#${string}`;\n\n  /**\n   * Extra props to pass to the link element\n   */\n  linkProps?: React.AnchorHTMLAttributes<HTMLAnchorElement>;\n}\nexport const ErrorSummaryItem = forwardRef<HTMLLIElement, ErrorSummaryItemProps>(\n  ({ children, href, linkProps, ...rest }, ref) => {\n    function onClick(e: React.MouseEvent<HTMLAnchorElement>) {\n      linkProps?.onClick?.(e);\n      if (focusWithLegendOrLabelInViewport(href.replace(\"#\", \"\"))) {\n        e.preventDefault();\n      }\n    }\n\n    return (\n      <li className={clsx(`hds-error-summary__list-item`)} ref={ref} {...rest}>\n        <Link size=\"small\" href={href} variant=\"solid\" {...linkProps} onClick={onClick}>\n          {children}\n        </Link>\n      </li>\n    );\n  },\n);\nErrorSummaryItem.displayName = \"ErrorSummary.Item\";\n\nexport type ErrorSummaryProps = Omit<\n  BoxProps,\n  \"variant\" | \"closeable\" | \"onClose\" | \"closed\" | \"closeButtonProps\"\n>;\n\nexport const ErrorSummary = forwardRef<HTMLDivElement, ErrorSummaryProps>(\n  ({ children, className, ...rest }, ref) => (\n    <Box ref={ref} {...rest} className={clsx(`hds-error-summary`, className as undefined)}>\n      {children}\n    </Box>\n  ),\n) as ErrorSummaryType;\nErrorSummary.displayName = \"ErrorSummary\";\n\ntype ErrorSummaryType = ReturnType<typeof forwardRef<HTMLDivElement, ErrorSummaryProps>> & {\n  Heading: typeof ErrorSummaryHeading;\n  List: typeof ErrorSummaryList;\n  Item: typeof ErrorSummaryItem;\n};\nErrorSummary.Heading = ErrorSummaryHeading;\nErrorSummary.List = ErrorSummaryList;\nErrorSummary.Item = ErrorSummaryItem;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,SAAS,YAAY,WAAW,cAAmC;AACnE,SAAS,YAAY;AACrB,SAAS,YAAY;AA+DjB;AAtBG,IAAM,sBAAsB,WAGjC,CAAC,IAA2D,QAAQ;AAAnE,eAAE,WAAS,UAAU,IAAI,KAAK,YAAY,KA9C7C,IA8CG,IAAmD,iBAAnD,IAAmD,CAAjD,WAAS,YAAU,MAAS;AAC/B,QAAM,WAAW,OAAoB,IAAI;AACzC,QAAM,YAAY,aAAa,CAAC,UAAU,GAAG,CAAC;AAC9C,QAAM,YAAY,UAAU,OAAO;AAEnC,YAAU,MAAM;AAKd,eAAW,MAAM;AACf,UAAI,SAAS,WAAW,WAAW;AACjC,iBAAS,QAAQ,MAAM;AAAA,MACzB;AAAA,IACF,CAAC;AAAA,EAEH,GAAG,CAAC,CAAC;AAEL,SACE,oBAAC,0CAAU,WAAW,KAAK,0BAA0B,GAAG,KAAK,WAAW,UAAU,MAAQ,OAAzF,EACE,WACH;AAEJ,CAAC;AACD,oBAAoB,cAAc;AAU3B,IAAM,mBAAmB;AAAA,EAC9B,CAAC,IAAuC,QAAK;AAA5C,iBAAE,YAAU,OAAO,QAjFtB,IAiFG,IAA+B,iBAA/B,IAA+B,CAA7B,YAAU;AACX,+BAAC,8CAAc,MAAY,OAAc,OAAxC,EACE,WACH;AAAA;AAEJ;AACA,iBAAiB,cAAc;AAiBxB,IAAM,mBAAmB;AAAA,EAC9B,CAAC,IAAwC,QAAQ;AAAhD,iBAAE,YAAU,MAAM,UAzGrB,IAyGG,IAAgC,iBAAhC,IAAgC,CAA9B,YAAU,QAAM;AACjB,aAAS,QAAQ,GAAwC;AA1G7D,UAAAA;AA2GM,OAAAA,MAAA,uCAAW,YAAX,gBAAAA,IAAA,gBAAqB;AACrB,UAAI,iCAAiC,KAAK,QAAQ,KAAK,EAAE,CAAC,GAAG;AAC3D,UAAE,eAAe;AAAA,MACnB;AAAA,IACF;AAEA,WACE,oBAAC,qCAAG,WAAW,KAAK,8BAA8B,GAAG,OAAc,OAAlE,EACC,8BAAC,qCAAK,MAAK,SAAQ,MAAY,SAAQ,WAAY,YAAlD,EAA6D,SAC3D,WACH,IACF;AAAA,EAEJ;AACF;AACA,iBAAiB,cAAc;AAOxB,IAAM,eAAe;AAAA,EAC1B,CAAC,IAAkC,QAAK;AAAvC,iBAAE,YAAU,UAlIf,IAkIG,IAA0B,iBAA1B,IAA0B,CAAxB,YAAU;AACX,+BAAC,oCAAI,OAAc,OAAlB,EAAwB,WAAW,KAAK,qBAAqB,SAAsB,GACjF,WACH;AAAA;AAEJ;AACA,aAAa,cAAc;AAO3B,aAAa,UAAU;AACvB,aAAa,OAAO;AACpB,aAAa,OAAO;","names":["_a"]}

package/dist/{chunk-EGW3RCXD.mjs → chunk-I76U35YW.mjs}

@@ -11,7 +11,7 @@ import { Slot } from "@radix-ui/react-slot";
 import { jsx } from "react/jsx-runtime";
 var StyledHtml = forwardRef(
   (_a, ref) => {
-    var _b = _a, { asChild, children, size, unstable_darkmode: darkmode = false, className } = _b, rest = __objRest(_b, ["asChild", "children", "size", "unstable_darkmode", "className"]);
+    var _b = _a, { asChild, children, size, className } = _b, rest = __objRest(_b, ["asChild", "children", "size", "className"]);
     const Component = asChild ? Slot : "div";
     return /* @__PURE__ */ jsx(
       Component,
@@ -19,7 +19,6 @@ var StyledHtml = forwardRef(
         className: clsx(
           `hds-styled-html`,
           size === "small" && "hds-styled-html--small",
-          darkmode && "hds-styled-html--darkmode",
           className
         ),
         ref
@@ -34,4 +33,4 @@ StyledHtml.displayName = "StyledHtml";
 export {
   StyledHtml
 };
-//# sourceMappingURL=chunk-EGW3RCXD.mjs.map
+//# sourceMappingURL=chunk-I76U35YW.mjs.map

package/dist/chunk-I76U35YW.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/styled-html/styled-html.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\n\nexport interface StyledHtmlProps extends React.HTMLAttributes<HTMLDivElement> {\n  children?: React.ReactNode;\n\n  /**\n   * Size of content inside. Setting this to `small` makes the font size be `body-small`.\n   *\n   * @default \"default\"\n   */\n  size?: \"default\" | \"small\";\n\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n}\n\n/**\n * A component for displaying dynamic content that you want to apply hedwig styling to.\n * the styling depends on the semantic html elements you use inside the component.\n *\n * Useful when you have dynamic content that you want styled with hedwig, like content from a CMS.\n *\n * Previously known as `hw-wysiwyg` in hedwig legacy. In tailwind this kind of component it is known as `prose`.\n *\n * @example\n * ```tsx\n * <StyledHtml>\n *   <h1>Heading 1</h1>\n *   <h2>Heading 2</h2>\n *   <a href=\"https://www.postenbring.no\">Postenbring</a>\n *   <ul>\n *    <li>Hei</li>\n *    <li>Hallo</li>\n *    <li>Hello</li>\n *   </ul>\n * </StyledHtml>\n * ```\n */\nexport const StyledHtml = forwardRef<HTMLDivElement, StyledHtmlProps>(\n  ({ asChild, children, size, className, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component\n        className={clsx(\n          `hds-styled-html`,\n          size === \"small\" && \"hds-styled-html--small\",\n          className as undefined,\n        )}\n        ref={ref}\n        {...rest}\n      >\n        {children}\n      </Component>\n    );\n  },\n);\nStyledHtml.displayName = \"StyledHtml\";\n"],"mappings":";;;;;;;AAAA,SAAS,kBAAkB;AAC3B,SAAS,YAAY;AACrB,SAAS,YAAY;AA8Cf;AAJC,IAAM,aAAa;AAAA,EACxB,CAAC,IAAiD,QAAQ;AAAzD,iBAAE,WAAS,UAAU,MAAM,UA7C9B,IA6CG,IAAyC,iBAAzC,IAAyC,CAAvC,WAAS,YAAU,QAAM;AAC1B,UAAM,YAAY,UAAU,OAAO;AACnC,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA,SAAS,WAAW;AAAA,UACpB;AAAA,QACF;AAAA,QACA;AAAA,SACI,OAPL;AAAA,QASE;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,WAAW,cAAc;","names":[]}

package/dist/{chunk-BYFBK3J7.mjs → chunk-ILN2L5NX.mjs}

@@ -1,6 +1,6 @@
 import {
   Box
-} from "./chunk-3OGHJOJF.mjs";
+} from "./chunk-DEABU7DB.mjs";
 import {
   __objRest,
   __spreadProps,
@@ -45,10 +45,10 @@ var Message = forwardRef(
     var _b = _a, { children, className, variant = "success", icon, iconClassName } = _b, rest = __objRest(_b, ["children", "className", "variant", "icon", "iconClassName"]);
     return /* @__PURE__ */ jsxs(
       Box,
-      __spreadProps(__spreadValues({
+      __spreadProps(__spreadValues(__spreadProps(__spreadValues({}, variant === "warning" ? { "data-color-scheme": "light" } : {}), {
         className: clsx(`hds-message`, `hds-message--${variant}`, className),
         ref
-      }, rest), {
+      }), rest), {
         children: [
           variant === "neutral" && /* @__PURE__ */ jsx("div", { className: clsx("hds-message--neutral__icon", iconClassName), children: icon }),
           children
@@ -66,4 +66,4 @@ export {
   MessageDescription,
   Message
 };
-//# sourceMappingURL=chunk-BYFBK3J7.mjs.map
+//# sourceMappingURL=chunk-ILN2L5NX.mjs.map

package/dist/chunk-ILN2L5NX.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/message/message.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { Box, type BoxProps } from \"../box/box\";\n\nexport interface MessageTitleProps extends React.HTMLAttributes<HTMLParagraphElement> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n}\nexport const MessageTitle = forwardRef<HTMLParagraphElement, MessageTitleProps>(\n  ({ asChild, className, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component\n        className={clsx(\"hds-message__title\", className as undefined)}\n        ref={ref}\n        {...rest}\n      />\n    );\n  },\n);\nMessageTitle.displayName = \"Message.Title\";\n\nexport interface MessageDescriptionProps extends React.HTMLAttributes<HTMLParagraphElement> {\n  /**\n   * Change the default rendered element for the one passed as a child, merging their props and behavior.\n   *\n   * @default false\n   */\n  asChild?: boolean;\n}\nexport const MessageDescription = forwardRef<HTMLParagraphElement, MessageDescriptionProps>(\n  ({ asChild, className, ...rest }, ref) => {\n    const Component = asChild ? Slot : \"div\";\n    return (\n      <Component\n        className={clsx(\"hds-message__description\", className as undefined)}\n        ref={ref}\n        {...rest}\n      />\n    );\n  },\n);\nMessageDescription.displayName = \"Message.Description\";\n\nexport type MessageProps = (\n  | {\n      variant?: \"success\" | \"attention\" | \"warning\" | \"info\";\n      icon?: never;\n      iconClassName?: never;\n    }\n  | {\n      variant: \"neutral\";\n      icon?: React.ReactNode;\n      iconClassName?: string;\n    }\n) &\n  Omit<BoxProps, \"variant\" | \"asChild\">;\n\n/** @deprecated Use Alert component instead */\nexport const Message = forwardRef<HTMLDivElement, MessageProps>(\n  ({ children, className, variant = \"success\", icon, iconClassName, ...rest }, ref) => {\n    return (\n      <Box\n        {...(variant === \"warning\" ? { \"data-color-scheme\": \"light\" } : {})}\n        className={clsx(`hds-message`, `hds-message--${variant}`, className as undefined)}\n        ref={ref}\n        {...rest}\n      >\n        {variant === \"neutral\" && (\n          <div className={clsx(\"hds-message--neutral__icon\", iconClassName as undefined)}>\n            {icon}\n          </div>\n        )}\n        {children}\n      </Box>\n    );\n  },\n) as MessageType;\nMessage.displayName = \"Message\";\n\ntype MessageType = ReturnType<typeof forwardRef<HTMLDivElement, MessageProps>> & {\n  Title: typeof MessageTitle;\n  Description: typeof MessageDescription;\n};\nMessage.Title = MessageTitle;\nMessage.Description = MessageDescription;\n"],"mappings":";;;;;;;;;;AAAA,SAAS,kBAAkB;AAC3B,SAAS,YAAY;AACrB,SAAS,YAAY;AAef,cAkDA,YAlDA;AAJC,IAAM,eAAe;AAAA,EAC1B,CAAC,IAAiC,QAAQ;AAAzC,iBAAE,WAAS,UAdd,IAcG,IAAyB,iBAAzB,IAAyB,CAAvB,WAAS;AACV,UAAM,YAAY,UAAU,OAAO;AACnC,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,KAAK,sBAAsB,SAAsB;AAAA,QAC5D;AAAA,SACI;AAAA,IACN;AAAA,EAEJ;AACF;AACA,aAAa,cAAc;AAUpB,IAAM,qBAAqB;AAAA,EAChC,CAAC,IAAiC,QAAQ;AAAzC,iBAAE,WAAS,UApCd,IAoCG,IAAyB,iBAAzB,IAAyB,CAAvB,WAAS;AACV,UAAM,YAAY,UAAU,OAAO;AACnC,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,KAAK,4BAA4B,SAAsB;AAAA,QAClE;AAAA,SACI;AAAA,IACN;AAAA,EAEJ;AACF;AACA,mBAAmB,cAAc;AAiB1B,IAAM,UAAU;AAAA,EACrB,CAAC,IAA4E,QAAQ;AAApF,iBAAE,YAAU,WAAW,UAAU,WAAW,MAAM,cAjErD,IAiEG,IAAoE,iBAApE,IAAoE,CAAlE,YAAU,aAAW,WAAqB,QAAM;AACjD,WACE;AAAA,MAAC;AAAA,oEACM,YAAY,YAAY,EAAE,qBAAqB,QAAQ,IAAI,CAAC,IADlE;AAAA,QAEC,WAAW,KAAK,eAAe,gBAAgB,OAAO,IAAI,SAAsB;AAAA,QAChF;AAAA,UACI,OAJL;AAAA,QAME;AAAA,sBAAY,aACX,oBAAC,SAAI,WAAW,KAAK,8BAA8B,aAA0B,GAC1E,gBACH;AAAA,UAED;AAAA;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AACA,QAAQ,cAAc;AAMtB,QAAQ,QAAQ;AAChB,QAAQ,cAAc;","names":[]}

package/dist/{chunk-YZDURLEY.mjs → chunk-INDTHGWZ.mjs}

@@ -1,6 +1,6 @@
 import {
   Box
-} from "./chunk-3OGHJOJF.mjs";
+} from "./chunk-DEABU7DB.mjs";
 import {
   __objRest,
   __spreadProps,
@@ -51,4 +51,4 @@ HelpText.displayName = "HelpText";
 export {
   HelpText
 };
-//# sourceMappingURL=chunk-YZDURLEY.mjs.map
+//# sourceMappingURL=chunk-INDTHGWZ.mjs.map

package/dist/{chunk-4P4GPVKZ.mjs → chunk-PZUJLRG4.mjs}

@@ -1,6 +1,6 @@
 import {
   Box
-} from "./chunk-3OGHJOJF.mjs";
+} from "./chunk-DEABU7DB.mjs";
 import {
   __objRest,
   __spreadProps,
@@ -34,17 +34,25 @@ var AlertDescription = forwardRef(
   }
 );
 AlertDescription.displayName = "Alert.Description";
+var allowedColors = ["neutral", "info", "success", "warning", "error", void 0];
+function isValidDataColor(value) {
+  return allowedColors.includes(value);
+}
 var Alert = forwardRef(
   (_a, ref) => {
-    var _b = _a, { children, className, variant = "success", icon, iconClassName } = _b, rest = __objRest(_b, ["children", "className", "variant", "icon", "iconClassName"]);
+    var _b = _a, { children, className, "data-color": color = void 0, icon, iconClassName } = _b, rest = __objRest(_b, ["children", "className", "data-color", "icon", "iconClassName"]);
+    const _a2 = rest, { variant } = _a2, boxProps = __objRest(_a2, ["variant"]);
+    const resolvedColor = color != null ? color : variant;
+    const validColor = isValidDataColor(resolvedColor) ? resolvedColor : void 0;
     return /* @__PURE__ */ jsxs(
       Box,
       __spreadProps(__spreadValues({
-        className: clsx(`hds-alert`, `hds-alert--${variant}`, className),
+        "data-color": validColor,
+        className: clsx(`hds-alert`, className),
         ref
-      }, rest), {
+      }, boxProps), {
         children: [
-          variant === "neutral" && /* @__PURE__ */ jsx("div", { className: clsx("hds-alert--neutral__icon", iconClassName), children: icon }),
+          validColor === "neutral" && /* @__PURE__ */ jsx("div", { className: clsx("hds-alert--neutral__icon", iconClassName), children: icon }),
           children
         ]
       })
@@ -60,4 +68,4 @@ export {
   AlertDescription,
   Alert
 };
-//# sourceMappingURL=chunk-4P4GPVKZ.mjs.map
+//# sourceMappingURL=chunk-PZUJLRG4.mjs.map