@dgshahr/ui-kit 0.0.5 → 0.0.7

package/dist/clsx-C11secjj.cjs

@@ -0,0 +1 @@
+"use strict";function i(r){var f,n,t="";if(typeof r=="string"||typeof r=="number")t+=r;else if(typeof r=="object")if(Array.isArray(r)){var s=r.length;for(f=0;f<s;f++)r[f]&&(n=i(r[f]))&&(t&&(t+=" "),t+=n)}else for(n in r)r[n]&&(t&&(t+=" "),t+=n);return t}function o(){for(var r,f,n=0,t="",s=arguments.length;n<s;n++)(r=arguments[n])&&(f=i(r))&&(t&&(t+=" "),t+=f);return t}exports.clsx=o;

package/dist/clsx-OuTLNxxd.js

@@ -0,0 +1,16 @@
+function a(r) {
+  var f, n, t = "";
+  if (typeof r == "string" || typeof r == "number") t += r;
+  else if (typeof r == "object") if (Array.isArray(r)) {
+    var o = r.length;
+    for (f = 0; f < o; f++) r[f] && (n = a(r[f])) && (t && (t += " "), t += n);
+  } else for (n in r) r[n] && (t && (t += " "), t += n);
+  return t;
+}
+function i() {
+  for (var r, f, n = 0, t = "", o = arguments.length; n < o; n++) (r = arguments[n]) && (f = a(r)) && (t && (t += " "), t += f);
+  return t;
+}
+export {
+  i as c
+};

package/dist/index.cjs

@@ -1,34 +1 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-require('./assets/styles.css');;/* empty css                  */
-const AccordionItem = require('./AccordionItem-lq6ehxKe.cjs');
-const Alert = require('./Alert/index.cjs');
-const Badge = require('./Badge/index.cjs');
-const Breadcrumb = require('./Breadcrumb/index.cjs');
-const Button = require('./Button/index.cjs');
-const Divider = require('./Divider/index.cjs');
-const Form_Checkbox = require('./Form/Checkbox/index.cjs');
-const Form_Input = require('./Form/Input/index.cjs');
-const Form_RadioButton = require('./Form/RadioButton/index.cjs');
-const Form_Textarea = require('./Form/Textarea/index.cjs');
-const Pagination = require('./Pagination/index.cjs');
-const Slide = require('./Slide-Q5_7SCZR.cjs');
-
-
-
-exports.AccordionGroup = AccordionItem.AccordionGroup;
-exports.AccordionItem = AccordionItem.AccordionItem;
-exports.Alert = Alert;
-exports.Badge = Badge;
-exports.Breadcrumb = Breadcrumb;
-exports.Button = Button;
-exports.Divider = Divider;
-exports.Checkbox = Form_Checkbox;
-exports.Input = Form_Input;
-exports.RadioButton = Form_RadioButton;
-exports.Textarea = Form_Textarea;
-exports.Pagination = Pagination;
-exports.Slide = Slide.Slide;
-exports.Slider = Slide.Slider;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./assets/styles.css');;/* empty css                  */const e=require("./AccordionItem-eMnIUJ1V.cjs"),o=require("./Alert/index.cjs"),t=require("./Badge/index.cjs"),i=require("./Breadcrumb/index.cjs"),n=require("./Button/index.cjs"),c=require("./Divider/index.cjs"),u=require("./Form/Checkbox/index.cjs"),d=require("./Form/Input/index.cjs"),a=require("./Form/RadioButton/index.cjs"),s=require("./Form/Textarea/index.cjs"),q=require("./Pagination/index.cjs"),r=require("./Slide-Zmb0vKbn.cjs");exports.AccordionGroup=e.AccordionGroup;exports.AccordionItem=e.AccordionItem;exports.Alert=o;exports.Badge=t;exports.Breadcrumb=i;exports.Button=n;exports.Divider=c;exports.Checkbox=u;exports.Input=d;exports.RadioButton=a;exports.Textarea=s;exports.Pagination=q;exports.Slide=r.Slide;exports.Slider=r.Slider;

package/dist/index.js

@@ -1,13 +1,29 @@
 import './assets/styles.css';/* empty css                */
