@gnist/design-system 2.0.12 → 2.0.14

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## <small>2.0.14 (2025-02-20)</small>
+
+* fix: pass classname prop for card components ([3fbfa17](https://github.com/mollerdigital/design-system-design-system/commit/3fbfa17))
+
+## <small>2.0.13 (2025-02-17)</small>
+
+* feat: add docs for loading prop for buttons ([268e827](https://github.com/mollerdigital/design-system-design-system/commit/268e827))
+
 ## <small>2.0.12 (2025-02-14)</small>
 
 * chore: upgrade storybook to 8.5 ([a07105d](https://github.com/mollerdigital/design-system-design-system/commit/a07105d))

package/dist/components/actions/buttons/IconButton.d.ts

@@ -22,6 +22,8 @@ type IconButtonProps<AsElement extends ElementType> = PolymorphicProps<AsElement
 /**
 An icon button is a button which displays only an icon with or without a label. Icon buttons allow users to take actions, and make choices, with a single tap. Because the background is transparent, the icon and label color is inherited from ancestors to acommodate use on different background colors.
 
+Note: Unlike most button components, `disabled`, `loading` and `density` props don't exist for IconButton.
+
 Documentation: [IconButton](https://gnist.moller.no/developers/components/latest/?path=/docs/components-actions-buttons-iconbutton--docs)
  */
 export declare const IconButton: import("react").ForwardRefExoticComponent<Omit<IconButtonProps<ElementType>, "ref"> & import("react").RefAttributes<Element>>;

package/dist/components/actions/buttons/IconButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/buttons/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,wDAAoE;AAG3F,OAAO,EAAE,WAAW,EAA2C,MAAM,OAAO,CAAC;AAC7E,OAAO,EAAE,YAAY,EAAQ,MAAM,0CAA0C,CAAC;AAI9E,KAAK,eAAe,CAAC,SAAS,SAAS,WAAW,IAC9C,gBAAgB,CAAC,SAAS,CAAC,GAAG;IAC1B;;OAEG;IACH,IAAI,EAAE,YAAY,CAAC;IACnB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,CAAC;IACtC,mHAAmH;IACnH,eAAe,CAAC,EAAE,YAAY,CAAC;CAClC,CAAC;AAEN;;;;GAIG;AACH,eAAO,MAAM,UAAU,+HA8CrB,CAAC"}
+{"version":3,"file":"IconButton.d.ts","sourceRoot":"","sources":["../../../../src/components/actions/buttons/IconButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,wDAAoE;AAG3F,OAAO,EAAE,WAAW,EAA2C,MAAM,OAAO,CAAC;AAC7E,OAAO,EAAE,YAAY,EAAQ,MAAM,0CAA0C,CAAC;AAI9E,KAAK,eAAe,CAAC,SAAS,SAAS,WAAW,IAC9C,gBAAgB,CAAC,SAAS,CAAC,GAAG;IAC1B;;OAEG;IACH,IAAI,EAAE,YAAY,CAAC;IACnB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,CAAC;IACtC,mHAAmH;IACnH,eAAe,CAAC,EAAE,YAAY,CAAC;CAClC,CAAC;AAEN;;;;;;GAMG;AACH,eAAO,MAAM,UAAU,+HA8CrB,CAAC"}

package/dist/components/surfaces/cards/ActionCard.cjs

@@ -10,13 +10,13 @@ const _interopDefaultCompat = (e) => e && typeof e === "object" && "default" in
 const classNames__default = /* @__PURE__ */ _interopDefaultCompat(classNames);
 const ActionCard = React.forwardRef(function ActionCard2({ $as, as, children, isLoading, density, ...props }, ref) {
   const cardProps = {
-    ...props,
     ref,
-    className: classNames__default.default(props.className, cards_css.cardsRecipe({
+    ...props,
+    className: classNames__default.default(cards_css.cardsRecipe({
       type: "action",
       isLoading,
       density
-    }))
+    }), props.className)
   };
   return React.createElement($as ?? as ?? "button", cardProps, jsxRuntime.jsx(jsxRuntime.Fragment, { children: isLoading ? jsxRuntime.jsx(SharedComponents.LoadingSkeleton, {}) : children }));
 });

package/dist/components/surfaces/cards/ActionCard.js

@@ -6,13 +6,13 @@ import { cardsRecipe } from "./cards.css.js";
 import { LoadingSkeleton } from "./SharedComponents.js";
 const ActionCard = forwardRef(function ActionCard2({ $as, as, children, isLoading, density, ...props }, ref) {
   const cardProps = {
-    ...props,
     ref,
-    className: classNames(props.className, cardsRecipe({
+    ...props,
+    className: classNames(cardsRecipe({
       type: "action",
       isLoading,
       density
-    }))
+    }), props.className)
   };
   return createElement($as ?? as ?? "button", cardProps, jsx(Fragment, { children: isLoading ? jsx(LoadingSkeleton, {}) : children }));
 });

package/dist/components/surfaces/cards/CheckboxCard.cjs

@@ -7,10 +7,13 @@ const SelectionCard = require("./internal/SelectionCard.cjs");
 const InfoCard = require("./InfoCard.cjs");
 const checkboxCard_css = require("./checkboxCard.css.cjs");
 const React = require("react");
+const classNames = require("classnames");
+const _interopDefaultCompat = (e) => e && typeof e === "object" && "default" in e ? e : { default: e };
+const classNames__default = /* @__PURE__ */ _interopDefaultCompat(classNames);
 const CheckboxCard = React.forwardRef(function CheckboxCard2({ label, description, value, id, onChange, children, isLoading, validity, checkboxProps, cardStyle, ...props }, ref) {
-  return jsxRuntime.jsx(InfoCard.InfoCard, { ref, className: checkboxCard_css.StyledCardRecipe({
+  return jsxRuntime.jsx(InfoCard.InfoCard, { ref, ...props, className: classNames__default.default(checkboxCard_css.StyledCardRecipe({
     disabled: props.disabled,
     cardStyle: cardStyle ?? "elevation"
-  }), ...props, children: isLoading ? jsxRuntime.jsx(SelectionCard.SelectionCardLoader, { type: "checkbox", density: props.density }) : jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Checkbox.Checkbox, { label, value, onChange, validity, id, disabled: props.disabled, ...checkboxProps }), jsxRuntime.jsx(SelectionCard.SelectionCardContent, { description, value, density: props.density, children })] }) });
+  }), props.className), children: isLoading ? jsxRuntime.jsx(SelectionCard.SelectionCardLoader, { type: "checkbox", density: props.density }) : jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Checkbox.Checkbox, { label, value, onChange, validity, id, disabled: props.disabled, ...checkboxProps }), jsxRuntime.jsx(SelectionCard.SelectionCardContent, { description, value, density: props.density, children })] }) });
 });
 exports.CheckboxCard = CheckboxCard;

