@zenpatient-org/healthspan-marketing-ui 0.1.35 → 0.1.37

package/dist/components/Checkbox/Checkbox.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),s=require("../Typography/Typography.cjs.js"),m=require("./assets/checkbox-checkmark.svg.cjs.js"),p=require("./assets/checkbox-dash.svg.cjs.js"),k=require("./assets/checkbox-error.svg.cjs.js"),o=require("../../utils/cn/cn.cjs.js"),e=require("./checkbox.module.css.cjs.js"),y=({label:u,checkboxSize:n="lg",checkboxVariant:d="default",isError:c=!1,errorText:l,inverted:i=!1,disabled:r,checked:t,className:f,...h})=>{const x=b=>{switch(b){case"default":return a.jsx(m.default,{className:e.default.icon});case"undetermined":return a.jsx(p.default,{className:e.default.icon})}};return a.jsxs("label",{className:o.cn(e.default.root,i&&e.default.inverted,c&&e.default.error,r&&e.default.disabled,f),children:[a.jsx("input",{...h,type:"checkbox",disabled:r,checked:t,className:e.default.checkbox}),a.jsx("div",{className:o.cn(e.default.visibleCustomCheckbox,e.default[n]),children:t&&x(d)}),a.jsx(s.Typography,{defaultVariant:"labelSm",className:e.default.label,children:u}),c&&!!l&&a.jsxs("div",{className:e.default.errorTextContainer,children:[a.jsx(k.default,{className:e.default.errorIcon}),a.jsx(s.Typography,{defaultVariant:"labelSm",className:e.default.errorText,children:l})]})]})};exports.Checkbox=y;

package/dist/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,14 @@
+import { InputHTMLAttributes } from 'react';
+
+export type TCheckboxSize = 'sm' | 'lg';
+export type TCheckboxVariant = 'default' | 'undetermined';
+export interface IBaseCheckboxProps {
+    label: string;
+    checkboxSize?: TCheckboxSize;
+    checkboxVariant?: TCheckboxVariant;
+    isError?: boolean;
+    errorText?: string;
+    inverted?: boolean;
+}
+export type TCheckboxProps = IBaseCheckboxProps & InputHTMLAttributes<HTMLInputElement>;
+export declare const Checkbox: ({ label, checkboxSize, checkboxVariant, isError, errorText, inverted, disabled, checked, className, ...inputProps }: TCheckboxProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/Checkbox/Checkbox.es.js

@@ -0,0 +1,52 @@
+import { jsxs as l, jsx as r } from "react/jsx-runtime";
+import { Typography as t } from "../Typography/Typography.es.js";
+import u from "./assets/checkbox-checkmark.svg.es.js";
+import k from "./assets/checkbox-dash.svg.es.js";
+import N from "./assets/checkbox-error.svg.es.js";
+import { cn as m } from "../../utils/cn/cn.es.js";
+import e from "./checkbox.module.css.es.js";
+const T = ({
+  label: i,
+  checkboxSize: n = "lg",
+  checkboxVariant: h = "default",
+  isError: a = !1,
+  errorText: o,
+  inverted: b = !1,
+  disabled: c,
+  checked: s,
+  className: d,
+  ...f
+}) => {
+  const p = (x) => {
+    switch (x) {
+      case "default":
+        return /* @__PURE__ */ r(u, { className: e.icon });
+      case "undetermined":
+        return /* @__PURE__ */ r(k, { className: e.icon });
+    }
+  };
+  return /* @__PURE__ */ l(
+    "label",
+    {
+      className: m(
+        e.root,
+        b && e.inverted,
+        a && e.error,
+        c && e.disabled,
+        d
+      ),
+      children: [
+        /* @__PURE__ */ r("input", { ...f, type: "checkbox", disabled: c, checked: s, className: e.checkbox }),
+        /* @__PURE__ */ r("div", { className: m(e.visibleCustomCheckbox, e[n]), children: s && p(h) }),
+        /* @__PURE__ */ r(t, { defaultVariant: "labelSm", className: e.label, children: i }),
+        a && !!o && /* @__PURE__ */ l("div", { className: e.errorTextContainer, children: [
+          /* @__PURE__ */ r(N, { className: e.errorIcon }),
+          /* @__PURE__ */ r(t, { defaultVariant: "labelSm", className: e.errorText, children: o })
+        ] })
+      ]
+    }
+  );
+};
+export {
+  T as Checkbox
+};

package/dist/components/Checkbox/assets/checkbox-checkmark.svg.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("react");function l(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const o=l(c),a=e=>o.createElement("svg",{width:20,height:20,viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},o.createElement("path",{d:"M7.95836 14.7114L3.51294 10.266L4.40377 9.37499L7.95836 12.9296L15.5963 5.29166L16.4871 6.1827L7.95836 14.7114Z",fill:"currentColor"}));exports.default=a;

package/dist/components/Checkbox/assets/checkbox-checkmark.svg.es.js

@@ -0,0 +1,5 @@
+import * as e from "react";
+const o = (t) => /* @__PURE__ */ e.createElement("svg", { width: 20, height: 20, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ e.createElement("path", { d: "M7.95836 14.7114L3.51294 10.266L4.40377 9.37499L7.95836 12.9296L15.5963 5.29166L16.4871 6.1827L7.95836 14.7114Z", fill: "currentColor" }));
+export {
+  o as default
+};

package/dist/components/Checkbox/assets/checkbox-dash.svg.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("react");function l(e){const r=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:()=>e[t]})}}return r.default=e,Object.freeze(r)}const o=l(c),a=e=>o.createElement("svg",{width:20,height:20,viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},o.createElement("path",{d:"M4.58337 10.625V9.375H15.4167V10.625H4.58337Z",fill:"currentColor"}));exports.default=a;