-export { A as AccordionGroup, a as AccordionItem } from './AccordionItem-DN7bi5kw.js';
-export { default as Alert } from './Alert/index.js';
-export { default as Badge } from './Badge/index.js';
-export { default as Breadcrumb } from './Breadcrumb/index.js';
-export { default as Button } from './Button/index.js';
-export { default as Divider } from './Divider/index.js';
-export { default as Checkbox } from './Form/Checkbox/index.js';
-export { default as Input } from './Form/Input/index.js';
-export { default as RadioButton } from './Form/RadioButton/index.js';
-export { default as Textarea } from './Form/Textarea/index.js';
-export { default as Pagination } from './Pagination/index.js';
-export { a as Slide, S as Slider } from './Slide-BDD1_RXD.js';
+import { A as e, a as t } from "./AccordionItem-tKSPLNKs.js";
+import { default as d } from "./Alert/index.js";
+import { default as p } from "./Badge/index.js";
+import { default as s } from "./Breadcrumb/index.js";
+import { default as l } from "./Button/index.js";
+import { default as n } from "./Divider/index.js";
+import { default as A } from "./Form/Checkbox/index.js";
+import { default as S } from "./Form/Input/index.js";
+import { default as g } from "./Form/RadioButton/index.js";
+import { default as h } from "./Form/Textarea/index.js";
+import { default as v } from "./Pagination/index.js";
+import { a as D, S as G } from "./Slide-C506y48c.js";
+export {
+  e as AccordionGroup,
+  t as AccordionItem,
+  d as Alert,
+  p as Badge,
+  s as Breadcrumb,
+  l as Button,
+  A as Checkbox,
+  n as Divider,
+  S as Input,
+  v as Pagination,
+  g as RadioButton,
+  D as Slide,
+  G as Slider,
+  h as Textarea
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dgshahr/ui-kit",
-  "version": "0.0.5",
+  "version": "0.0.7",
   "description": "dgshahr ui-kit",
   "author": "dgshahr",
   "license": "MIT",
@@ -151,9 +151,10 @@
   },
   "scripts": {
     "dev": "storybook dev -p 6006",
-    "build": "tsc && vite build && node scripts/generate-exports.js",
+    "build": "rm -rf dist && tsc && vite build && node scripts/generate-exports.js",
     "build:story": "storybook build",
-    "lint": "eslint --fix src/**/* --report-unused-disable-directives --max-warnings 0 -f codeframe",
+    "start:story": "npx http-server storybook-static",
+    "lint": "eslint --fix src/**/* --report-unused-disable-directives --max-warnings 0 --no-warn-ignored -f codeframe",
     "format": "prettier src/**/* --write --ignore-unknown",
     "prepublishOnly": "npm run build",
     "prepare": "husky",
@@ -217,4 +218,4 @@
       "yarn format"
     ]
   }
-}
+}

package/dist/AccordionItem-DN7bi5kw.js