package/dist/components/surfaces/cards/CheckboxCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxCard.d.ts","sourceRoot":"","sources":["../../../../src/components/surfaces/cards/CheckboxCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEH,aAAa,EAChB,MAAM,6CAA6C,CAAC;AACrD,OAAO,EACH,yBAAyB,EAGzB,kBAAkB,EACrB,MAAM,6BAA6B,CAAC;AAKrC,UAAU,iBAAkB,SAAQ,kBAAkB;IAClD;;OAEG;IACH,QAAQ,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IACpC;;OAEG;IACH,aAAa,CAAC,EAAE,IAAI,CAAC,yBAAyB,EAAE,KAAK,CAAC,CAAC;CAC1D;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,yBAAyB,CACtD,IAAI,CAAC,iBAAiB,EAAE,KAAK,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,CAqDtE,CAAC"}
+{"version":3,"file":"CheckboxCard.d.ts","sourceRoot":"","sources":["../../../../src/components/surfaces/cards/CheckboxCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEH,aAAa,EAChB,MAAM,6CAA6C,CAAC;AACrD,OAAO,EACH,yBAAyB,EAGzB,kBAAkB,EACrB,MAAM,6BAA6B,CAAC;AAMrC,UAAU,iBAAkB,SAAQ,kBAAkB;IAClD;;OAEG;IACH,QAAQ,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IACpC;;OAEG;IACH,aAAa,CAAC,EAAE,IAAI,CAAC,yBAAyB,EAAE,KAAK,CAAC,CAAC;CAC1D;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,yBAAyB,CACtD,IAAI,CAAC,iBAAiB,EAAE,KAAK,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,CAwDtE,CAAC"}

package/dist/components/surfaces/cards/CheckboxCard.js

@@ -5,11 +5,12 @@ import { SelectionCardLoader, SelectionCardContent } from "./internal/SelectionC
 import { InfoCard } from "./InfoCard.js";
 import { StyledCardRecipe } from "./checkboxCard.css.js";
 import { forwardRef } from "react";
+import classNames from "classnames";
 const CheckboxCard = forwardRef(function CheckboxCard2({ label, description, value, id, onChange, children, isLoading, validity, checkboxProps, cardStyle, ...props }, ref) {
-  return jsx(InfoCard, { ref, className: StyledCardRecipe({
+  return jsx(InfoCard, { ref, ...props, className: classNames(StyledCardRecipe({
     disabled: props.disabled,
     cardStyle: cardStyle ?? "elevation"
-  }), ...props, children: isLoading ? jsx(SelectionCardLoader, { type: "checkbox", density: props.density }) : jsxs(Fragment, { children: [jsx(Checkbox, { label, value, onChange, validity, id, disabled: props.disabled, ...checkboxProps }), jsx(SelectionCardContent, { description, value, density: props.density, children })] }) });
+  }), props.className), children: isLoading ? jsx(SelectionCardLoader, { type: "checkbox", density: props.density }) : jsxs(Fragment, { children: [jsx(Checkbox, { label, value, onChange, validity, id, disabled: props.disabled, ...checkboxProps }), jsx(SelectionCardContent, { description, value, density: props.density, children })] }) });
 });
 export {
   CheckboxCard

package/dist/components/surfaces/cards/InfoCard.cjs

@@ -9,11 +9,11 @@ const SharedComponents = require("./SharedComponents.cjs");
 const _interopDefaultCompat = (e) => e && typeof e === "object" && "default" in e ? e : { default: e };
 const classNames__default = /* @__PURE__ */ _interopDefaultCompat(classNames);
 const InfoCard = React.forwardRef(function InfoCard2({ isLoading, transparent, density, ...props }, ref) {
-  return jsxRuntime.jsx("div", { ref, ...props, className: classNames__default.default(props.className, cards_css.cardsRecipe({
+  return jsxRuntime.jsx("div", { ref, ...props, className: classNames__default.default(cards_css.cardsRecipe({
     type: "info",
     isLoading,
     transparent,
     density
-  })), children: isLoading ? jsxRuntime.jsx(SharedComponents.LoadingSkeleton, {}) : props.children });
+  }), props.className), children: isLoading ? jsxRuntime.jsx(SharedComponents.LoadingSkeleton, {}) : props.children });
 });
 exports.InfoCard = InfoCard;

package/dist/components/surfaces/cards/InfoCard.js

@@ -5,12 +5,12 @@ import { forwardRef } from "react";
 import { cardsRecipe } from "./cards.css.js";
 import { LoadingSkeleton } from "./SharedComponents.js";
 const InfoCard = forwardRef(function InfoCard2({ isLoading, transparent, density, ...props }, ref) {
-  return jsx("div", { ref, ...props, className: classNames(props.className, cardsRecipe({
+  return jsx("div", { ref, ...props, className: classNames(cardsRecipe({
     type: "info",
     isLoading,
     transparent,
     density
-  })), children: isLoading ? jsx(LoadingSkeleton, {}) : props.children });
+  }), props.className), children: isLoading ? jsx(LoadingSkeleton, {}) : props.children });
 });
 export {
   InfoCard

package/dist/components/surfaces/cards/LinkCard.cjs

@@ -12,11 +12,11 @@ const LinkCard = React.forwardRef(function LinkCard2({ $as, as, children, isLoad
   const cardProps = {
     ...props,
     ref,
-    className: classNames__default.default(props.className, cards_css.cardsRecipe({
+    className: classNames__default.default(cards_css.cardsRecipe({
       type: "link",
       isLoading,
       density
-    }))
+    }), props.className)
   };
   return React.createElement($as ?? as ?? "a", cardProps, jsxRuntime.jsx(jsxRuntime.Fragment, { children: isLoading ? jsxRuntime.jsx(SharedComponents.LoadingSkeleton, {}) : children }));
 });

package/dist/components/surfaces/cards/LinkCard.js

@@ -8,11 +8,11 @@ const LinkCard = forwardRef(function LinkCard2({ $as, as, children, isLoading, d
   const cardProps = {
     ...props,
     ref,
-    className: classNames(props.className, cardsRecipe({
+    className: classNames(cardsRecipe({
       type: "link",
       isLoading,
       density
-    }))
+    }), props.className)
   };
   return createElement($as ?? as ?? "a", cardProps, jsx(Fragment, { children: isLoading ? jsx(LoadingSkeleton, {}) : children }));
 });

package/dist/components/surfaces/cards/RadioCard.cjs

@@ -7,10 +7,13 @@ const SelectionCard = require("./internal/SelectionCard.cjs");
 const InfoCard = require("./InfoCard.cjs");
 const React = require("react");
 const checkboxCard_css = require("./checkboxCard.css.cjs");
+const classNames = require("classnames");
+const _interopDefaultCompat = (e) => e && typeof e === "object" && "default" in e ? e : { default: e };
+const classNames__default = /* @__PURE__ */ _interopDefaultCompat(classNames);
 const RadioCard = React.forwardRef(function RadioCard2({ label, description, value, id, name, onChange, children, isLoading, validity, cardStyle, ...props }, ref) {
-  return jsxRuntime.jsx(InfoCard.InfoCard, { ...props, ref, className: checkboxCard_css.StyledCardRecipe({
+  return jsxRuntime.jsx(InfoCard.InfoCard, { ref, ...props, className: classNames__default.default(checkboxCard_css.StyledCardRecipe({
     disabled: props.disabled,
     cardStyle: cardStyle ?? "elevation"
-  }), children: isLoading ? jsxRuntime.jsx(SelectionCard.SelectionCardLoader, { type: "radio", density: props.density }) : jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(RadioButton.RadioButton, { label, value, onChange, disabled: props.disabled, validity, id, name }), jsxRuntime.jsx(SelectionCard.SelectionCardContent, { description, value, density: props.density, children })] }) });
+  }), props.className), children: isLoading ? jsxRuntime.jsx(SelectionCard.SelectionCardLoader, { type: "radio", density: props.density }) : jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(RadioButton.RadioButton, { label, value, onChange, disabled: props.disabled, validity, id, name }), jsxRuntime.jsx(SelectionCard.SelectionCardContent, { description, value, density: props.density, children })] }) });
 });
 exports.RadioCard = RadioCard;