package/dist/components/Checkbox/assets/checkbox-dash.svg.es.js

@@ -0,0 +1,5 @@
+import * as e from "react";
+const o = (t) => /* @__PURE__ */ e.createElement("svg", { width: 20, height: 20, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ e.createElement("path", { d: "M4.58337 10.625V9.375H15.4167V10.625H4.58337Z", fill: "currentColor" }));
+export {
+  o as default
+};

package/dist/components/Checkbox/assets/checkbox-error.svg.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react");function c(e){const C=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(C,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return C.default=e,Object.freeze(C)}const n=c(o),l=e=>n.createElement("svg",{width:14,height:14,viewBox:"0 0 14 14",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},n.createElement("path",{d:"M6.56242 9.77081H7.43742V6.41665H6.56242V9.77081ZM6.99992 5.41827C7.13341 5.41827 7.24531 5.37311 7.33563 5.28279C7.42595 5.19247 7.47111 5.08057 7.47111 4.94708C7.47111 4.8136 7.42595 4.7017 7.33563 4.61138C7.24531 4.52115 7.13341 4.47604 6.99992 4.47604C6.86643 4.47604 6.75453 4.52115 6.66421 4.61138C6.57389 4.7017 6.52873 4.8136 6.52873 4.94708C6.52873 5.08057 6.57389 5.19247 6.66421 5.28279C6.75453 5.37311 6.86643 5.41827 6.99992 5.41827ZM7.00094 12.5416C6.23444 12.5416 5.51397 12.3962 4.83954 12.1053C4.16511 11.8144 3.57847 11.4197 3.07963 10.921C2.58078 10.4223 2.18581 9.83595 1.89473 9.16181C1.60374 8.48767 1.45825 7.7674 1.45825 7.001C1.45825 6.2345 1.6037 5.51404 1.89459 4.8396C2.18547 4.16517 2.58025 3.57854 3.0789 3.07969C3.57755 2.58084 4.16395 2.18588 4.83809 1.89479C5.51222 1.60381 6.2325 1.45831 6.9989 1.45831C7.7654 1.45831 8.48586 1.60376 9.16029 1.89465C9.83473 2.18554 10.4214 2.58031 10.9202 3.07896C11.4191 3.57761 11.814 4.16401 12.1051 4.83815C12.3961 5.51229 12.5416 6.23256 12.5416 6.99896C12.5416 7.76546 12.3961 8.48593 12.1053 9.16036C11.8144 9.83479 11.4196 10.4214 10.9209 10.9203C10.4223 11.4191 9.83589 11.8141 9.16175 12.1052C8.48761 12.3962 7.76734 12.5416 7.00094 12.5416ZM6.99992 11.6666C8.3027 11.6666 9.40617 11.2146 10.3103 10.3104C11.2145 9.40623 11.6666 8.30276 11.6666 6.99998C11.6666 5.6972 11.2145 4.59373 10.3103 3.68956C9.40617 2.7854 8.3027 2.33331 6.99992 2.33331C5.69714 2.33331 4.59367 2.7854 3.6895 3.68956C2.78534 4.59373 2.33325 5.6972 2.33325 6.99998C2.33325 8.30276 2.78534 9.40623 3.6895 10.3104C4.59367 11.2146 5.69714 11.6666 6.99992 11.6666Z",fill:"#E4271D"}));exports.default=l;

package/dist/components/Checkbox/assets/checkbox-error.svg.es.js

@@ -0,0 +1,5 @@
+import * as C from "react";
+const t = (e) => /* @__PURE__ */ C.createElement("svg", { width: 14, height: 14, viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ C.createElement("path", { d: "M6.56242 9.77081H7.43742V6.41665H6.56242V9.77081ZM6.99992 5.41827C7.13341 5.41827 7.24531 5.37311 7.33563 5.28279C7.42595 5.19247 7.47111 5.08057 7.47111 4.94708C7.47111 4.8136 7.42595 4.7017 7.33563 4.61138C7.24531 4.52115 7.13341 4.47604 6.99992 4.47604C6.86643 4.47604 6.75453 4.52115 6.66421 4.61138C6.57389 4.7017 6.52873 4.8136 6.52873 4.94708C6.52873 5.08057 6.57389 5.19247 6.66421 5.28279C6.75453 5.37311 6.86643 5.41827 6.99992 5.41827ZM7.00094 12.5416C6.23444 12.5416 5.51397 12.3962 4.83954 12.1053C4.16511 11.8144 3.57847 11.4197 3.07963 10.921C2.58078 10.4223 2.18581 9.83595 1.89473 9.16181C1.60374 8.48767 1.45825 7.7674 1.45825 7.001C1.45825 6.2345 1.6037 5.51404 1.89459 4.8396C2.18547 4.16517 2.58025 3.57854 3.0789 3.07969C3.57755 2.58084 4.16395 2.18588 4.83809 1.89479C5.51222 1.60381 6.2325 1.45831 6.9989 1.45831C7.7654 1.45831 8.48586 1.60376 9.16029 1.89465C9.83473 2.18554 10.4214 2.58031 10.9202 3.07896C11.4191 3.57761 11.814 4.16401 12.1051 4.83815C12.3961 5.51229 12.5416 6.23256 12.5416 6.99896C12.5416 7.76546 12.3961 8.48593 12.1053 9.16036C11.8144 9.83479 11.4196 10.4214 10.9209 10.9203C10.4223 11.4191 9.83589 11.8141 9.16175 12.1052C8.48761 12.3962 7.76734 12.5416 7.00094 12.5416ZM6.99992 11.6666C8.3027 11.6666 9.40617 11.2146 10.3103 10.3104C11.2145 9.40623 11.6666 8.30276 11.6666 6.99998C11.6666 5.6972 11.2145 4.59373 10.3103 3.68956C9.40617 2.7854 8.3027 2.33331 6.99992 2.33331C5.69714 2.33331 4.59367 2.7854 3.6895 3.68956C2.78534 4.59373 2.33325 5.6972 2.33325 6.99998C2.33325 8.30276 2.78534 9.40623 3.6895 10.3104C4.59367 11.2146 5.69714 11.6666 6.99992 11.6666Z", fill: "#E4271D" }));
+export {
+  t as default
+};

package/dist/components/Checkbox/checkbox.module.css.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="checkbox-module__root___-FW3O",o="checkbox-module__label___dV34E",_="checkbox-module__checkbox___rLEgd",r="checkbox-module__visibleCustomCheckbox___Rdikp",c="checkbox-module__errorTextContainer___TVSHW",t="checkbox-module__errorIcon___2kQKN",l="checkbox-module__errorText___fFW4I",n="checkbox-module__icon___TK3cZ",s="checkbox-module__sm___U0iG8",b="checkbox-module__lg___5OYlk",d="checkbox-module__inverted___2LLia",i="checkbox-module__error___8ZS3-",x="checkbox-module__disabled___E2BaQ",k={root:e,label:o,checkbox:_,visibleCustomCheckbox:r,errorTextContainer:c,errorIcon:t,errorText:l,icon:n,sm:s,lg:b,inverted:d,error:i,disabled:x};exports.checkbox=_;exports.default=k;exports.disabled=x;exports.error=i;exports.errorIcon=t;exports.errorText=l;exports.errorTextContainer=c;exports.icon=n;exports.inverted=d;exports.label=o;exports.lg=b;exports.root=e;exports.sm=s;exports.visibleCustomCheckbox=r;

package/dist/components/Checkbox/checkbox.module.css.es.js

@@ -0,0 +1,31 @@
+const o = "checkbox-module__root___-FW3O", e = "checkbox-module__label___dV34E", _ = "checkbox-module__checkbox___rLEgd", c = "checkbox-module__visibleCustomCheckbox___Rdikp", r = "checkbox-module__errorTextContainer___TVSHW", t = "checkbox-module__errorIcon___2kQKN", l = "checkbox-module__errorText___fFW4I", n = "checkbox-module__icon___TK3cZ", s = "checkbox-module__sm___U0iG8", b = "checkbox-module__lg___5OYlk", d = "checkbox-module__inverted___2LLia", x = "checkbox-module__error___8ZS3-", k = "checkbox-module__disabled___E2BaQ", i = {
+  root: o,
+  label: e,
+  checkbox: _,
+  visibleCustomCheckbox: c,
+  errorTextContainer: r,
+  errorIcon: t,
+  errorText: l,
+  icon: n,
+  sm: s,
+  lg: b,
+  inverted: d,
+  error: x,
+  disabled: k
+};
+export {
+  _ as checkbox,
+  i as default,
+  k as disabled,
+  x as error,
+  t as errorIcon,
+  l as errorText,
+  r as errorTextContainer,
+  n as icon,
+  d as inverted,
+  e as label,
+  b as lg,
+  o as root,
+  s as sm,
+  c as visibleCustomCheckbox
+};

package/dist/components/Checkbox/index.d.ts

@@ -0,0 +1,2 @@
+export { Checkbox } from './Checkbox';
+export type { TCheckboxProps } from './Checkbox';

package/dist/components/ColoredDivider/ColoredDivider.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),n=require("../Typography/Typography.cjs.js"),i=require("../../utils/cn/cn.cjs.js"),r=require("./coloredDivider.module.css.cjs.js");var s=(e=>(e.SENESCENCE="senescence",e.GREY="grey",e.LABS="labs",e.ENERGY="energy",e.METABOLISM="metabolism",e))(s||{});const l=({label:e,variant:t})=>a.jsxs("div",{className:r.default.root,children:[a.jsxs(n.Typography,{as:"h3",defaultVariant:"headingLg",mobileVariant:"headingSm",className:r.default.label,children:["(",e,")"]}),a.jsx("div",{className:i.cn(r.default.divider,r.default[t])})]});exports.ColoredDivider=l;exports.TDividerColor=s;

package/dist/components/ColoredDivider/ColoredDivider.d.ts

@@ -0,0 +1,12 @@
+export declare enum TDividerColor {
+    SENESCENCE = "senescence",
+    GREY = "grey",
+    LABS = "labs",
+    ENERGY = "energy",
+    METABOLISM = "metabolism"
+}
+export type ColoredDividerProps = {
+    label: string;
+    variant: TDividerColor;
+};
+export declare const ColoredDivider: ({ label, variant }: ColoredDividerProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/ColoredDivider/ColoredDivider.es.js

@@ -0,0 +1,17 @@
+import { jsxs as r, jsx as m } from "react/jsx-runtime";
+import { Typography as t } from "../Typography/Typography.es.js";
+import { cn as n } from "../../utils/cn/cn.es.js";
+import a from "./coloredDivider.module.css.es.js";
+var i = /* @__PURE__ */ ((e) => (e.SENESCENCE = "senescence", e.GREY = "grey", e.LABS = "labs", e.ENERGY = "energy", e.METABOLISM = "metabolism", e))(i || {});
+const d = ({ label: e, variant: s }) => /* @__PURE__ */ r("div", { className: a.root, children: [
+  /* @__PURE__ */ r(t, { as: "h3", defaultVariant: "headingLg", mobileVariant: "headingSm", className: a.label, children: [
+    "(",
+    e,
+    ")"
+  ] }),
+  /* @__PURE__ */ m("div", { className: n(a.divider, a[s]) })
+] });
+export {
+  d as ColoredDivider,
+  i as TDividerColor
+};

package/dist/components/ColoredDivider/coloredDivider.module.css.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e="coloredDivider-module__root___OxIDb",o="coloredDivider-module__label___kfTPD",_="coloredDivider-module__divider___kLQsX",l="coloredDivider-module__grey___LW-4N",r="coloredDivider-module__senescence___lB0ja",d="coloredDivider-module__metabolism___Q9Img",s="coloredDivider-module__energy___sBKuD",i="coloredDivider-module__labs___eu4Qr",c={root:e,label:o,divider:_,grey:l,senescence:r,metabolism:d,energy:s,labs:i};exports.default=c;exports.divider=_;exports.energy=s;exports.grey=l;exports.label=o;exports.labs=i;exports.metabolism=d;exports.root=e;exports.senescence=r;

package/dist/components/ColoredDivider/coloredDivider.module.css.es.js

@@ -0,0 +1,21 @@
+const e = "coloredDivider-module__root___OxIDb", o = "coloredDivider-module__label___kfTPD", _ = "coloredDivider-module__divider___kLQsX", d = "coloredDivider-module__grey___LW-4N", l = "coloredDivider-module__senescence___lB0ja", r = "coloredDivider-module__metabolism___Q9Img", s = "coloredDivider-module__energy___sBKuD", i = "coloredDivider-module__labs___eu4Qr", c = {
+  root: e,
+  label: o,
+  divider: _,
+  grey: d,
+  senescence: l,
+  metabolism: r,
+  energy: s,
+  labs: i
+};
+export {
+  c as default,
+  _ as divider,
+  s as energy,
+  d as grey,
+  o as label,
+  i as labs,
+  r as metabolism,
+  e as root,
+  l as senescence
+};

package/dist/components/ColoredDivider/index.d.ts

@@ -0,0 +1 @@
+export { ColoredDivider } from './ColoredDivider';

package/dist/components/Tabs/Tabs.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),t=require("react"),f=require("../../utils/cn/cn.cjs.js"),i=require("../Icon/Icon.cjs.js"),n=require("./tabs.module.css.cjs.js");function m({activeTab:s,tabs:c,onTabClick:r,size:a="sm",activeLinePosition:d="bottom",inverted:o},u){return l.jsx("div",{ref:u,className:n.default.container,children:c.map(e=>l.jsxs("button",{className:f.cn(n.default.tab,n.default[a],{[n.default.inverted]:o,[n.default.activeTab]:s===e.value,[n.default.disabled]:e.disabled,[n.default.brackets]:a==="lg"&&s===e.value&&c.length>1},n.default[d],e.className),disabled:e.disabled,onClick:()=>r(e.value),children:[e.prefixIcon&&l.jsx("div",{className:n.default.iconWrap,children:l.jsx(i.Icon,{name:e.prefixIcon})}),l.jsx("div",{children:e.label}),e.suffixIcon&&l.jsx("div",{className:n.default.iconWrap,children:l.jsx(i.Icon,{name:e.suffixIcon})})]},String(e.value)))})}const x=t.forwardRef(m);exports.Tabs=x;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),t=require("react"),f=require("../../utils/cn/cn.cjs.js"),i=require("../Icon/Icon.cjs.js"),n=require("./tabs.module.css.cjs.js");function m({activeTab:c,tabs:l,onTabClick:r,size:a="sm",activeLinePosition:d="bottom",inverted:o},u){return s.jsx("div",{ref:u,className:n.default.container,children:l.map(e=>s.jsxs("button",{className:f.cn(n.default.tab,n.default[a],{[n.default.inverted]:o,[n.default.activeTab]:c===e.value,[n.default.disabled]:e.disabled,[n.default.brackets]:a!=="sm"&&c===e.value&&l.length>1},n.default[d],e.className),disabled:e.disabled,onClick:()=>r(e.value),children:[e.prefixIcon&&s.jsx("div",{className:n.default.iconWrap,children:s.jsx(i.Icon,{name:e.prefixIcon})}),s.jsx("div",{children:e.label}),e.suffixIcon&&s.jsx("div",{className:n.default.iconWrap,children:s.jsx(i.Icon,{name:e.suffixIcon})})]},String(e.value)))})}const x=t.forwardRef(m);exports.Tabs=x;