@@ -1,103 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { c as clsx } from './clsx-ChV9xqsO.js';
-import { createContext, useContext, useState, useId } from 'react';
-import Divider from './Divider/index.js';
-
-const accordionContext = createContext({
-  activeKey: null,
-  setActiveKey: () => {
-  }
-});
-const useAccordionData = () => useContext(accordionContext);
-
-const AccordionGroup = (props) => {
-  const { defaultActiveKey = null, className, children } = props;
-  const [activeKey, setActiveKey] = useState(defaultActiveKey);
-  return /* @__PURE__ */ jsx("div", { className: clsx("flex flex-col", className), children: /* @__PURE__ */ jsx(
-    accordionContext.Provider,
-    {
-      value: {
-        activeKey,
-        setActiveKey
-      },
-      children
-    }
-  ) });
-};
-
-const ArrowDown2Icon = (props) => /* @__PURE__ */ jsx(
-  "svg",
-  {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "1em",
-    height: "1em",
-    fill: "none",
-    viewBox: "0 0 24 24",
-    ...props,
-    children: /* @__PURE__ */ jsx(
-      "path",
-      {
-        fill: "currentColor",
-        d: "M4.47 7.97a.75.75 0 0 1 .976-.073l.084.073L12 14.439l6.47-6.47a.75.75 0 0 1 .976-.072l.084.073a.75.75 0 0 1 .073.976l-.073.084-7 7a.75.75 0 0 1-.976.073l-.084-.073-7-7a.75.75 0 0 1 0-1.06"
-      }
-    )
-  }
-);
-
-const AccordionItem = (props) => {
-  const { children, title, accordionKey, className, contentClassName } = props;
-  const { activeKey, setActiveKey } = useAccordionData();
-  const reactUseId = useId();
-  const accordionItemKey = accordionKey ?? reactUseId;
-  const isItemActive = accordionItemKey === activeKey;
-  return /* @__PURE__ */ jsxs("div", { className: clsx("bg-white px-4 pt-4", className), children: [
-    /* @__PURE__ */ jsxs(
-      "button",
-      {
-        className: clsx(
-          "flex justify-between items-center w-full",
-          isItemActive ? "text-primary-500" : "text-gray-600"
-        ),
-        onClick: () => {
-          if (isItemActive) setActiveKey(null);
-          else setActiveKey(accordionItemKey);
-        },
-        children: [
-          /* @__PURE__ */ jsx("div", { className: isItemActive ? "font-h5-bold" : "font-p1-medium", children: title }),
-          /* @__PURE__ */ jsx(
-            ArrowDown2Icon,
-            {
-              className: clsx(
-                "transition duration-300 ease-in-out shrink-0 w-auto h-auto",
-                isItemActive && "rotate-180"
-              ),
-              width: 20,
-              height: 20
-            }
-          )
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: clsx(
-          "grid font-p1-regular text-gray-600 overflow-hidden transition-all duration-300 ease-in-out",
-          isItemActive ? "grid-rows-[1fr] opacity-100 mt-3" : "grid-rows-[0fr] opacity-0",
-          contentClassName
-        ),
-        children: /* @__PURE__ */ jsx("div", { className: "overflow-hidden", children })
-      }
-    ),
-    /* @__PURE__ */ jsx(
-      Divider,
-      {
-        type: "horizontal",
-        color: "white",
-        className: "mt-4"
-      }
-    )
-  ] });
-};
-
-export { AccordionGroup as A, AccordionItem as a };

package/dist/AccordionItem-lq6ehxKe.cjs

@@ -1,106 +0,0 @@
-'use strict';
-
-const jsxRuntime = require('react/jsx-runtime');
-const clsx = require('./clsx-BtxeOLZW.cjs');
-const react = require('react');
-const Divider = require('./Divider/index.cjs');
-
-const accordionContext = react.createContext({
-  activeKey: null,
-  setActiveKey: () => {
-  }
-});
-const useAccordionData = () => react.useContext(accordionContext);
-
-const AccordionGroup = (props) => {
-  const { defaultActiveKey = null, className, children } = props;
-  const [activeKey, setActiveKey] = react.useState(defaultActiveKey);
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx.clsx("flex flex-col", className), children: /* @__PURE__ */ jsxRuntime.jsx(
-    accordionContext.Provider,
-    {
-      value: {
-        activeKey,
-        setActiveKey
-      },
-      children
-    }
-  ) });
-};
-
-const ArrowDown2Icon = (props) => /* @__PURE__ */ jsxRuntime.jsx(
-  "svg",
-  {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "1em",
-    height: "1em",
-    fill: "none",
-    viewBox: "0 0 24 24",
-    ...props,
-    children: /* @__PURE__ */ jsxRuntime.jsx(
-      "path",
-      {
-        fill: "currentColor",
-        d: "M4.47 7.97a.75.75 0 0 1 .976-.073l.084.073L12 14.439l6.47-6.47a.75.75 0 0 1 .976-.072l.084.073a.75.75 0 0 1 .073.976l-.073.084-7 7a.75.75 0 0 1-.976.073l-.084-.073-7-7a.75.75 0 0 1 0-1.06"
-      }
-    )
-  }
-);
-
-const AccordionItem = (props) => {
-  const { children, title, accordionKey, className, contentClassName } = props;
-  const { activeKey, setActiveKey } = useAccordionData();
-  const reactUseId = react.useId();
-  const accordionItemKey = accordionKey ?? reactUseId;
-  const isItemActive = accordionItemKey === activeKey;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: clsx.clsx("bg-white px-4 pt-4", className), children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "button",
-      {
-        className: clsx.clsx(
-          "flex justify-between items-center w-full",
-          isItemActive ? "text-primary-500" : "text-gray-600"
-        ),
-        onClick: () => {
-          if (isItemActive) setActiveKey(null);
-          else setActiveKey(accordionItemKey);
-        },
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: isItemActive ? "font-h5-bold" : "font-p1-medium", children: title }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            ArrowDown2Icon,
-            {
-              className: clsx.clsx(
-                "transition duration-300 ease-in-out shrink-0 w-auto h-auto",
-                isItemActive && "rotate-180"
-              ),
-              width: 20,
-              height: 20
-            }
-          )
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        className: clsx.clsx(
-          "grid font-p1-regular text-gray-600 overflow-hidden transition-all duration-300 ease-in-out",
-          isItemActive ? "grid-rows-[1fr] opacity-100 mt-3" : "grid-rows-[0fr] opacity-0",
-          contentClassName
-        ),
-        children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-hidden", children })
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      Divider,
-      {
-        type: "horizontal",
-        color: "white",
-        className: "mt-4"
-      }
-    )
-  ] });
-};
-
-exports.AccordionGroup = AccordionGroup;
-exports.AccordionItem = AccordionItem;

