bonkers-ui 2.0.2 → 2.0.4

package/components/UiNotificationBadge/UiNotificationBadge.js

@@ -1,84 +1,48 @@
-import { jsx as A } from "react/jsx-runtime";
+import { jsx as a } from "react/jsx-runtime";
 import "react";
-import _ from "classnames";
-import { EBadgeOffset as a } from "./_types.js";
-import "../UiTypography/UiTypography.js";
-import { EColors as r } from "../../_types/colors.js";
-const b = {
-  [r.WHITE]: "bg-white",
-  [r.BLACK]: "bg-black",
-  [r.TRANSPARENT]: "bg-transparent",
-  [r.CURRENT]: "bg-current",
-  [r.PRIMARY]: "bg-primary",
-  [r.PRIMARY_50]: "bg-primary-50",
-  [r.PRIMARY_100]: "bg-primary-100",
-  [r.PRIMARY_200]: "bg-primary-200",
-  [r.PRIMARY_300]: "bg-primary-300",
-  [r.PRIMARY_400]: "bg-primary-400",
-  [r.PRIMARY_500]: "bg-primary-500",
-  [r.PRIMARY_600]: "bg-primary-600",
-  [r.PRIMARY_700]: "bg-primary-700",
-  [r.PRIMARY_800]: "bg-primary-800",
-  [r.PRIMARY_900]: "bg-primary-900",
-  [r.PRIMARY_ALT]: "bg-primary-alt",
-  [r.PRIMARY_ALT_300]: "bg-primary-alt-300",
-  [r.PRIMARY_ALT_400]: "bg-primary-alt-400",
-  [r.PRIMARY_ALT_500]: "bg-primary-alt-500",
-  [r.PRIMARY_ALT_600]: "bg-primary-alt-600",
-  [r.PRIMARY_ALT_700]: "bg-primary-alt-700",
-  [r.WARNING]: "bg-warning",
-  [r.WARNING_300]: "bg-warning-300",
-  [r.WARNING_400]: "bg-warning-400",
-  [r.WARNING_500]: "bg-warning-500",
-  [r.WARNING_600]: "bg-warning-600",
-  [r.WARNING_700]: "bg-warning-700",
-  [r.SECONDARY]: "bg-secondary",
-  [r.SECONDARY_300]: "bg-secondary-300",
-  [r.SECONDARY_400]: "bg-secondary-400",
-  [r.SECONDARY_500]: "bg-secondary-500",
-  [r.SECONDARY_600]: "bg-secondary-600",
-  [r.SECONDARY_700]: "bg-secondary-700",
-  [r.SECONDARY_ALT]: "bg-secondary-alt",
-  [r.SECONDARY_ALT_200]: "bg-secondary-alt-200",
-  [r.SECONDARY_ALT_300]: "bg-secondary-alt-300",
-  [r.SECONDARY_ALT_400]: "bg-secondary-alt-400",
-  [r.SECONDARY_ALT_500]: "bg-secondary-alt-500",
-  [r.SECONDARY_ALT_600]: "bg-secondary-alt-600",
-  [r.SECONDARY_ALT_700]: "bg-secondary-alt-700",
-  [r.ERROR]: "bg-error",
-  [r.ERROR_300]: "bg-error-300",
-  [r.ERROR_400]: "bg-error-400",
-  [r.ERROR_500]: "bg-error-500",
-  [r.ERROR_600]: "bg-error-600",
-  [r.ERROR_700]: "bg-error-700",
-  [r.ACCENT]: "bg-accent",
-  [r.ACCENT_300]: "bg-accent-300",
-  [r.ACCENT_500]: "bg-accent-500",
-  [r.ACCENT_600]: "bg-accent-600",
-  [r.ACCENT_700]: "bg-accent-700",
-  [r.ACCENT_ALT]: "bg-accent-alt",
-  [r.ACCENT_ALT_300]: "bg-accent-alt-300",
-  [r.ACCENT_ALT_400]: "bg-accent-alt-400",
-  [r.ACCENT_ALT_500]: "bg-accent-alt-500",
-  [r.ACCENT_ALT_600]: "bg-accent-alt-600",
-  [r.ACCENT_ALT_700]: "bg-accent-alt-700"
-}, e = {
-  [a.DEFAULT]: "-right-xxxs -top-xxxs",
-  [a.OFFSET_BOTTOM_RIGHT]: "-right-xxxs -bottom-xxxs",
-  [a.OFFSET_TOP_LEFT]: "-left-xxxs -top-xxxs",
-  [a.OFFSET_BOTTOM_LEFT]: "-left-xxxs -bottom-xxxs"
-}, E = ({
-  offset: R,
-  children: t,
-  color: g
-}) => t ? /* @__PURE__ */ A(
+import T from "classnames";
+import { EBadgeOffset as t, EBadgeTypes as e, EBadgeSizes as x } from "./_types.js";
+const l = {
+  [t.DEFAULT]: "-right-xxxs -top-xxxs",
+  [t.OFFSET_BOTTOM_RIGHT]: "-right-xxxs -bottom-xxxs",
+  [t.OFFSET_TOP_LEFT]: "-left-xxxs -top-xxxs",
+  [t.OFFSET_BOTTOM_LEFT]: "-left-xxxs -bottom-xxxs"
+}, m = {
+  [e.DEFAULT]: `
+		bg-error-500
+
+	`,
+  [e.PRIMARY]: `
+		bg-primary-800
+
+	`
+}, f = {
+  [x.DEFAULT]: `
+		h-sm
+		min-w-sm
+		p-xxxs
+		text-xxs
+	`,
+  [x.LARGE]: `
+		h-lg
+		min-w-lg
+		p-xxs
+		justify-center
+		text-2xl
+		border-2
+
+	`
+}, g = ({
+  offset: s = t.DEFAULT,
+  children: o,
+  className: i,
+  kind: r = e.DEFAULT,
+  size: n = x.DEFAULT
+}) => /* @__PURE__ */ a(
   "div",
   {
-    className: _(
+    className: T(
       "notification-badge",
-      "p-xxxs",
-      "h-sm",
-      "min-w-sm",
       "absolute",
       "inline-flex",
       "items-center",
@@ -86,19 +50,20 @@ const b = {
       "border",
       "border-white",
       "text-center",
-      "text-xxs",
       "font-bold",
       "leading-none",
       "text-white",
       "whitespace-nowrap",
       "gap-xxxs",
-      g && b[g],
-      R && e[R]
+      l[s],
+      m[r],
+      f[n],
+      i
     ),
-    children: t
+    children: o
   }
-) : null;
+);
 export {
-  E as UiNotificationBadge
+  g as UiNotificationBadge
 };
 //# sourceMappingURL=UiNotificationBadge.js.map

package/components/UiNotificationBadge/UiNotificationBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"UiNotificationBadge.js","sources":["../../../src/components/UiNotificationBadge/UiNotificationBadge.tsx"],"sourcesContent":["\nimport React from \"react\";\nimport cx from \"classnames\";\nimport { EBadgeOffset } from \"./_types\";\n\nimport { EColors } from \"../UiTypography\";\n\ntype UiNotificationBadge = {\n\toffset?: EBadgeOffset,\n\tchildren: React.ReactNode;\n\tcolor?: EColors;\n};\n\nconst colorClasses = {\n\t[EColors.WHITE]: \"bg-white\",\n\t[EColors.BLACK]: \"bg-black\",\n\t[EColors.TRANSPARENT]: \"bg-transparent\",\n\t[EColors.CURRENT]: \"bg-current\",\n\n\t[EColors.PRIMARY]: \"bg-primary\",\n\t[EColors.PRIMARY_50]: \"bg-primary-50\",\n\t[EColors.PRIMARY_100]: \"bg-primary-100\",\n\t[EColors.PRIMARY_200]: \"bg-primary-200\",\n\t[EColors.PRIMARY_300]: \"bg-primary-300\",\n\t[EColors.PRIMARY_400]: \"bg-primary-400\",\n\t[EColors.PRIMARY_500]: \"bg-primary-500\",\n\t[EColors.PRIMARY_600]: \"bg-primary-600\",\n\t[EColors.PRIMARY_700]: \"bg-primary-700\",\n\t[EColors.PRIMARY_800]: \"bg-primary-800\",\n\t[EColors.PRIMARY_900]: \"bg-primary-900\",\n\n\t[EColors.PRIMARY_ALT]: \"bg-primary-alt\",\n\t[EColors.PRIMARY_ALT_300]: \"bg-primary-alt-300\",\n\t[EColors.PRIMARY_ALT_400]: \"bg-primary-alt-400\",\n\t[EColors.PRIMARY_ALT_500]: \"bg-primary-alt-500\",\n\t[EColors.PRIMARY_ALT_600]: \"bg-primary-alt-600\",\n\t[EColors.PRIMARY_ALT_700]: \"bg-primary-alt-700\",\n\n\t[EColors.WARNING]: \"bg-warning\",\n\t[EColors.WARNING_300]: \"bg-warning-300\",\n\t[EColors.WARNING_400]: \"bg-warning-400\",\n\t[EColors.WARNING_500]: \"bg-warning-500\",\n\t[EColors.WARNING_600]: \"bg-warning-600\",\n\t[EColors.WARNING_700]: \"bg-warning-700\",\n\n\t[EColors.SECONDARY]: \"bg-secondary\",\n\t[EColors.SECONDARY_300]: \"bg-secondary-300\",\n\t[EColors.SECONDARY_400]: \"bg-secondary-400\",\n\t[EColors.SECONDARY_500]: \"bg-secondary-500\",\n\t[EColors.SECONDARY_600]: \"bg-secondary-600\",\n\t[EColors.SECONDARY_700]: \"bg-secondary-700\",\n\n\t[EColors.SECONDARY_ALT]: \"bg-secondary-alt\",\n\t[EColors.SECONDARY_ALT_200]: \"bg-secondary-alt-200\",\n\t[EColors.SECONDARY_ALT_300]: \"bg-secondary-alt-300\",\n\t[EColors.SECONDARY_ALT_400]: \"bg-secondary-alt-400\",\n\t[EColors.SECONDARY_ALT_500]: \"bg-secondary-alt-500\",\n\t[EColors.SECONDARY_ALT_600]: \"bg-secondary-alt-600\",\n\t[EColors.SECONDARY_ALT_700]: \"bg-secondary-alt-700\",\n\n\t[EColors.ERROR]: \"bg-error\",\n\t[EColors.ERROR_300]: \"bg-error-300\",\n\t[EColors.ERROR_400]: \"bg-error-400\",\n\t[EColors.ERROR_500]: \"bg-error-500\",\n\t[EColors.ERROR_600]: \"bg-error-600\",\n\t[EColors.ERROR_700]: \"bg-error-700\",\n\n\t[EColors.ACCENT]: \"bg-accent\",\n\t[EColors.ACCENT_300]: \"bg-accent-300\",\n\t[EColors.ACCENT_500]: \"bg-accent-500\",\n\t[EColors.ACCENT_600]: \"bg-accent-600\",\n\t[EColors.ACCENT_700]: \"bg-accent-700\",\n\n\t[EColors.ACCENT_ALT]: \"bg-accent-alt\",\n\t[EColors.ACCENT_ALT_300]: \"bg-accent-alt-300\",\n\t[EColors.ACCENT_ALT_400]: \"bg-accent-alt-400\",\n\t[EColors.ACCENT_ALT_500]: \"bg-accent-alt-500\",\n\t[EColors.ACCENT_ALT_600]: \"bg-accent-alt-600\",\n\t[EColors.ACCENT_ALT_700]: \"bg-accent-alt-700\",\n};\n\nconst offsetClasses = {\n\t[EBadgeOffset.DEFAULT]: \"-right-xxxs -top-xxxs\",\n\t[EBadgeOffset.OFFSET_BOTTOM_RIGHT]: \"-right-xxxs -bottom-xxxs\",\n\t[EBadgeOffset.OFFSET_TOP_LEFT]: \"-left-xxxs -top-xxxs\",\n\t[EBadgeOffset.OFFSET_BOTTOM_LEFT]: \"-left-xxxs -bottom-xxxs\",\n};\n\nexport const UiNotificationBadge: React.FC<UiNotificationBadge> = ({\n\toffset,\n\tchildren,\n\tcolor,\n}) => {\n\tif (!children) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<div\n\t\t\tclassName={ cx(\n\t\t\t\t\"notification-badge\",\n\t\t\t\t\"p-xxxs\",\n\t\t\t\t\"h-sm\",\n\t\t\t\t\"min-w-sm\",\n\t\t\t\t\"absolute\",\n\t\t\t\t\"inline-flex\",\n\t\t\t\t\"items-center\",\n\t\t\t\t\"rounded-full\",\n\t\t\t\t\"border\",\n\t\t\t\t\"border-white\",\n\t\t\t\t\"text-center\",\n\t\t\t\t\"text-xxs\",\n\t\t\t\t\"font-bold\",\n\t\t\t\t\"leading-none\",\n\t\t\t\t\"text-white\",\n\t\t\t\t\"whitespace-nowrap\",\n\t\t\t\t\"gap-xxxs\",\n\t\t\t\tcolor && colorClasses[color],\n\t\t\t\toffset && offsetClasses[offset]\n\t\t\t) }\n\t\t>\n\t\t\t{ children }\n\t\t</div>\n\t);\n};\n"],"names":["colorClasses","EColors","offsetClasses","EBadgeOffset","UiNotificationBadge","offset","children","color","jsx","cx"],"mappings":"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"}
+{"version":3,"file":"UiNotificationBadge.js","sources":["../../../src/components/UiNotificationBadge/UiNotificationBadge.tsx"],"sourcesContent":["\nimport React from \"react\";\nimport cx from \"classnames\";\nimport { EBadgeOffset, EBadgeSizes, EBadgeTypes } from \"./_types\";\n\ntype TUiNotificationBadge = {\n\toffset?: EBadgeOffset,\n\tchildren: React.ReactNode;\n\tkind?: EBadgeTypes;\n\tsize?: EBadgeSizes;\n\tclassName?: string;\n\n};\n\nconst offsetClasses = {\n\t[EBadgeOffset.DEFAULT]: \"-right-xxxs -top-xxxs\",\n\t[EBadgeOffset.OFFSET_BOTTOM_RIGHT]: \"-right-xxxs -bottom-xxxs\",\n\t[EBadgeOffset.OFFSET_TOP_LEFT]: \"-left-xxxs -top-xxxs\",\n\t[EBadgeOffset.OFFSET_BOTTOM_LEFT]: \"-left-xxxs -bottom-xxxs\",\n};\n\nconst kindClasses = {\n\t[EBadgeTypes.DEFAULT]: `\n\t\tbg-error-500\n\n\t`,\n\t[EBadgeTypes.PRIMARY]: `\n\t\tbg-primary-800\n\n\t`,\n\n};\n\nconst sizeClasses = {\n\t[EBadgeSizes.DEFAULT]: `\n\t\th-sm\n\t\tmin-w-sm\n\t\tp-xxxs\n\t\ttext-xxs\n\t`,\n\t[EBadgeSizes.LARGE]: `\n\t\th-lg\n\t\tmin-w-lg\n\t\tp-xxs\n\t\tjustify-center\n\t\ttext-2xl\n\t\tborder-2\n\n\t`\n\n};\n\nexport const UiNotificationBadge: React.FC<TUiNotificationBadge> = ({\n\toffset = EBadgeOffset.DEFAULT,\n\tchildren,\n\tclassName,\n\tkind = EBadgeTypes.DEFAULT,\n\tsize = EBadgeSizes.DEFAULT\n\n}) => {\n\n\treturn (\n\t\t<div\n\t\t\tclassName={ cx(\n\t\t\t\t\"notification-badge\",\n\t\t\t\t\"absolute\",\n\t\t\t\t\"inline-flex\",\n\t\t\t\t\"items-center\",\n\t\t\t\t\"rounded-full\",\n\t\t\t\t\"border\",\n\t\t\t\t\"border-white\",\n\t\t\t\t\"text-center\",\n\t\t\t\t\"font-bold\",\n\t\t\t\t\"leading-none\",\n\t\t\t\t\"text-white\",\n\t\t\t\t\"whitespace-nowrap\",\n\t\t\t\t\"gap-xxxs\",\n\t\t\t\toffsetClasses[offset],\n\t\t\t\tkindClasses[kind],\n\t\t\t\tsizeClasses[size],\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t{ children }\n\t\t</div>\n\t);\n};\n"],"names":["offsetClasses","EBadgeOffset","kindClasses","EBadgeTypes","sizeClasses","EBadgeSizes","UiNotificationBadge","offset","children","className","kind","size","jsx","cx"],"mappings":";;;;AAcA,MAAMA,IAAgB;AAAA,EACrB,CAACC,EAAa,OAAO,GAAG;AAAA,EACxB,CAACA,EAAa,mBAAmB,GAAG;AAAA,EACpC,CAACA,EAAa,eAAe,GAAG;AAAA,EAChC,CAACA,EAAa,kBAAkB,GAAG;AACpC,GAEMC,IAAc;AAAA,EACnB,CAACC,EAAY,OAAO,GAAG;AAAA;AAAA;AAAA;AAAA,EAIvB,CAACA,EAAY,OAAO,GAAG;AAAA;AAAA;AAAA;AAKxB,GAEMC,IAAc;AAAA,EACnB,CAACC,EAAY,OAAO,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMvB,CAACA,EAAY,KAAK,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUtB,GAEaC,IAAsD,CAAC;AAAA,EACnE,QAAAC,IAASN,EAAa;AAAA,EACtB,UAAAO;AAAA,EACA,WAAAC;AAAA,EACA,MAAAC,IAAOP,EAAY;AAAA,EACnB,MAAAQ,IAAON,EAAY;AAEpB,MAGE,gBAAAO;AAAA,EAAC;AAAA,EAAA;AAAA,IACA,WAAYC;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACAb,EAAcO,CAAM;AAAA,MACpBL,EAAYQ,CAAI;AAAA,MAChBN,EAAYO,CAAI;AAAA,MAChBF;AAAA,IACD;AAAA,IAEE,UAAAD;AAAA,EAAA;AACH;"}

package/components/UiNotificationBadge/_types.d.ts

@@ -4,3 +4,11 @@ export declare enum EBadgeOffset {
     OFFSET_BOTTOM_RIGHT = "offset-bottom-right",
     OFFSET_BOTTOM_LEFT = "offset-bottom-left"
 }
+export declare enum EBadgeSizes {
+    DEFAULT = "default",
+    LARGE = "lg"
+}
+export declare enum EBadgeTypes {
+    DEFAULT = "error",
+    PRIMARY = "primary"
+}

package/components/UiNotificationBadge/_types.js

@@ -1,5 +1,7 @@
-var t = /* @__PURE__ */ ((T) => (T.DEFAULT = "default", T.OFFSET_TOP_LEFT = "offset-top-left", T.OFFSET_BOTTOM_RIGHT = "offset-bottom-right", T.OFFSET_BOTTOM_LEFT = "offset-bottom-left", T))(t || {});
+var t = /* @__PURE__ */ ((r) => (r.DEFAULT = "default", r.OFFSET_TOP_LEFT = "offset-top-left", r.OFFSET_BOTTOM_RIGHT = "offset-bottom-right", r.OFFSET_BOTTOM_LEFT = "offset-bottom-left", r))(t || {}), T = /* @__PURE__ */ ((r) => (r.DEFAULT = "default", r.LARGE = "lg", r))(T || {}), F = /* @__PURE__ */ ((r) => (r.DEFAULT = "error", r.PRIMARY = "primary", r))(F || {});
 export {
-  t as EBadgeOffset
+  t as EBadgeOffset,
+  T as EBadgeSizes,
+  F as EBadgeTypes
 };
 //# sourceMappingURL=_types.js.map

package/components/UiNotificationBadge/_types.js.map

@@ -1 +1 @@
-{"version":3,"file":"_types.js","sources":["../../../src/components/UiNotificationBadge/_types.ts"],"sourcesContent":["export enum EBadgeOffset {\n\tDEFAULT = \"default\",\n\tOFFSET_TOP_LEFT = \"offset-top-left\",\n\tOFFSET_BOTTOM_RIGHT = \"offset-bottom-right\",\n\tOFFSET_BOTTOM_LEFT = \"offset-bottom-left\"\n}\n"],"names":["EBadgeOffset"],"mappings":"AAAY,IAAAA,sBAAAA,OACXA,EAAA,UAAU,WACVA,EAAA,kBAAkB,mBAClBA,EAAA,sBAAsB,uBACtBA,EAAA,qBAAqB,sBAJVA,IAAAA,KAAA,CAAA,CAAA;"}
+{"version":3,"file":"_types.js","sources":["../../../src/components/UiNotificationBadge/_types.ts"],"sourcesContent":["export enum EBadgeOffset {\n\tDEFAULT = \"default\",\n\tOFFSET_TOP_LEFT = \"offset-top-left\",\n\tOFFSET_BOTTOM_RIGHT = \"offset-bottom-right\",\n\tOFFSET_BOTTOM_LEFT = \"offset-bottom-left\"\n}\n\nexport enum EBadgeSizes {\n\tDEFAULT = \"default\",\n\tLARGE = \"lg\"\n}\n\nexport enum EBadgeTypes {\n\tDEFAULT = \"error\",\n\tPRIMARY = \"primary\"\n\n}\n"],"names":["EBadgeOffset","EBadgeSizes","EBadgeTypes"],"mappings":"AAAY,IAAAA,sBAAAA,OACXA,EAAA,UAAU,WACVA,EAAA,kBAAkB,mBAClBA,EAAA,sBAAsB,uBACtBA,EAAA,qBAAqB,sBAJVA,IAAAA,KAAA,CAAA,CAAA,GAOAC,sBAAAA,OACXA,EAAA,UAAU,WACVA,EAAA,QAAQ,MAFGA,IAAAA,KAAA,CAAA,CAAA,GAKAC,sBAAAA,OACXA,EAAA,UAAU,SACVA,EAAA,UAAU,WAFCA,IAAAA,KAAA,CAAA,CAAA;"}

package/components/UiPills/UiPills.d.ts

@@ -6,6 +6,7 @@ interface IUiPills {
     size?: EBadgeSize;
     icon?: React.ReactNode;
     rounded?: boolean;
+    className?: string;
 }
 export declare const UiPills: React.FC<IUiPills>;
 export {};

package/components/UiPills/UiPills.js

@@ -1,10 +1,10 @@
-import { jsxs as x, jsx as p } from "react/jsx-runtime";
+import { jsxs as m, jsx as p } from "react/jsx-runtime";
 import "react";
 import { EBadgeKind as r, EBadgeSize as e } from "./_types.js";
 import { UiTypography as g } from "../UiTypography/UiTypography.js";
-import { ETypographySizes as t, ETextWeight as m } from "../UiTypography/_types.js";
-import c from "classnames";
-const l = {
+import { ETypographySizes as t, ETextWeight as c } from "../UiTypography/_types.js";
+import l from "classnames";
+const d = {
   [r.PRIMARY]: "bg-primary-100 text-primary-700",
   [r.ERROR]: "bg-error-300 text-error-700",
   [r.WARNING]: "bg-warning-300 text-warning-700",
@@ -12,30 +12,32 @@ const l = {
   [r.PRIMARY_ALT]: "bg-primary-300 text-primary-800",
   [r.SECONDARY]: "bg-white text-secondary-300 ring-1 ring-secondary-alt-300",
   [r.ACCENT_ALT]: "bg-accent-alt-500 text-secondary-700"
-}, d = {
+}, y = {
   [e.SMALL]: t.XXS,
   [e.MEDIUM]: t.XS,
   [e.LARGE]: t.SM
-}, M = ({
+}, S = ({
   children: i,
   kind: s = r.PRIMARY,
   size: a = e.SMALL,
-  icon: o,
-  rounded: n = !1
-}) => /* @__PURE__ */ x("div", { className: c(
+  className: o,
+  icon: n,
+  rounded: x = !1
+}) => /* @__PURE__ */ m("div", { className: l(
   "ui-pills",
   "grid grid-flow-col justify-start w-max",
   "items-center",
   "gap-xxxs",
   "px-xxs py-xxxs",
   "overflow-hidden",
-  n ? "rounded-full" : "rounded",
-  l[s]
+  x ? "rounded-full" : "rounded-sm",
+  d[s],
+  o
 ), children: [
-  o,
-  i ? /* @__PURE__ */ p(g, { size: d[a], weight: m.SEMI_BOLD, className: "whitespace-nowrap", children: i }) : null
+  n,
+  i ? /* @__PURE__ */ p(g, { size: y[a], weight: c.SEMI_BOLD, className: "whitespace-nowrap", children: i }) : null
 ] });
 export {
-  M as UiPills
+  S as UiPills
 };
 //# sourceMappingURL=UiPills.js.map

package/components/UiPills/UiPills.js.map

@@ -1 +1 @@
-{"version":3,"file":"UiPills.js","sources":["../../../src/components/UiPills/UiPills.tsx"],"sourcesContent":["import React from \"react\";\nimport { EBadgeKind, EBadgeSize } from \"./_types.ts\";\nimport { ETextWeight, ETypographySizes, UiTypography } from \"../UiTypography\";\nimport cx from \"classnames\";\n\ninterface IUiPills {\n\tchildren: React.ReactNode\n\tkind?: EBadgeKind,\n\tsize?: EBadgeSize,\n\ticon?: React.ReactNode,\n\trounded?: boolean\n}\n\nconst kindClasses = {\n\t[EBadgeKind.PRIMARY]: \"bg-primary-100 text-primary-700\",\n\t[EBadgeKind.ERROR]: \"bg-error-300 text-error-700\",\n\t[EBadgeKind.WARNING]: \"bg-warning-300 text-warning-700\",\n\t[EBadgeKind.ACCENT]: \"bg-accent-300 text-accent-700\",\n\t[EBadgeKind.PRIMARY_ALT]: \"bg-primary-300 text-primary-800\",\n\t[EBadgeKind.SECONDARY]: \"bg-white text-secondary-300 ring-1 ring-secondary-alt-300\",\n\t[EBadgeKind.ACCENT_ALT]: \"bg-accent-alt-500 text-secondary-700\",\n};\n\nconst sizeEnums = {\n\t[EBadgeSize.SMALL]: ETypographySizes.XXS,\n\t[EBadgeSize.MEDIUM]: ETypographySizes.XS,\n\t[EBadgeSize.LARGE]: ETypographySizes.SM,\n};\n\nexport const UiPills: React.FC<IUiPills> = ({\n\tchildren,\n\tkind = EBadgeKind.PRIMARY,\n\tsize = EBadgeSize.SMALL,\n\ticon, rounded = false\n}) => {\n\treturn (\n\t\t<div className={ cx(\n\t\t\t\"ui-pills\",\n\t\t\t\"grid grid-flow-col justify-start w-max\",\n\t\t\t\"items-center\",\n\t\t\t\"gap-xxxs\",\n\t\t\t\"px-xxs py-xxxs\",\n\t\t\t\"overflow-hidden\",\n\t\t\trounded ? \"rounded-full\": \"rounded\",\n\t\t\tkindClasses[kind],\n\t\t) }>\n\t\t\t{ icon }\n\t\t\t{ children\n\t\t\t\t? (\n\t\t\t\t\t<UiTypography size={ sizeEnums[size] } weight={ ETextWeight.SEMI_BOLD } className=\"whitespace-nowrap\">\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</UiTypography>\n\t\t\t\t)\n\t\t\t\t: null }\n\t\t</div>\n\t);\n};\n"],"names":["kindClasses","EBadgeKind","sizeEnums","EBadgeSize","ETypographySizes","UiPills","children","kind","size","icon","rounded","jsxs","cx","jsx","UiTypography","ETextWeight"],"mappings":";;;;;;AAaA,MAAMA,IAAc;AAAA,EACnB,CAACC,EAAW,OAAO,GAAG;AAAA,EACtB,CAACA,EAAW,KAAK,GAAG;AAAA,EACpB,CAACA,EAAW,OAAO,GAAG;AAAA,EACtB,CAACA,EAAW,MAAM,GAAG;AAAA,EACrB,CAACA,EAAW,WAAW,GAAG;AAAA,EAC1B,CAACA,EAAW,SAAS,GAAG;AAAA,EACxB,CAACA,EAAW,UAAU,GAAG;AAC1B,GAEMC,IAAY;AAAA,EACjB,CAACC,EAAW,KAAK,GAAGC,EAAiB;AAAA,EACrC,CAACD,EAAW,MAAM,GAAGC,EAAiB;AAAA,EACtC,CAACD,EAAW,KAAK,GAAGC,EAAiB;AACtC,GAEaC,IAA8B,CAAC;AAAA,EAC3C,UAAAC;AAAA,EACA,MAAAC,IAAON,EAAW;AAAA,EAClB,MAAAO,IAAOL,EAAW;AAAA,EAClB,MAAAM;AAAA,EAAM,SAAAC,IAAU;AACjB,MAEE,gBAAAC,EAAC,SAAI,WAAYC;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACAF,IAAU,iBAAgB;AAAA,EAC1BV,EAAYO,CAAI;AAEd,GAAA,UAAA;AAAA,EAAAE;AAAA,EACAH,IAEA,gBAAAO,EAACC,GAAa,EAAA,MAAOZ,EAAUM,CAAI,GAAI,QAASO,EAAY,WAAY,WAAU,qBAC/E,UAAAT,EACH,CAAA,IAEC;AAAA,GACJ;"}
+{"version":3,"file":"UiPills.js","sources":["../../../src/components/UiPills/UiPills.tsx"],"sourcesContent":["import React from \"react\";\nimport { EBadgeKind, EBadgeSize } from \"./_types.ts\";\nimport { ETextWeight, ETypographySizes, UiTypography } from \"../UiTypography\";\nimport cx from \"classnames\";\n\ninterface IUiPills {\n\tchildren: React.ReactNode\n\tkind?: EBadgeKind,\n\tsize?: EBadgeSize,\n\ticon?: React.ReactNode,\n\trounded?: boolean,\n\tclassName?: string\n}\n\nconst kindClasses = {\n\t[EBadgeKind.PRIMARY]: \"bg-primary-100 text-primary-700\",\n\t[EBadgeKind.ERROR]: \"bg-error-300 text-error-700\",\n\t[EBadgeKind.WARNING]: \"bg-warning-300 text-warning-700\",\n\t[EBadgeKind.ACCENT]: \"bg-accent-300 text-accent-700\",\n\t[EBadgeKind.PRIMARY_ALT]: \"bg-primary-300 text-primary-800\",\n\t[EBadgeKind.SECONDARY]: \"bg-white text-secondary-300 ring-1 ring-secondary-alt-300\",\n\t[EBadgeKind.ACCENT_ALT]: \"bg-accent-alt-500 text-secondary-700\",\n};\n\nconst sizeEnums = {\n\t[EBadgeSize.SMALL]: ETypographySizes.XXS,\n\t[EBadgeSize.MEDIUM]: ETypographySizes.XS,\n\t[EBadgeSize.LARGE]: ETypographySizes.SM,\n};\n\nexport const UiPills: React.FC<IUiPills> = ({\n\tchildren,\n\tkind = EBadgeKind.PRIMARY,\n\tsize = EBadgeSize.SMALL,\n\tclassName,\n\ticon,\n\trounded = false\n}) => {\n\treturn (\n\t\t<div className={ cx(\n\t\t\t\"ui-pills\",\n\t\t\t\"grid grid-flow-col justify-start w-max\",\n\t\t\t\"items-center\",\n\t\t\t\"gap-xxxs\",\n\t\t\t\"px-xxs py-xxxs\",\n\t\t\t\"overflow-hidden\",\n\t\t\trounded ? \"rounded-full\": \"rounded-sm\",\n\t\t\tkindClasses[kind],\n\t\t\tclassName\n\t\t) }>\n\t\t\t{ icon }\n\t\t\t{ children\n\t\t\t\t? (\n\t\t\t\t\t<UiTypography size={ sizeEnums[size] } weight={ ETextWeight.SEMI_BOLD } className=\"whitespace-nowrap\">\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</UiTypography>\n\t\t\t\t)\n\t\t\t\t: null }\n\t\t</div>\n\t);\n};\n"],"names":["kindClasses","EBadgeKind","sizeEnums","EBadgeSize","ETypographySizes","UiPills","children","kind","size","className","icon","rounded","jsxs","cx","jsx","UiTypography","ETextWeight"],"mappings":";;;;;;AAcA,MAAMA,IAAc;AAAA,EACnB,CAACC,EAAW,OAAO,GAAG;AAAA,EACtB,CAACA,EAAW,KAAK,GAAG;AAAA,EACpB,CAACA,EAAW,OAAO,GAAG;AAAA,EACtB,CAACA,EAAW,MAAM,GAAG;AAAA,EACrB,CAACA,EAAW,WAAW,GAAG;AAAA,EAC1B,CAACA,EAAW,SAAS,GAAG;AAAA,EACxB,CAACA,EAAW,UAAU,GAAG;AAC1B,GAEMC,IAAY;AAAA,EACjB,CAACC,EAAW,KAAK,GAAGC,EAAiB;AAAA,EACrC,CAACD,EAAW,MAAM,GAAGC,EAAiB;AAAA,EACtC,CAACD,EAAW,KAAK,GAAGC,EAAiB;AACtC,GAEaC,IAA8B,CAAC;AAAA,EAC3C,UAAAC;AAAA,EACA,MAAAC,IAAON,EAAW;AAAA,EAClB,MAAAO,IAAOL,EAAW;AAAA,EAClB,WAAAM;AAAA,EACA,MAAAC;AAAA,EACA,SAAAC,IAAU;AACX,MAEE,gBAAAC,EAAC,SAAI,WAAYC;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACAF,IAAU,iBAAgB;AAAA,EAC1BX,EAAYO,CAAI;AAAA,EAChBE;AAEE,GAAA,UAAA;AAAA,EAAAC;AAAA,EACAJ,IAEA,gBAAAQ,EAACC,GAAa,EAAA,MAAOb,EAAUM,CAAI,GAAI,QAASQ,EAAY,WAAY,WAAU,qBAC/E,UAAAV,EACH,CAAA,IAEC;AAAA,GACJ;"}

package/components/UiPlainRadio/UiPlainRadio.d.ts

@@ -5,6 +5,7 @@ export type TUiPlainRadio = {
     subHeader?: string;
     value: string;
     name: string;
+    className?: string;
     checked?: boolean;
     onChange: (value: string) => void;
 } & Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange" | "checked" | "value" | "name">;

package/components/UiPlainRadio/UiPlainRadio.js

@@ -1,83 +1,98 @@
-import { jsxs as n, jsx as t } from "react/jsx-runtime";
+import { jsxs as i, jsx as n } from "react/jsx-runtime";
 import "react";
-import i from "classnames";
-import { UiRadio as l } from "../UiRadio/UiRadio.js";
-const y = ({
-  children: p,
+import p from "classnames";
+import { UiRadio as c } from "../UiRadio/UiRadio.js";
+const f = ({
+  children: l,
   disabled: r,
-  subHeader: m,
+  subHeader: d,
   value: e,
   name: a,
   checked: o = !1,
-  onChange: s
-}) => /* @__PURE__ */ n(
+  className: s,
+  onChange: t
+}) => /* @__PURE__ */ i(
   "label",
   {
-    className: i(
+    className: p(
       "ui-radio-fancy",
       "relative",
       {
-        "pointer-events-none": r
-      }
+        "pointer-events-none opacity-50": r
+      },
+      s
     ),
     htmlFor: a + e,
     children: [
-      /* @__PURE__ */ t(
+      /* @__PURE__ */ n(
         "input",
         {
-          className: i(
+          className: p(
             " absolute",
             "appearance-none",
-            "peer"
+            "peer/plain-radio"
           ),
           id: a + e,
           type: "radio",
           value: e,
           checked: o,
-          onChange: () => s(e)
+          onChange: () => t(e)
         }
       ),
-      /* @__PURE__ */ n("div", { className: i(
-        "box-border",
-        "size-full",
-        "cursor-pointer",
-        "rounded-lg",
-        "border-2",
-        "bg-white",
-        "peer-active:bg-secondary-alt-200",
-        "p-sm",
-        "peer-hover:border-primary-700",
-        "peer-focus:shadow-border-primary",
-        "flex",
-        "items-center",
-        "gap-sm",
-        "text-sm",
+      /* @__PURE__ */ i(
+        "div",
         {
-          "border-secondary-alt-400": r && !o,
-          "border-primary-300": r && o,
-          "border-secondary-alt-600": !r && !o,
-          "border-primary-600": !r && o
+          className: p(
+            "box-border",
+            "size-full",
+            "cursor-pointer",
+            "rounded-xl",
+            "border border-secondary-alt-600",
+            "peer-checked/plain-radio:border-primary-600",
+            "peer-checked/plain-radio:outline",
+            "peer-checked/plain-radio:outline",
+            "peer-checked/plain-radio:outline-primary-600",
+            "peer-hover/plain-radio:peer-checked/plain-radio:outline-primary-700",
+            "bg-white",
+            "peer-active/plain-radio:bg-secondary-alt-200",
+            "p-sm",
+            "peer-hover/plain-radio:border-primary-700",
+            "peer-focus/plain-radio:shadow-border-primary",
+            "flex",
+            "items-center",
+            "gap-sm",
+            "text-sm",
+            {
+              "border-secondary-alt-400": r && !o,
+              "border-primary-300": r && o,
+              "border-secondary-alt-600": !r && !o,
+              "border-primary-600": !r && o
+            }
+          ),
+          children: [
+            /* @__PURE__ */ n(
+              c,
+              {
+                className: "pointer-events-none",
+                disabled: r,
+                value: e,
+                name: a,
+                onChange: () => t(e),
+                checked: o,
+                tabIndex: -1
+              }
+            ),
+            /* @__PURE__ */ i("div", { className: "flex flex-col", children: [
+              l,
+              /* @__PURE__ */ n("div", { className: "text-xs font-normal text-secondary-alt-400", children: d })
+            ] })
+          ]
         }
-      ), children: [
-        /* @__PURE__ */ t("span", { className: "pointer-events-none", children: /* @__PURE__ */ t(
-          l,
-          {
-            disabled: r,
-            value: e,
-            name: a,
-            onChange: () => s(e),
-            checked: o
-          }
-        ) }),
-        /* @__PURE__ */ n("div", { className: "flex flex-col", children: [
-          p,
-          /* @__PURE__ */ t("div", { className: "text-xs font-normal text-secondary-alt-400", children: m })
-        ] })
-      ] })
+      )
     ]
   }
 );
 export {
-  y as UiPlainRadio
+  f as UiPlainRadio
 };
 //# sourceMappingURL=UiPlainRadio.js.map

package/components/UiPlainRadio/UiPlainRadio.js.map

@@ -1 +1 @@
-{"version":3,"file":"UiPlainRadio.js","sources":["../../../src/components/UiPlainRadio/UiPlainRadio.tsx"],"sourcesContent":["import React from \"react\";\nimport cx from \"classnames\";\nimport { UiRadio } from \"../UiRadio\";\n\nexport type  TUiPlainRadio = {\n\tchildren?: React.ReactNode\n\tdisabled?: boolean;\n\tsubHeader?: string;\n\tvalue: string;\n\tname: string;\n\tchecked?: boolean\n\tonChange: (value: string) => void;\n\n}& Omit<React.InputHTMLAttributes<HTMLInputElement>, \"onChange\" | \"checked\" | \"value\" | \"name\">;\n\nexport const UiPlainRadio: React.FC<TUiPlainRadio> = ({\n\tchildren,\n\tdisabled,\n\tsubHeader,\n\tvalue,\n\tname,\n\tchecked = false,\n\tonChange\n\n}) => {\n\n\treturn (\n\t\t<label className={ cx(\n\t\t\t\"ui-radio-fancy\",\n\t\t\t\"relative\",\n\t\t\t{\n\t\t\t\t\"pointer-events-none\": disabled\n\t\t\t}\n\t\t) }\n\t\thtmlFor={ name + value }\n\t\t>\n\t\t\t<input className={ cx(\n\t\t\t\t\" absolute\",\n\t\t\t\t\"appearance-none\",\n\t\t\t\t\"peer\",\n\n\t\t\t) }\n\t\t\tid={ name + value }\n\t\t\ttype=\"radio\"\n\t\t\tvalue={ value }\n\t\t\tchecked={ checked }\n\t\t\tonChange={ ()=> onChange(value) }\n\t\t\t/>\n\n\t\t\t<div className={ cx(\n\t\t\t\t\"box-border\",\n\t\t\t\t\"size-full\",\n\t\t\t\t\"cursor-pointer\",\n\t\t\t\t\"rounded-lg\",\n\t\t\t\t\"border-2\",\n\t\t\t\t\"bg-white\",\n\t\t\t\t\"peer-active:bg-secondary-alt-200\",\n\t\t\t\t\"p-sm\",\n\t\t\t\t\"peer-hover:border-primary-700\",\n\t\t\t\t\"peer-focus:shadow-border-primary\",\n\t\t\t\t\"flex\",\n\t\t\t\t\"items-center\",\n\t\t\t\t\"gap-sm\",\n\t\t\t\t\"text-sm\",\n\t\t\t\t{\n\t\t\t\t\t\"border-secondary-alt-400\": disabled && !checked,\n\t\t\t\t\t\"border-primary-300\": disabled && checked,\n\t\t\t\t\t\"border-secondary-alt-600\": !disabled && !checked,\n\t\t\t\t\t\"border-primary-600\": !disabled && checked\n\t\t\t\t}\n\n\t\t\t) }>\n\n\t\t\t\t<span className=\"pointer-events-none\">\n\t\t\t\t\t<UiRadio\n\t\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tname={ name }\n\t\t\t\t\t\tonChange={ ()=> onChange(value) }\n\t\t\t\t\t\tchecked={ checked }\n\n\t\t\t\t\t/>\n\t\t\t\t</span>\n\n\t\t\t\t<div className=\"flex flex-col\">\n\t\t\t\t\t{ children }\n\t\t\t\t\t<div className=\"text-xs font-normal text-secondary-alt-400\">{ subHeader }</div>\n\t\t\t\t</div>\n\n\t\t\t</div>\n\n\t\t</label>\n\n\t);\n};\n"],"names":["UiPlainRadio","children","disabled","subHeader","value","name","checked","onChange","jsxs","cx","jsx","UiRadio"],"mappings":";;;;AAeO,MAAMA,IAAwC,CAAC;AAAA,EACrD,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,UAAAC;AAED,MAGE,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IAAM,WAAYC;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,QACC,uBAAuBP;AAAA,MAAA;AAAA,IAEzB;AAAA,IACA,SAAUG,IAAOD;AAAA,IAEhB,UAAA;AAAA,MAAA,gBAAAM;AAAA,QAAC;AAAA,QAAA;AAAA,UAAM,WAAYD;AAAA,YAClB;AAAA,YACA;AAAA,YACA;AAAA,UAED;AAAA,UACA,IAAKJ,IAAOD;AAAA,UACZ,MAAK;AAAA,UACL,OAAAA;AAAA,UACA,SAAAE;AAAA,UACA,UAAW,MAAKC,EAASH,CAAK;AAAA,QAAA;AAAA,MAC9B;AAAA,MAEA,gBAAAI,EAAC,SAAI,WAAYC;AAAA,QAChB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,UACC,4BAA4BP,KAAY,CAACI;AAAA,UACzC,sBAAsBJ,KAAYI;AAAA,UAClC,4BAA4B,CAACJ,KAAY,CAACI;AAAA,UAC1C,sBAAsB,CAACJ,KAAYI;AAAA,QAAA;AAAA,MAKpC,GAAA,UAAA;AAAA,QAAC,gBAAAI,EAAA,QAAA,EAAK,WAAU,uBACf,UAAA,gBAAAA;AAAA,UAACC;AAAA,UAAA;AAAA,YACA,UAAAT;AAAA,YACA,OAAAE;AAAA,YACA,MAAAC;AAAA,YACA,UAAW,MAAKE,EAASH,CAAK;AAAA,YAC9B,SAAAE;AAAA,UAAA;AAAA,QAAA,GAGF;AAAA,QAEA,gBAAAE,EAAC,OAAI,EAAA,WAAU,iBACZ,UAAA;AAAA,UAAAP;AAAA,UACD,gBAAAS,EAAA,OAAA,EAAI,WAAU,8CAA+C,UAAWP,EAAA,CAAA;AAAA,QAAA,EAC1E,CAAA;AAAA,MAAA,EAED,CAAA;AAAA,IAAA;AAAA,EAAA;AAED;"}
+{"version":3,"file":"UiPlainRadio.js","sources":["../../../src/components/UiPlainRadio/UiPlainRadio.tsx"],"sourcesContent":["import React from \"react\";\nimport cx from \"classnames\";\nimport { UiRadio } from \"../UiRadio\";\n\nexport type  TUiPlainRadio = {\n\tchildren?: React.ReactNode\n\tdisabled?: boolean;\n\tsubHeader?: string;\n\tvalue: string;\n\tname: string;\n\tclassName?: string\n\tchecked?: boolean\n\tonChange: (value: string) => void;\n\n}& Omit<React.InputHTMLAttributes<HTMLInputElement>, \"onChange\" | \"checked\" | \"value\" | \"name\">;\n\nexport const UiPlainRadio: React.FC<TUiPlainRadio> = ({\n\tchildren,\n\tdisabled,\n\tsubHeader,\n\tvalue,\n\tname,\n\tchecked = false,\n\tclassName,\n\tonChange\n\n}) => {\n\n\treturn (\n\t\t<label className={ cx(\n\t\t\t\"ui-radio-fancy\",\n\t\t\t\"relative\",\n\t\t\t{\n\t\t\t\t\"pointer-events-none opacity-50\": disabled\n\t\t\t},\n\t\t\tclassName\n\t\t) }\n\t\thtmlFor={ name + value }\n\t\t>\n\t\t\t<input className={ cx(\n\t\t\t\t\" absolute\",\n\t\t\t\t\"appearance-none\",\n\t\t\t\t\"peer/plain-radio\",\n\t\t\t) }\n\t\t\tid={ name + value }\n\t\t\ttype=\"radio\"\n\t\t\tvalue={ value }\n\t\t\tchecked={ checked }\n\t\t\tonChange={ ()=> onChange(value) }\n\t\t\t/>\n\n\t\t\t<div className={ cx(\n\t\t\t\t\"box-border\",\n\t\t\t\t\"size-full\",\n\t\t\t\t\"cursor-pointer\",\n\t\t\t\t\"rounded-xl\",\n\t\t\t\t\"border border-secondary-alt-600\",\n\t\t\t\t\"peer-checked/plain-radio:border-primary-600\",\n\t\t\t\t\"peer-checked/plain-radio:outline\",\n\t\t\t\t\"peer-checked/plain-radio:outline\",\n\t\t\t\t\"peer-checked/plain-radio:outline-primary-600\",\n\t\t\t\t\"peer-hover/plain-radio:peer-checked/plain-radio:outline-primary-700\",\n\t\t\t\t\"bg-white\",\n\t\t\t\t\"peer-active/plain-radio:bg-secondary-alt-200\",\n\t\t\t\t\"p-sm\",\n\t\t\t\t\"peer-hover/plain-radio:border-primary-700\",\n\t\t\t\t\"peer-focus/plain-radio:shadow-border-primary\",\n\t\t\t\t\"flex\",\n\t\t\t\t\"items-center\",\n\t\t\t\t\"gap-sm\",\n\t\t\t\t\"text-sm\",\n\t\t\t\t{\n\t\t\t\t\t\"border-secondary-alt-400\": disabled && !checked,\n\t\t\t\t\t\"border-primary-300\": disabled && checked,\n\t\t\t\t\t\"border-secondary-alt-600\": !disabled && !checked,\n\t\t\t\t\t\"border-primary-600\": !disabled && checked\n\t\t\t\t}\n\n\t\t\t) }\n\t\t\t>\n\n\t\t\t\t<UiRadio\n\t\t\t\t\tclassName=\"pointer-events-none\"\n\t\t\t\t\tdisabled={ disabled }\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tname={ name }\n\t\t\t\t\tonChange={ ()=> onChange(value) }\n\t\t\t\t\tchecked={ checked }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t/>\n\n\t\t\t\t<div className=\"flex flex-col\">\n\t\t\t\t\t{ children }\n\t\t\t\t\t<div className=\"text-xs font-normal text-secondary-alt-400\">{ subHeader }</div>\n\t\t\t\t</div>\n\n\t\t\t</div>\n\n\t\t</label>\n\n\t);\n};\n"],"names":["UiPlainRadio","children","disabled","subHeader","value","name","checked","className","onChange","jsxs","cx","jsx","UiRadio"],"mappings":";;;;AAgBO,MAAMA,IAAwC,CAAC;AAAA,EACrD,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,WAAAC;AAAA,EACA,UAAAC;AAED,MAGE,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IAAM,WAAYC;AAAA,MAClB;AAAA,MACA;AAAA,MACA;AAAA,QACC,kCAAkCR;AAAA,MACnC;AAAA,MACAK;AAAA,IACD;AAAA,IACA,SAAUF,IAAOD;AAAA,IAEhB,UAAA;AAAA,MAAA,gBAAAO;AAAA,QAAC;AAAA,QAAA;AAAA,UAAM,WAAYD;AAAA,YAClB;AAAA,YACA;AAAA,YACA;AAAA,UACD;AAAA,UACA,IAAKL,IAAOD;AAAA,UACZ,MAAK;AAAA,UACL,OAAAA;AAAA,UACA,SAAAE;AAAA,UACA,UAAW,MAAKE,EAASJ,CAAK;AAAA,QAAA;AAAA,MAC9B;AAAA,MAEA,gBAAAK;AAAA,QAAC;AAAA,QAAA;AAAA,UAAI,WAAYC;AAAA,YAChB;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,cACC,4BAA4BR,KAAY,CAACI;AAAA,cACzC,sBAAsBJ,KAAYI;AAAA,cAClC,4BAA4B,CAACJ,KAAY,CAACI;AAAA,cAC1C,sBAAsB,CAACJ,KAAYI;AAAA,YAAA;AAAA,UAGrC;AAAA,UAGC,UAAA;AAAA,YAAA,gBAAAK;AAAA,cAACC;AAAA,cAAA;AAAA,gBACA,WAAU;AAAA,gBACV,UAAAV;AAAA,gBACA,OAAAE;AAAA,gBACA,MAAAC;AAAA,gBACA,UAAW,MAAKG,EAASJ,CAAK;AAAA,gBAC9B,SAAAE;AAAA,gBACA,UAAW;AAAA,cAAA;AAAA,YACZ;AAAA,YAEA,gBAAAG,EAAC,OAAI,EAAA,WAAU,iBACZ,UAAA;AAAA,cAAAR;AAAA,cACD,gBAAAU,EAAA,OAAA,EAAI,WAAU,8CAA+C,UAAWR,EAAA,CAAA;AAAA,YAAA,EAC1E,CAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAED;AAAA,EAAA;AAED;"}

package/components/UiProductCard/UiProductCard.d.ts

@@ -4,6 +4,7 @@ type TUiProductCardProps = {
     title?: React.ReactNode;
     subtitle?: React.ReactNode;
     header?: React.ReactNode;
+    className?: string;
 };
 export declare const UiProductCard: React.FC<TUiProductCardProps>;
 export {};

package/components/UiProductCard/UiProductCard.js

@@ -1,52 +1,49 @@
 import { jsxs as e, jsx as r } from "react/jsx-runtime";
 import "react";
 import { UiPills as a } from "../UiPills/UiPills.js";
-import { EBadgeKind as p } from "../UiPills/_types.js";
+import { EBadgeKind as c } from "../UiPills/_types.js";
 import { UiTypography as o } from "../UiTypography/UiTypography.js";
-import { ETypographySizes as n, ETextWeight as c, ETextAlign as l } from "../UiTypography/_types.js";
-import { EColors as t } from "../../_types/colors.js";
-const y = ({
+import { ETextAlign as l, ETextWeight as x, ETypographySizes as t } from "../UiTypography/_types.js";
+import { EColors as s } from "../../_types/colors.js";
+import g from "classnames";
+const A = ({
   badgeText: i,
-  title: s,
-  subtitle: d,
-  header: m
-}) => /* @__PURE__ */ e("div", { className: `relative
-			flex
-			flex-col
-			gap-sm
-			rounded-2xl
-			border
-			border-secondary-alt-500
-			bg-white
-			px-xs
-			py-sm`, children: [
-  i && /* @__PURE__ */ r("div", { className: "!absolute -top-xxs right-xs", children: /* @__PURE__ */ r(a, { rounded: !0, kind: p.ACCENT_ALT, children: i }) }),
-  m,
+  title: d,
+  subtitle: m,
+  header: n,
+  className: p
+}) => /* @__PURE__ */ e("div", { className: g(
+  "relative flex flex-col gap-sm rounded-2xl border border-secondary-alt-500 bg-white",
+  "px-xs py-sm",
+  p
+), children: [
+  i && /* @__PURE__ */ r("div", { className: "absolute! -top-xxs right-xs", children: /* @__PURE__ */ r(a, { rounded: !0, kind: c.ACCENT_ALT, children: i }) }),
+  n,
   /* @__PURE__ */ e("div", { className: "grid gap-xxs", children: [
     /* @__PURE__ */ r(
       o,
       {
-        size: n.MD,
-        weight: c.BOLD,
+        size: t.MD,
+        weight: x.BOLD,
         align: l.LEFT,
-        color: t.SECONDARY,
+        color: s.SECONDARY,
         lineHeight: !0,
-        children: s
+        children: d
       }
     ),
     /* @__PURE__ */ r(
       o,
       {
-        size: n.XS,
+        size: t.XS,
         align: l.LEFT,
-        color: t.SECONDARY_400,
+        color: s.SECONDARY_400,
         lineHeight: !0,
-        children: d
+        children: m
       }
     )
   ] })
 ] });
 export {
-  y as UiProductCard
+  A as UiProductCard
 };
 //# sourceMappingURL=UiProductCard.js.map

package/components/UiProductCard/UiProductCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"UiProductCard.js","sources":["../../../src/components/UiProductCard/UiProductCard.tsx"],"sourcesContent":["import React from \"react\";\nimport { EBadgeKind, UiPills } from \"../UiPills\";\nimport {\n\tUiTypography, ETypographySizes, ETextWeight, ETextAlign, EColors\n} from \"../UiTypography\";\n\ntype TUiProductCardProps = {\n\tbadgeText?: string;\n\ttitle?: React.ReactNode;\n\tsubtitle?: React.ReactNode;\n\theader?: React.ReactNode;\n}\n\nexport const UiProductCard: React.FC<TUiProductCardProps> = ({ badgeText,\n\ttitle,\n\tsubtitle,\n\theader }) => {\n\treturn (\n\t\t<div className='relative\n\t\t\tflex\n\t\t\tflex-col\n\t\t\tgap-sm\n\t\t\trounded-2xl\n\t\t\tborder\n\t\t\tborder-secondary-alt-500\n\t\t\tbg-white\n\t\t\tpx-xs\n\t\t\tpy-sm'>\n\n\t\t\t{ badgeText && (\n\t\t\t\t<div className=\"!absolute -top-xxs right-xs\">\n\t\t\t\t\t<UiPills rounded kind={ EBadgeKind.ACCENT_ALT }>{ badgeText }</UiPills>\n\t\t\t\t</div>\n\t\t\t) }\n\n\t\t\t{ header }\n\n\t\t\t<div className=\"grid gap-xxs\">\n\t\t\t\t<UiTypography\n\t\t\t\t\tsize={ ETypographySizes.MD }\n\t\t\t\t\tweight={ ETextWeight.BOLD }\n\t\t\t\t\talign={ ETextAlign.LEFT }\n\t\t\t\t\tcolor={ EColors.SECONDARY }\n\t\t\t\t\tlineHeight\n\t\t\t\t>\n\t\t\t\t\t{ title }\n\t\t\t\t</UiTypography>\n\n\t\t\t\t<UiTypography\n\t\t\t\t\tsize={ ETypographySizes.XS }\n\t\t\t\t\talign={ ETextAlign.LEFT }\n\t\t\t\t\tcolor={ EColors.SECONDARY_400 }\n\t\t\t\t\tlineHeight\n\t\t\t\t>\n\t\t\t\t\t{ subtitle }\n\t\t\t\t</UiTypography>\n\t\t\t</div>\n\t\t</div >\n\t);\n};\n"],"names":["UiProductCard","badgeText","title","subtitle","header","jsxs","jsx","UiPills","EBadgeKind","UiTypography","ETypographySizes","ETextWeight","ETextAlign","EColors"],"mappings":";;;;;;;AAaO,MAAMA,IAA+C,CAAC;AAAA,EAAE,WAAAC;AAAA,EAC9D,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAO,MAEN,gBAAAC,EAAC,OAAI,EAAA,WAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WAWZ,UAAA;AAAA,EAAAJ,KACA,gBAAAK,EAAA,OAAA,EAAI,WAAU,+BACd,UAAC,gBAAAA,EAAAC,GAAA,EAAQ,SAAO,IAAC,MAAOC,EAAW,YAAe,UAAAP,EAAW,CAAA,GAC9D;AAAA,EAGCG;AAAA,EAEF,gBAAAC,EAAC,OAAI,EAAA,WAAU,gBACd,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACG;AAAA,MAAA;AAAA,QACA,MAAOC,EAAiB;AAAA,QACxB,QAASC,EAAY;AAAA,QACrB,OAAQC,EAAW;AAAA,QACnB,OAAQC,EAAQ;AAAA,QAChB,YAAU;AAAA,QAER,UAAAX;AAAA,MAAA;AAAA,IACH;AAAA,IAEA,gBAAAI;AAAA,MAACG;AAAA,MAAA;AAAA,QACA,MAAOC,EAAiB;AAAA,QACxB,OAAQE,EAAW;AAAA,QACnB,OAAQC,EAAQ;AAAA,QAChB,YAAU;AAAA,QAER,UAAAV;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,EACD,CAAA;AAAA,GACD;"}
+{"version":3,"file":"UiProductCard.js","sources":["../../../src/components/UiProductCard/UiProductCard.tsx"],"sourcesContent":["import React from \"react\";\nimport { EBadgeKind, UiPills } from \"../UiPills\";\nimport {\n\tUiTypography, ETypographySizes, ETextWeight, ETextAlign, EColors\n} from \"../UiTypography\";\nimport cx from \"classnames\";\n\ntype TUiProductCardProps = {\n\tbadgeText?: string;\n\ttitle?: React.ReactNode;\n\tsubtitle?: React.ReactNode;\n\theader?: React.ReactNode;\n\tclassName?: string;\n}\n\nexport const UiProductCard: React.FC<TUiProductCardProps> = ({\n\tbadgeText,\n\ttitle,\n\tsubtitle,\n\theader,\n\tclassName\n}) => {\n\treturn (\n\t\t<div className={ cx(\n\t\t\t\"relative flex flex-col gap-sm rounded-2xl border border-secondary-alt-500 bg-white\",\n\t\t\t\"px-xs py-sm\",\n\t\t\tclassName\n\t\t) }>\n\n\t\t\t{ badgeText && (\n\t\t\t\t<div className=\"absolute! -top-xxs right-xs\">\n\t\t\t\t\t<UiPills rounded kind={ EBadgeKind.ACCENT_ALT }>{ badgeText }</UiPills>\n\t\t\t\t</div>\n\t\t\t) }\n\n\t\t\t{ header }\n\n\t\t\t<div className=\"grid gap-xxs\">\n\t\t\t\t<UiTypography\n\t\t\t\t\tsize={ ETypographySizes.MD }\n\t\t\t\t\tweight={ ETextWeight.BOLD }\n\t\t\t\t\talign={ ETextAlign.LEFT }\n\t\t\t\t\tcolor={ EColors.SECONDARY }\n\t\t\t\t\tlineHeight\n\t\t\t\t>\n\t\t\t\t\t{ title }\n\t\t\t\t</UiTypography>\n\n\t\t\t\t<UiTypography\n\t\t\t\t\tsize={ ETypographySizes.XS }\n\t\t\t\t\talign={ ETextAlign.LEFT }\n\t\t\t\t\tcolor={ EColors.SECONDARY_400 }\n\t\t\t\t\tlineHeight\n\t\t\t\t>\n\t\t\t\t\t{ subtitle }\n\t\t\t\t</UiTypography>\n\t\t\t</div>\n\t\t</div >\n\t);\n};\n"],"names":["UiProductCard","badgeText","title","subtitle","header","className","jsxs","cx","jsx","UiPills","EBadgeKind","UiTypography","ETypographySizes","ETextWeight","ETextAlign","EColors"],"mappings":";;;;;;;;AAeO,MAAMA,IAA+C,CAAC;AAAA,EAC5D,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AACD,MAEE,gBAAAC,EAAC,SAAI,WAAYC;AAAA,EAChB;AAAA,EACA;AAAA,EACAF;AAGE,GAAA,UAAA;AAAA,EAAAJ,KACA,gBAAAO,EAAA,OAAA,EAAI,WAAU,+BACd,UAAC,gBAAAA,EAAAC,GAAA,EAAQ,SAAO,IAAC,MAAOC,EAAW,YAAe,UAAAT,EAAW,CAAA,GAC9D;AAAA,EAGCG;AAAA,EAEF,gBAAAE,EAAC,OAAI,EAAA,WAAU,gBACd,UAAA;AAAA,IAAA,gBAAAE;AAAA,MAACG;AAAA,MAAA;AAAA,QACA,MAAOC,EAAiB;AAAA,QACxB,QAASC,EAAY;AAAA,QACrB,OAAQC,EAAW;AAAA,QACnB,OAAQC,EAAQ;AAAA,QAChB,YAAU;AAAA,QAER,UAAAb;AAAA,MAAA;AAAA,IACH;AAAA,IAEA,gBAAAM;AAAA,MAACG;AAAA,MAAA;AAAA,QACA,MAAOC,EAAiB;AAAA,QACxB,OAAQE,EAAW;AAAA,QACnB,OAAQC,EAAQ;AAAA,QAChB,YAAU;AAAA,QAER,UAAAZ;AAAA,MAAA;AAAA,IAAA;AAAA,EACH,EACD,CAAA;AAAA,GACD;"}

package/components/UiProgress/UiProgress.d.ts

@@ -4,6 +4,7 @@ interface IUiProgress {
     max: number;
     current: number;
     progressText?: string;
+    className?: string;
 }
 export declare const UiProgress: React.FC<IUiProgress>;
 export {};