package/dist/components/Tabs/Tabs.d.ts

@@ -1,23 +1,6 @@
-import { ForwardedRef, ReactElement, ReactNode } from 'react';
-import { EIconName } from '../Icon';
+import { ForwardedRef, ReactElement } from 'react';
+import { TTabs } from './types';
 
-export type Tab<T extends string | number> = {
-    value: T;
-    label: ReactNode;
-    disabled?: boolean;
-    className?: string;
-    prefixIcon?: EIconName;
-    suffixIcon?: EIconName;
-};
-type Props<T extends string | number> = {
-    activeTab: T;
-    tabs: ReadonlyArray<Tab<T>>;
-    size?: 'sm' | 'lg';
-    activeLinePosition?: 'top' | 'bottom';
-    inverted?: boolean;
-    onTabClick: (value: T) => void;
-};
-export declare const Tabs: <T extends string | number>(props: Props<T> & {
+export declare const Tabs: <T extends string | number>(props: TTabs<T> & {
     ref?: ForwardedRef<HTMLDivElement>;
 }) => ReactElement;
-export {};

package/dist/components/Tabs/Tabs.es.js

@@ -1,30 +1,30 @@
 import { jsx as n, jsxs as f } from "react/jsx-runtime";
 import { forwardRef as p } from "react";
 import { cn as t } from "../../utils/cn/cn.es.js";
-import { Icon as s } from "../Icon/Icon.es.js";
+import { Icon as c } from "../Icon/Icon.es.js";
 import i from "./tabs.module.css.es.js";
-function u({ activeTab: o, tabs: r, onTabClick: c, size: l = "sm", activeLinePosition: m = "bottom", inverted: d }, a) {
+function u({ activeTab: o, tabs: r, onTabClick: l, size: s = "sm", activeLinePosition: m = "bottom", inverted: d }, a) {
   return /* @__PURE__ */ n("div", { ref: a, className: i.container, children: r.map((e) => /* @__PURE__ */ f(
     "button",
     {
       className: t(
         i.tab,
-        i[l],
+        i[s],
         {
           [i.inverted]: d,
           [i.activeTab]: o === e.value,
           [i.disabled]: e.disabled,
-          [i.brackets]: l === "lg" && o === e.value && r.length > 1
+          [i.brackets]: s !== "sm" && o === e.value && r.length > 1
         },
         i[m],
         e.className
       ),
       disabled: e.disabled,
-      onClick: () => c(e.value),
+      onClick: () => l(e.value),
       children: [
-        e.prefixIcon && /* @__PURE__ */ n("div", { className: i.iconWrap, children: /* @__PURE__ */ n(s, { name: e.prefixIcon }) }),
+        e.prefixIcon && /* @__PURE__ */ n("div", { className: i.iconWrap, children: /* @__PURE__ */ n(c, { name: e.prefixIcon }) }),
         /* @__PURE__ */ n("div", { children: e.label }),
-        e.suffixIcon && /* @__PURE__ */ n("div", { className: i.iconWrap, children: /* @__PURE__ */ n(s, { name: e.suffixIcon }) })
+        e.suffixIcon && /* @__PURE__ */ n("div", { className: i.iconWrap, children: /* @__PURE__ */ n(c, { name: e.suffixIcon }) })
       ]
     },
     String(e.value)

package/dist/components/Tabs/TabsWithFade.cjs.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),s=require("react"),h=require("../../utils/cn/cn.cjs.js"),b=require("./Tabs.cjs.js"),r=require("./tabs.module.css.cjs.js");function v({tabs:o,activeTab:c,onTabChange:a}){const n=s.useRef(null),[l,u]=s.useState(!1),[d,f]=s.useState(!1),t=s.useCallback(()=>{const e=n.current;e&&(u(e.scrollLeft>0),f(e.scrollLeft+e.clientWidth<e.scrollWidth))},[]);return s.useEffect(()=>{const e=n.current;if(e)return t(),e.addEventListener("scroll",t),window.addEventListener("resize",t),()=>{e.removeEventListener("scroll",t),window.removeEventListener("resize",t)}},[t]),i.jsx("div",{className:h.cn(r.default.tabsWrapper,{[r.default.showFadeLeft]:l,[r.default.showFadeRight]:d}),children:i.jsx("div",{ref:n,className:r.default.tabsTape,children:i.jsx(b.Tabs,{activeTab:c,tabs:o,size:"lg",activeLinePosition:"bottom",onTabClick:a})})})}exports.TabsWithFade=v;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),s=require("react"),d=require("../../utils/cn/cn.cjs.js"),f=require("./Tabs.cjs.js"),r=require("./tabs.module.css.cjs.js");function h(a){const n=s.useRef(null),[l,o]=s.useState(!1),[i,u]=s.useState(!1),t=s.useCallback(()=>{const e=n.current;e&&(o(e.scrollLeft>0),u(e.scrollLeft+e.clientWidth<e.scrollWidth))},[]);return s.useEffect(()=>{const e=n.current;if(e)return t(),e.addEventListener("scroll",t),window.addEventListener("resize",t),()=>{e.removeEventListener("scroll",t),window.removeEventListener("resize",t)}},[t]),c.jsx("div",{className:d.cn(r.default.tabsWrapper,{[r.default.showFadeLeft]:l,[r.default.showFadeRight]:i}),children:c.jsx("div",{ref:n,className:r.default.tabsTape,children:c.jsx(f.Tabs,{...a})})})}exports.TabsWithFade=h;

package/dist/components/Tabs/TabsWithFade.d.ts

@@ -1,9 +1,3 @@
-import { Tab } from './Tabs';
+import { TTabs } from './types';
 
-type Props<T extends string | number> = {
-    tabs: Tab<T>[];
-    activeTab: T;
-    onTabChange: (tab: T) => void;
-};
-export declare function TabsWithFade<T extends string>({ tabs, activeTab, onTabChange }: Props<T>): import("react/jsx-runtime").JSX.Element;
-export {};
+export declare function TabsWithFade<T extends string>(tabsProps: TTabs<T>): import("react/jsx-runtime").JSX.Element;

package/dist/components/Tabs/TabsWithFade.es.js

@@ -1,15 +1,15 @@
 "use client";
 import { jsx as o } from "react/jsx-runtime";
-import { useRef as m, useState as i, useCallback as u, useEffect as p } from "react";
-import { cn as w } from "../../utils/cn/cn.es.js";
-import { Tabs as L } from "./Tabs.es.js";
+import { useRef as d, useState as n, useCallback as h, useEffect as m } from "react";
+import { cn as u } from "../../utils/cn/cn.es.js";
+import { Tabs as p } from "./Tabs.es.js";
 import r from "./tabs.module.css.es.js";
-function g({ tabs: n, activeTab: l, onTabChange: c }) {
-  const s = m(null), [a, f] = i(!1), [d, h] = i(!1), t = u(() => {
+function R(i) {
+  const s = d(null), [l, c] = n(!1), [a, f] = n(!1), t = h(() => {
     const e = s.current;
-    e && (f(e.scrollLeft > 0), h(e.scrollLeft + e.clientWidth < e.scrollWidth));
+    e && (c(e.scrollLeft > 0), f(e.scrollLeft + e.clientWidth < e.scrollWidth));
   }, []);
-  return p(() => {
+  return m(() => {
     const e = s.current;
     if (e)
       return t(), e.addEventListener("scroll", t), window.addEventListener("resize", t), () => {
@@ -18,23 +18,14 @@ function g({ tabs: n, activeTab: l, onTabChange: c }) {
   }, [t]), /* @__PURE__ */ o(
     "div",
     {
-      className: w(r.tabsWrapper, {
-        [r.showFadeLeft]: a,
-        [r.showFadeRight]: d
+      className: u(r.tabsWrapper, {
+        [r.showFadeLeft]: l,
+        [r.showFadeRight]: a
       }),
-      children: /* @__PURE__ */ o("div", { ref: s, className: r.tabsTape, children: /* @__PURE__ */ o(
-        L,
-        {
-          activeTab: l,
-          tabs: n,
-          size: "lg",
-          activeLinePosition: "bottom",
-          onTabClick: c
-        }
-      ) })
+      children: /* @__PURE__ */ o("div", { ref: s, className: r.tabsTape, children: /* @__PURE__ */ o(p, { ...i }) })
     }
   );
 }
 export {
-  g as TabsWithFade
+  R as TabsWithFade
 };

package/dist/components/Tabs/index.d.ts

@@ -1,3 +1,3 @@
 export { Tabs } from './Tabs';
 export { TabsWithFade } from './TabsWithFade';
-export type { Tab } from './Tabs';
+export type { TTab } from './types';

package/dist/components/Tabs/tabs.module.css.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t="tabs-module__container___NRX40",e="tabs-module__tab___McM3m",_="tabs-module__sm___m4fiR",a="tabs-module__lg___SVeHo",o="tabs-module__inverted___CBzom",s="tabs-module__disabled___AXCIC",b="tabs-module__bottom___Ho7ee",d="tabs-module__top___jthT8",c="tabs-module__activeTab___MHq7V",n="tabs-module__brackets___37Jhe",l="tabs-module__iconWrap___RY5wP",r="tabs-module__tabsTape___wsU1y",i="tabs-module__tabsWrapper___MLrX-",m="tabs-module__showFadeLeft___GGn8-",u="tabs-module__showFadeRight___a90mU",p={container:t,tab:e,sm:_,lg:a,inverted:o,disabled:s,bottom:b,top:d,activeTab:c,brackets:n,iconWrap:l,tabsTape:r,tabsWrapper:i,showFadeLeft:m,showFadeRight:u};exports.activeTab=c;exports.bottom=b;exports.brackets=n;exports.container=t;exports.default=p;exports.disabled=s;exports.iconWrap=l;exports.inverted=o;exports.lg=a;exports.showFadeLeft=m;exports.showFadeRight=u;exports.sm=_;exports.tab=e;exports.tabsTape=r;exports.tabsWrapper=i;exports.top=d;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t="tabs-module__container___NRX40",_="tabs-module__tab___McM3m",e="tabs-module__sm___m4fiR",a="tabs-module__md___Va2xk",o="tabs-module__lg___SVeHo",s="tabs-module__inverted___CBzom",b="tabs-module__disabled___AXCIC",d="tabs-module__bottom___Ho7ee",c="tabs-module__top___jthT8",n="tabs-module__activeTab___MHq7V",m="tabs-module__brackets___37Jhe",l="tabs-module__iconWrap___RY5wP",r="tabs-module__tabsTape___wsU1y",i="tabs-module__tabsWrapper___MLrX-",u="tabs-module__showFadeLeft___GGn8-",p="tabs-module__showFadeRight___a90mU",h={container:t,tab:_,sm:e,md:a,lg:o,inverted:s,disabled:b,bottom:d,top:c,activeTab:n,brackets:m,iconWrap:l,tabsTape:r,tabsWrapper:i,showFadeLeft:u,showFadeRight:p};exports.activeTab=n;exports.bottom=d;exports.brackets=m;exports.container=t;exports.default=h;exports.disabled=b;exports.iconWrap=l;exports.inverted=s;exports.lg=o;exports.md=a;exports.showFadeLeft=u;exports.showFadeRight=p;exports.sm=e;exports.tab=_;exports.tabsTape=r;exports.tabsWrapper=i;exports.top=c;

package/dist/components/Tabs/tabs.module.css.es.js

@@ -1,35 +1,37 @@
-const _ = "tabs-module__container___NRX40", t = "tabs-module__tab___McM3m", a = "tabs-module__sm___m4fiR", o = "tabs-module__lg___SVeHo", s = "tabs-module__inverted___CBzom", e = "tabs-module__disabled___AXCIC", b = "tabs-module__bottom___Ho7ee", d = "tabs-module__top___jthT8", c = "tabs-module__activeTab___MHq7V", n = "tabs-module__brackets___37Jhe", m = "tabs-module__iconWrap___RY5wP", l = "tabs-module__tabsTape___wsU1y", r = "tabs-module__tabsWrapper___MLrX-", i = "tabs-module__showFadeLeft___GGn8-", p = "tabs-module__showFadeRight___a90mU", u = {
+const _ = "tabs-module__container___NRX40", t = "tabs-module__tab___McM3m", a = "tabs-module__sm___m4fiR", o = "tabs-module__md___Va2xk", s = "tabs-module__lg___SVeHo", e = "tabs-module__inverted___CBzom", b = "tabs-module__disabled___AXCIC", d = "tabs-module__bottom___Ho7ee", c = "tabs-module__top___jthT8", n = "tabs-module__activeTab___MHq7V", m = "tabs-module__brackets___37Jhe", l = "tabs-module__iconWrap___RY5wP", r = "tabs-module__tabsTape___wsU1y", i = "tabs-module__tabsWrapper___MLrX-", u = "tabs-module__showFadeLeft___GGn8-", p = "tabs-module__showFadeRight___a90mU", h = {
   container: _,
   tab: t,
   sm: a,
-  lg: o,
-  inverted: s,
-  disabled: e,
-  bottom: b,
-  top: d,
-  activeTab: c,
-  brackets: n,
-  iconWrap: m,
-  tabsTape: l,
-  tabsWrapper: r,
-  showFadeLeft: i,
+  md: o,
+  lg: s,
+  inverted: e,
+  disabled: b,
+  bottom: d,
+  top: c,
+  activeTab: n,
+  brackets: m,
+  iconWrap: l,
+  tabsTape: r,
+  tabsWrapper: i,
+  showFadeLeft: u,
   showFadeRight: p
 };
 export {
-  c as activeTab,
-  b as bottom,
-  n as brackets,
+  n as activeTab,
+  d as bottom,
+  m as brackets,
   _ as container,
-  u as default,
-  e as disabled,
-  m as iconWrap,
-  s as inverted,
-  o as lg,
-  i as showFadeLeft,
+  h as default,
+  b as disabled,
+  l as iconWrap,
+  e as inverted,
+  s as lg,
+  o as md,
+  u as showFadeLeft,
   p as showFadeRight,
   a as sm,
   t as tab,
-  l as tabsTape,
-  r as tabsWrapper,
-  d as top
+  r as tabsTape,
+  i as tabsWrapper,
+  c as top
 };

package/dist/components/Tabs/types.d.ts

@@ -0,0 +1,19 @@
+import { ReactNode } from 'react';
+import { EIconName } from '../Icon';
+
+export type TTab<T extends string | number> = {
+    value: T;
+    label: ReactNode;
+    disabled?: boolean;
+    className?: string;
+    prefixIcon?: EIconName;
+    suffixIcon?: EIconName;
+};
+export type TTabs<T extends string | number> = {
+    activeTab: T;
+    tabs: ReadonlyArray<TTab<T>>;
+    size?: 'sm' | 'md' | 'lg';
+    activeLinePosition?: 'top' | 'bottom';
+    inverted?: boolean;
+    onTabClick: (value: T) => void;
+};