package/dist/ArrowLeft2-iZ0Au6Fn.cjs

@@ -1,24 +0,0 @@
-'use strict';
-
-const jsxRuntime = require('react/jsx-runtime');
-
-const ArrowLeft2Icon = (props) => /* @__PURE__ */ jsxRuntime.jsx(
-  "svg",
-  {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "1em",
-    height: "1em",
-    fill: "none",
-    viewBox: "0 0 24 24",
-    ...props,
-    children: /* @__PURE__ */ jsxRuntime.jsx(
-      "path",
-      {
-        fill: "currentColor",
-        d: "M16.28 4.47a.75.75 0 0 1 .073.976l-.073.084L9.811 12l6.47 6.47a.75.75 0 0 1 .072.976l-.073.084a.75.75 0 0 1-.976.073l-.084-.073-7-7a.75.75 0 0 1-.073-.976l.073-.084 7-7a.75.75 0 0 1 1.06 0"
-      }
-    )
-  }
-);
-
-exports.ArrowLeft2Icon = ArrowLeft2Icon;

package/dist/ArrowRight2-DTuru_sP.cjs

@@ -1,27 +0,0 @@
-'use strict';
-
-const jsxRuntime = require('react/jsx-runtime');
-
-const ArrowRight2Icon = (props) => /* @__PURE__ */ jsxRuntime.jsx(
-  "svg",
-  {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "1em",
-    height: "1em",
-    fill: "none",
-    viewBox: "0 0 24 24",
-    ...props,
-    children: /* @__PURE__ */ jsxRuntime.jsx(
-      "path",
-      {
-        stroke: "currentColor",
-        strokeLinecap: "round",
-        strokeLinejoin: "round",
-        strokeWidth: 1.5,
-        d: "m8.5 5 7 7-7 7"
-      }
-    )
-  }
-);
-
-exports.ArrowRight2Icon = ArrowRight2Icon;

package/dist/SelectableInputWrapper-D2aYQb9J.cjs

@@ -1,71 +0,0 @@
-'use strict';
-
-require('./assets/styles.css');const jsxRuntime = require('react/jsx-runtime');
-const clsx = require('./clsx-BtxeOLZW.cjs');
-;/* empty css                  */
-
-const SelectableInputWrapper = (props) => {
-  const {
-    children,
-    containerClassName,
-    errorMessage,
-    helperMessage,
-    isError,
-    label,
-    variant = "default"
-  } = props;
-  const icon = props.icon;
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "label",
-    {
-      className: clsx.clsx(
-        "flex w-fit justify-between items-center group has-[:disabled]:opacity-40 has-[:disabled]:cursor-not-allowed transition",
-        {
-          "p-3 border w-full border-solid rounded-xl bg-white has-[:checked]:bg-primary-50": variant === "bordered",
-          "has-[:checked]:border-primary-500 border-gray-200 hover:ring-4 hover:ring-gray-100 has-[:focus]:ring has-[:focus]:ring-primary-300 has-[:focus]:ring-offset-1 has-[:focus]:ring-offset-white": variant === "bordered" && !isError,
-          "border-error-500 hover:ring-4 hover:ring-error-50 has-[:focus]:ring has-[:focus]:ring-error-300 has-[:focus]:ring-offset-1 has-[:focus]:ring-offset-white": variant === "bordered" && isError
-        },
-        containerClassName
-      ),
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(
-          "div",
-          {
-            className: clsx.clsx(
-              "flex space-x-2 space-x-reverse",
-              errorMessage ?? helperMessage ? "items-start" : "items-center"
-            ),
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx.clsx("relative h-[18px] w-[18px]", { "mt-1": label }), children: children({
-                inputClassName: clsx.clsx(
-                  "peer w-full h-full disabled:bg-gray-200 appearance-none border border-gray-300 group-hover:border-primary-500 checked:bg-primary-500 checked:border-transparent transition-all",
-                  {
-                    "group-hover:ring-4 group-hover:ring-gray-100 focus:!ring focus:!ring-primary-300 focus:ring-offset-1 focus:ring-offset-white": variant !== "bordered" && !isError,
-                    "!border-error-500 group-hover:ring-4 group-hover:ring-error-50 focus:!ring focus:!ring-error-300 focus:ring-offset-1 focus:ring-offset-white": variant !== "bordered" && isError
-                  }
-                ),
-                checkedInputClassName: "absolute top-0 left-0 w-full h-full flex items-center justify-center text-white opacity-0 peer-checked:opacity-100 transition-opacity"
-              }) }),
-              Boolean(label) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-1", children: [
-                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-p2-medium text-gray-700 transition group-hover:text-primary-500", children: label }),
-                Boolean(errorMessage ?? helperMessage) && /* @__PURE__ */ jsxRuntime.jsx(
-                  "div",
-                  {
-                    className: clsx.clsx(
-                      "font-p3-regular",
-                      errorMessage && isError ? "text-error-500" : "text-gray-500"
-                    ),
-                    children: isError && errorMessage ? errorMessage : helperMessage
-                  }
-                )
-              ] })
-            ]
-          }
-        ),
-        variant === "bordered" && icon ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-gray-600 group-hover:text-primary-500 group-checked:text-primary-500", children: icon }) : null
-      ]
-    }
-  );
-};
-
-exports.SelectableInputWrapper = SelectableInputWrapper;