package/dist/components/surfaces/cards/RadioCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RadioCard.d.ts","sourceRoot":"","sources":["../../../../src/components/surfaces/cards/RadioCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEH,gBAAgB,EACnB,MAAM,gDAAgD,CAAC;AACxD,OAAO,EACH,yBAAyB,EAGzB,kBAAkB,EACrB,MAAM,6BAA6B,CAAC;AAKrC,UAAU,cAAe,SAAQ,kBAAkB;IAC/C;;OAEG;IACH,QAAQ,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACvC;;OAEG;IACH,IAAI,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAC/B;;OAEG;IACH,UAAU,CAAC,EAAE,yBAAyB,CAAC;CAC1C;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,yBAAyB,CACnD,IAAI,CAAC,cAAc,EAAE,KAAK,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,CAkDnE,CAAC"}
+{"version":3,"file":"RadioCard.d.ts","sourceRoot":"","sources":["../../../../src/components/surfaces/cards/RadioCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEH,gBAAgB,EACnB,MAAM,gDAAgD,CAAC;AACxD,OAAO,EACH,yBAAyB,EAGzB,kBAAkB,EACrB,MAAM,6BAA6B,CAAC;AAMrC,UAAU,cAAe,SAAQ,kBAAkB;IAC/C;;OAEG;IACH,QAAQ,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACvC;;OAEG;IACH,IAAI,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAC/B;;OAEG;IACH,UAAU,CAAC,EAAE,yBAAyB,CAAC;CAC1C;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,yBAAyB,CACnD,IAAI,CAAC,cAAc,EAAE,KAAK,CAAC,GAAG,KAAK,CAAC,aAAa,CAAC,cAAc,CAAC,CAqDnE,CAAC"}

package/dist/components/surfaces/cards/RadioCard.js

@@ -5,11 +5,12 @@ import { SelectionCardLoader, SelectionCardContent } from "./internal/SelectionC
 import { InfoCard } from "./InfoCard.js";
 import { forwardRef } from "react";
 import { StyledCardRecipe } from "./checkboxCard.css.js";
+import classNames from "classnames";
 const RadioCard = forwardRef(function RadioCard2({ label, description, value, id, name, onChange, children, isLoading, validity, cardStyle, ...props }, ref) {
-  return jsx(InfoCard, { ...props, ref, className: StyledCardRecipe({
+  return jsx(InfoCard, { ref, ...props, className: classNames(StyledCardRecipe({
     disabled: props.disabled,
     cardStyle: cardStyle ?? "elevation"
-  }), children: isLoading ? jsx(SelectionCardLoader, { type: "radio", density: props.density }) : jsxs(Fragment, { children: [jsx(RadioButton, { label, value, onChange, disabled: props.disabled, validity, id, name }), jsx(SelectionCardContent, { description, value, density: props.density, children })] }) });
+  }), props.className), children: isLoading ? jsx(SelectionCardLoader, { type: "radio", density: props.density }) : jsxs(Fragment, { children: [jsx(RadioButton, { label, value, onChange, disabled: props.disabled, validity, id, name }), jsx(SelectionCardContent, { description, value, density: props.density, children })] }) });
 });
 export {
   RadioCard

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@gnist/design-system",
-    "version": "2.0.12",
+    "version": "2.0.14",
     "license": "UNLICENSED",
     "type": "module",
     "main": "dist/index.cjs",
@@ -113,5 +113,5 @@
             "optional": true
         }
     },
-    "gitHead": "5ce6a3c00a609117e93640b1c364ce07732e011c"
+    "gitHead": "a64d01c99899cab0ce5db11deab339f79d27872d"
 }