package/dist/SelectableInputWrapper-DAj8v1nv.js

@@ -1,69 +0,0 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { c as clsx } from './clsx-ChV9xqsO.js';
-import './assets/styles.css';/* empty css                */
-
-const SelectableInputWrapper = (props) => {
-  const {
-    children,
-    containerClassName,
-    errorMessage,
-    helperMessage,
-    isError,
-    label,
-    variant = "default"
-  } = props;
-  const icon = props.icon;
-  return /* @__PURE__ */ jsxs(
-    "label",
-    {
-      className: clsx(
-        "flex w-fit justify-between items-center group has-[:disabled]:opacity-40 has-[:disabled]:cursor-not-allowed transition",
-        {
-          "p-3 border w-full border-solid rounded-xl bg-white has-[:checked]:bg-primary-50": variant === "bordered",
-          "has-[:checked]:border-primary-500 border-gray-200 hover:ring-4 hover:ring-gray-100 has-[:focus]:ring has-[:focus]:ring-primary-300 has-[:focus]:ring-offset-1 has-[:focus]:ring-offset-white": variant === "bordered" && !isError,
-          "border-error-500 hover:ring-4 hover:ring-error-50 has-[:focus]:ring has-[:focus]:ring-error-300 has-[:focus]:ring-offset-1 has-[:focus]:ring-offset-white": variant === "bordered" && isError
-        },
-        containerClassName
-      ),
-      children: [
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            className: clsx(
-              "flex space-x-2 space-x-reverse",
-              errorMessage ?? helperMessage ? "items-start" : "items-center"
-            ),
-            children: [
-              /* @__PURE__ */ jsx("div", { className: clsx("relative h-[18px] w-[18px]", { "mt-1": label }), children: children({
-                inputClassName: clsx(
-                  "peer w-full h-full disabled:bg-gray-200 appearance-none border border-gray-300 group-hover:border-primary-500 checked:bg-primary-500 checked:border-transparent transition-all",
-                  {
-                    "group-hover:ring-4 group-hover:ring-gray-100 focus:!ring focus:!ring-primary-300 focus:ring-offset-1 focus:ring-offset-white": variant !== "bordered" && !isError,
-                    "!border-error-500 group-hover:ring-4 group-hover:ring-error-50 focus:!ring focus:!ring-error-300 focus:ring-offset-1 focus:ring-offset-white": variant !== "bordered" && isError
-                  }
-                ),
-                checkedInputClassName: "absolute top-0 left-0 w-full h-full flex items-center justify-center text-white opacity-0 peer-checked:opacity-100 transition-opacity"
-              }) }),
-              Boolean(label) && /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
-                /* @__PURE__ */ jsx("div", { className: "font-p2-medium text-gray-700 transition group-hover:text-primary-500", children: label }),
-                Boolean(errorMessage ?? helperMessage) && /* @__PURE__ */ jsx(
-                  "div",
-                  {
-                    className: clsx(
-                      "font-p3-regular",
-                      errorMessage && isError ? "text-error-500" : "text-gray-500"
-                    ),
-                    children: isError && errorMessage ? errorMessage : helperMessage
-                  }
-                )
-              ] })
-            ]
-          }
-        ),
-        variant === "bordered" && icon ? /* @__PURE__ */ jsx("div", { className: "text-gray-600 group-hover:text-primary-500 group-checked:text-primary-500", children: icon }) : null
-      ]
-    }
-  );
-};
-
-export { SelectableInputWrapper as S };