@yusufalperendumlu/component-library 0.0.2 → 0.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,17 +1,27 @@
1
1
  import type { StorybookConfig } from '@storybook/react-webpack5';
2
+ import path from 'path';
2
3
 
3
4
  const config: StorybookConfig = {
4
- "stories": [
5
- "../src/**/*.mdx",
6
- "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"
7
- ],
8
- "addons": [
9
- "@storybook/addon-webpack5-compiler-swc",
10
- "@storybook/addon-docs"
11
- ],
12
- "framework": {
13
- "name": "@storybook/react-webpack5",
14
- "options": {}
15
- }
5
+ stories: ['../src/**/*.stories.@(ts|tsx)'],
6
+ addons: ['@storybook/addon-essentials'],
7
+ framework: {
8
+ name: '@storybook/react-webpack5',
9
+ options: {},
10
+ },
11
+ webpackFinal: async (config) => {
12
+ config.module?.rules?.push({
13
+ test: /\.(ts|tsx)$/,
14
+ use: [
15
+ {
16
+ loader: require.resolve('ts-loader'),
17
+ },
18
+ ],
19
+ exclude: /node_modules/,
20
+ });
21
+
22
+ return config;
23
+ },
16
24
  };
17
- export default config;
25
+
26
+ export default config;
27
+
@@ -1,7 +1,13 @@
1
+ import '../src/styles/tailwind.css';
1
2
  import type { Preview } from '@storybook/react-webpack5'
2
3
 
4
+
5
+
6
+ import { withThemeByClassName } from "@storybook/addon-themes";
7
+
3
8
  const preview: Preview = {
4
9
  parameters: {
10
+ actions: { argTypesRegex: "^on[A-Z].*" },
5
11
  controls: {
6
12
  matchers: {
7
13
  color: /(background|color)$/i,
@@ -9,6 +15,15 @@ const preview: Preview = {
9
15
  },
10
16
  },
11
17
  },
18
+
19
+ decorators: [withThemeByClassName({
20
+ themes: {
21
+ // nameOfTheme: 'classNameForTheme',
22
+ light: '',
23
+ dark: 'dark',
24
+ },
25
+ defaultTheme: 'light',
26
+ })]
12
27
  };
13
28
 
14
29
  export default preview;
@@ -0,0 +1,4 @@
1
+ import '../src/styles/tailwind.css';
2
+ import type { Preview } from '@storybook/react-webpack5';
3
+ declare const preview: Preview;
4
+ export default preview;
@@ -0,0 +1,4 @@
1
+ /*
2
+ ! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com
3
+ */*,:after,:before{border:0 solid #e5e7eb;box-sizing:border-box}:after,:before{--tw-content:""}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#9ca3af;opacity:1}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]{display:none}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.rounded-lg{border-radius:.5rem}.border-2{border-width:2px}.bg-blue-500{--tw-bg-opacity:1;background-color:rgb(59 130 246/var(--tw-bg-opacity))}.bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity))}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-3{padding-bottom:.75rem;padding-top:.75rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-gray-800{--tw-text-opacity:1;color:rgb(31 41 55/var(--tw-text-opacity))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}
4
+ /*# sourceMappingURL=index.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["tailwind.css"],"names":[],"mappings":"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","file":"index.css","sourcesContent":["@tailwind base;\r\n@tailwind components;\r\n@tailwind utilities;\r\n"]}
package/dist/cjs/index.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";var r=require("react/jsx-runtime");exports.Button=({variant:e,...o})=>r.jsx("button",{style:{..."primary"===e?{borderColor:"#053786ff",color:"#ca1515ff",backgroundColor:"#bfdbfe",padding:"2rem 5rem"}:"secondary"===e?{borderColor:"#cbd5e1",textColor:"#6b7280",backgroundColor:"#f3f4f6"}:{},...o.style},...o,children:o.title}),exports.Input=({placeholder:e})=>r.jsx("input",{placeholder:e,children:"Input"});
1
+ "use strict";var r=require("react/jsx-runtime");function e(r){var t,n,a="";if("string"==typeof r||"number"==typeof r)a+=r;else if("object"==typeof r)if(Array.isArray(r)){var l=r.length;for(t=0;t<l;t++)r[t]&&(n=e(r[t]))&&(a&&(a+=" "),a+=n)}else for(n in r)r[n]&&(a&&(a+=" "),a+=n);return a}function t(){for(var r,t,n=0,a="",l=arguments.length;n<l;n++)(r=arguments[n])&&(t=e(r))&&(a&&(a+=" "),a+=t);return a}const n=r=>"boolean"==typeof r?`${r}`:0===r?"0":r,a=t,l=(i="border-2 rounded-lg transition-all duration-300 ease-in-out",s={variants:{variant:{primary:"bg-blue-500 text-white",secondary:"bg-gray-200 text-gray-800"}},defaultVariants:{variant:"primary"}},r=>{var e;if(null==(null==s?void 0:s.variants))return a(i,null==r?void 0:r.class,null==r?void 0:r.className);const{variants:t,defaultVariants:l}=s,u=Object.keys(t).map(e=>{const a=null==r?void 0:r[e],i=null==l?void 0:l[e];if(null===a)return null;const s=n(a)||n(i);return t[e][s]}),o=r&&Object.entries(r).reduce((r,e)=>{let[t,n]=e;return void 0===n||(r[t]=n),r},{}),c=null==s||null===(e=s.compoundVariants)||void 0===e?void 0:e.reduce((r,e)=>{let{class:t,className:n,...a}=e;return Object.entries(a).every(r=>{let[e,t]=r;return Array.isArray(t)?t.includes({...l,...o}[e]):{...l,...o}[e]===t})?[...r,t,n]:r},[]);return a(i,u,c,null==r?void 0:r.class,null==r?void 0:r.className)});var i,s;exports.Button=({variant:e,title:n,...a})=>r.jsx("button",{className:t(l({variant:e}),a.className),...a,children:n}),exports.Input=({placeholder:e})=>r.jsx("input",{placeholder:e,children:"Input"});
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/components/Button/Button.tsx","../../src/components/Input/Input.tsx"],"sourcesContent":[null,null],"names":["variant","props","_jsx","style","borderColor","color","backgroundColor","padding","textColor","children","title","placeholder"],"mappings":"+DAKuC,EAAGA,aAAYC,KAsBlDC,EAAAA,cAAQC,MAAO,IApBC,YAAZH,EACK,CACLI,YAAa,YACbC,MAAO,YACPC,gBAAiB,UACjBC,QAAS,aAGG,cAAZP,EACK,CACLI,YAAa,UACbI,UAAW,UACXF,gBAAiB,WAId,CAAA,KAIgCL,EAAME,UAAaF,EAAKQ,SAC5DR,EAAMS,sBCxBuB,EAAGC,iBAC9BT,EAAAA,IAAA,QAAA,CAAOS,YAAaA"}
1
+ {"version":3,"file":"index.js","sources":["../../node_modules/clsx/dist/clsx.mjs","../../node_modules/class-variance-authority/dist/index.mjs","../../src/components/Button/Button.tsx","../../src/components/Input/Input.tsx"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","/**\n * Copyright 2022 Joe Bell. All rights reserved.\n *\n * This file is licensed to you under the Apache License, Version 2.0\n * (the \"License\"); you may not use this file except in compliance with the\n * License. You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR REPRESENTATIONS OF ANY KIND, either express or implied. See the\n * License for the specific language governing permissions and limitations under\n * the License.\n */ import { clsx } from \"clsx\";\nconst falsyToString = (value)=>typeof value === \"boolean\" ? `${value}` : value === 0 ? \"0\" : value;\nexport const cx = clsx;\nexport const cva = (base, config)=>(props)=>{\n var _config_compoundVariants;\n if ((config === null || config === void 0 ? void 0 : config.variants) == null) return cx(base, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);\n const { variants, defaultVariants } = config;\n const getVariantClassNames = Object.keys(variants).map((variant)=>{\n const variantProp = props === null || props === void 0 ? void 0 : props[variant];\n const defaultVariantProp = defaultVariants === null || defaultVariants === void 0 ? void 0 : defaultVariants[variant];\n if (variantProp === null) return null;\n const variantKey = falsyToString(variantProp) || falsyToString(defaultVariantProp);\n return variants[variant][variantKey];\n });\n const propsWithoutUndefined = props && Object.entries(props).reduce((acc, param)=>{\n let [key, value] = param;\n if (value === undefined) {\n return acc;\n }\n acc[key] = value;\n return acc;\n }, {});\n const getCompoundVariantClassNames = config === null || config === void 0 ? void 0 : (_config_compoundVariants = config.compoundVariants) === null || _config_compoundVariants === void 0 ? void 0 : _config_compoundVariants.reduce((acc, param)=>{\n let { class: cvClass, className: cvClassName, ...compoundVariantOptions } = param;\n return Object.entries(compoundVariantOptions).every((param)=>{\n let [key, value] = param;\n return Array.isArray(value) ? value.includes({\n ...defaultVariants,\n ...propsWithoutUndefined\n }[key]) : ({\n ...defaultVariants,\n ...propsWithoutUndefined\n })[key] === value;\n }) ? [\n ...acc,\n cvClass,\n cvClassName\n ] : acc;\n }, []);\n return cx(base, getVariantClassNames, getCompoundVariantClassNames, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);\n };\n\n",null,null],"names":["r","e","t","f","n","Array","isArray","o","length","clsx","arguments","falsyToString","value","cx","buttonVariants","base","config","variants","variant","primary","secondary","defaultVariants","props","_config_compoundVariants","class","className","getVariantClassNames","Object","keys","map","variantProp","defaultVariantProp","variantKey","propsWithoutUndefined","entries","reduce","acc","param","key","undefined","getCompoundVariantClassNames","compoundVariants","cvClass","cvClassName","compoundVariantOptions","every","includes","title","_jsx","children","placeholder"],"mappings":"gDAAA,SAASA,EAAEC,GAAG,IAAIC,EAAEC,EAAEC,EAAE,GAAG,GAAG,iBAAiBH,GAAG,iBAAiBA,EAAEG,GAAGH,OAAO,GAAG,iBAAiBA,EAAE,GAAGI,MAAMC,QAAQL,GAAG,CAAC,IAAIM,EAAEN,EAAEO,OAAO,IAAIN,EAAE,EAAEA,EAAEK,EAAEL,IAAID,EAAEC,KAAKC,EAAEH,EAAEC,EAAEC,OAAOE,IAAIA,GAAG,KAAKA,GAAGD,EAAE,MAAM,IAAIA,KAAKF,EAAEA,EAAEE,KAAKC,IAAIA,GAAG,KAAKA,GAAGD,GAAG,OAAOC,CAAC,CAAQ,SAASK,IAAO,IAAI,IAAIR,EAAEC,EAAEC,EAAE,EAAEC,EAAE,GAAGG,EAAEG,UAAUF,OAAOL,EAAEI,EAAEJ,KAAKF,EAAES,UAAUP,MAAMD,EAAEF,EAAEC,MAAMG,IAAIA,GAAG,KAAKA,GAAGF,GAAG,OAAOE,CAAC,CCe/W,MAAMO,EAAiBC,GAAyB,kBAAVA,EAAsB,GAAGA,IAAoB,IAAVA,EAAc,IAAMA,EAChFC,EAAKJ,ECNZK,GDOcC,ECNlB,8DDMwBC,ECLxB,CACEC,SAAU,CACRC,QAAS,CACPC,QAAS,yBACTC,UAAW,8BAGfC,gBAAiB,CACfH,QAAS,YDHqBI,IAC5B,IAAIC,EACJ,GAAyE,OAApEP,aAAuC,EAASA,EAAOC,UAAmB,OAAOJ,EAAGE,EAAMO,aAAqC,EAASA,EAAME,MAAOF,aAAqC,EAASA,EAAMG,WAC9M,MAAMR,SAAEA,EAAQI,gBAAEA,GAAoBL,EAChCU,EAAuBC,OAAOC,KAAKX,GAAUY,IAAKX,IACpD,MAAMY,EAAcR,aAAqC,EAASA,EAAMJ,GAClEa,EAAqBV,aAAyD,EAASA,EAAgBH,GAC7G,GAAoB,OAAhBY,EAAsB,OAAO,KACjC,MAAME,EAAarB,EAAcmB,IAAgBnB,EAAcoB,GAC/D,OAAOd,EAASC,GAASc,KAEvBC,EAAwBX,GAASK,OAAOO,QAAQZ,GAAOa,OAAO,CAACC,EAAKC,KACtE,IAAKC,EAAK1B,GAASyB,EACnB,YAAcE,IAAV3B,IAGJwB,EAAIE,GAAO1B,GAFAwB,GAIZ,CAAA,GACGI,EAA+BxB,SAAyG,QAAxDO,EAA2BP,EAAOyB,wBAA2D,IAA7BlB,OAA1E,EAAyHA,EAAyBY,OAAO,CAACC,EAAKC,KACvO,IAAMb,MAAOkB,EAASjB,UAAWkB,KAAgBC,GAA2BP,EAC5E,OAAOV,OAAOO,QAAQU,GAAwBC,MAAOR,IACjD,IAAKC,EAAK1B,GAASyB,EACnB,OAAOhC,MAAMC,QAAQM,GAASA,EAAMkC,SAAS,IACtCzB,KACAY,GACLK,IAAQ,IACHjB,KACAY,GACJK,KAAS1B,IACX,IACEwB,EACHM,EACAC,GACAP,GACL,IACH,OAAOvB,EAAGE,EAAMW,EAAsBc,EAA8BlB,aAAqC,EAASA,EAAME,MAAOF,aAAqC,EAASA,EAAMG,aApCxK,IAACV,EAAMC,iBCQX,EAAGE,UAAS6B,WAAUzB,KAEjC0B,EAAAA,cACEvB,UAAWhB,EAAKK,EAAe,CAAEI,YAAYI,EAAMG,cAC/CH,EAAK2B,SAERF,kBC3B6B,EAAGG,iBAC9BF,EAAAA,IAAA,QAAA,CAAOE,YAAaA","x_google_ignoreList":[0,1]}
@@ -0,0 +1,4 @@
1
+ /*
2
+ ! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com
3
+ */*,:after,:before{border:0 solid #e5e7eb;box-sizing:border-box}:after,:before{--tw-content:""}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#9ca3af;opacity:1}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]{display:none}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.rounded-lg{border-radius:.5rem}.border-2{border-width:2px}.bg-blue-500{--tw-bg-opacity:1;background-color:rgb(59 130 246/var(--tw-bg-opacity))}.bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity))}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-3{padding-bottom:.75rem;padding-top:.75rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-gray-800{--tw-text-opacity:1;color:rgb(31 41 55/var(--tw-text-opacity))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}
4
+ /*# sourceMappingURL=index.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["tailwind.css"],"names":[],"mappings":"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","file":"index.css","sourcesContent":["@tailwind base;\r\n@tailwind components;\r\n@tailwind utilities;\r\n"]}
package/dist/esm/index.js CHANGED
@@ -1,2 +1,2 @@
1
- import{jsx as r}from"react/jsx-runtime";const o=({variant:o,...e})=>r("button",{style:{..."primary"===o?{borderColor:"#053786ff",color:"#ca1515ff",backgroundColor:"#bfdbfe",padding:"2rem 5rem"}:"secondary"===o?{borderColor:"#cbd5e1",textColor:"#6b7280",backgroundColor:"#f3f4f6"}:{},...e.style},...e,children:e.title}),e=({placeholder:o})=>r("input",{placeholder:o,children:"Input"});export{o as Button,e as Input};
1
+ import{jsx as r}from"react/jsx-runtime";function e(r){var t,n,a="";if("string"==typeof r||"number"==typeof r)a+=r;else if("object"==typeof r)if(Array.isArray(r)){var l=r.length;for(t=0;t<l;t++)r[t]&&(n=e(r[t]))&&(a&&(a+=" "),a+=n)}else for(n in r)r[n]&&(a&&(a+=" "),a+=n);return a}function t(){for(var r,t,n=0,a="",l=arguments.length;n<l;n++)(r=arguments[n])&&(t=e(r))&&(a&&(a+=" "),a+=t);return a}const n=r=>"boolean"==typeof r?`${r}`:0===r?"0":r,a=t,l=(i="border-2 rounded-lg transition-all duration-300 ease-in-out",o={variants:{variant:{primary:"bg-blue-500 text-white",secondary:"bg-gray-200 text-gray-800"}},defaultVariants:{variant:"primary"}},r=>{var e;if(null==(null==o?void 0:o.variants))return a(i,null==r?void 0:r.class,null==r?void 0:r.className);const{variants:t,defaultVariants:l}=o,s=Object.keys(t).map(e=>{const a=null==r?void 0:r[e],i=null==l?void 0:l[e];if(null===a)return null;const o=n(a)||n(i);return t[e][o]}),u=r&&Object.entries(r).reduce((r,e)=>{let[t,n]=e;return void 0===n||(r[t]=n),r},{}),c=null==o||null===(e=o.compoundVariants)||void 0===e?void 0:e.reduce((r,e)=>{let{class:t,className:n,...a}=e;return Object.entries(a).every(r=>{let[e,t]=r;return Array.isArray(t)?t.includes({...l,...u}[e]):{...l,...u}[e]===t})?[...r,t,n]:r},[]);return a(i,s,c,null==r?void 0:r.class,null==r?void 0:r.className)});var i,o;const s=({variant:e,title:n,...a})=>r("button",{className:t(l({variant:e}),a.className),...a,children:n}),u=({placeholder:e})=>r("input",{placeholder:e,children:"Input"});export{s as Button,u as Input};
2
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/components/Button/Button.tsx","../../src/components/Input/Input.tsx"],"sourcesContent":[null,null],"names":["Button","variant","props","_jsx","style","borderColor","color","backgroundColor","padding","textColor","children","title","Input","placeholder"],"mappings":"wCAKA,MAAMA,EAAiC,EAAGC,aAAYC,KAsBlDC,YAAQC,MAAO,IApBC,YAAZH,EACK,CACLI,YAAa,YACbC,MAAO,YACPC,gBAAiB,UACjBC,QAAS,aAGG,cAAZP,EACK,CACLI,YAAa,UACbI,UAAW,UACXF,gBAAiB,WAId,CAAA,KAIgCL,EAAME,UAAaF,EAAKQ,SAC5DR,EAAMS,QCxBPC,EAA8B,EAAGC,iBAC9BV,EAAA,QAAA,CAAOU,YAAaA"}
1
+ {"version":3,"file":"index.js","sources":["../../node_modules/clsx/dist/clsx.mjs","../../node_modules/class-variance-authority/dist/index.mjs","../../src/components/Button/Button.tsx","../../src/components/Input/Input.tsx"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","/**\n * Copyright 2022 Joe Bell. All rights reserved.\n *\n * This file is licensed to you under the Apache License, Version 2.0\n * (the \"License\"); you may not use this file except in compliance with the\n * License. You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR REPRESENTATIONS OF ANY KIND, either express or implied. See the\n * License for the specific language governing permissions and limitations under\n * the License.\n */ import { clsx } from \"clsx\";\nconst falsyToString = (value)=>typeof value === \"boolean\" ? `${value}` : value === 0 ? \"0\" : value;\nexport const cx = clsx;\nexport const cva = (base, config)=>(props)=>{\n var _config_compoundVariants;\n if ((config === null || config === void 0 ? void 0 : config.variants) == null) return cx(base, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);\n const { variants, defaultVariants } = config;\n const getVariantClassNames = Object.keys(variants).map((variant)=>{\n const variantProp = props === null || props === void 0 ? void 0 : props[variant];\n const defaultVariantProp = defaultVariants === null || defaultVariants === void 0 ? void 0 : defaultVariants[variant];\n if (variantProp === null) return null;\n const variantKey = falsyToString(variantProp) || falsyToString(defaultVariantProp);\n return variants[variant][variantKey];\n });\n const propsWithoutUndefined = props && Object.entries(props).reduce((acc, param)=>{\n let [key, value] = param;\n if (value === undefined) {\n return acc;\n }\n acc[key] = value;\n return acc;\n }, {});\n const getCompoundVariantClassNames = config === null || config === void 0 ? void 0 : (_config_compoundVariants = config.compoundVariants) === null || _config_compoundVariants === void 0 ? void 0 : _config_compoundVariants.reduce((acc, param)=>{\n let { class: cvClass, className: cvClassName, ...compoundVariantOptions } = param;\n return Object.entries(compoundVariantOptions).every((param)=>{\n let [key, value] = param;\n return Array.isArray(value) ? value.includes({\n ...defaultVariants,\n ...propsWithoutUndefined\n }[key]) : ({\n ...defaultVariants,\n ...propsWithoutUndefined\n })[key] === value;\n }) ? [\n ...acc,\n cvClass,\n cvClassName\n ] : acc;\n }, []);\n return cx(base, getVariantClassNames, getCompoundVariantClassNames, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);\n };\n\n",null,null],"names":["r","e","t","f","n","Array","isArray","o","length","clsx","arguments","falsyToString","value","cx","buttonVariants","base","config","variants","variant","primary","secondary","defaultVariants","props","_config_compoundVariants","class","className","getVariantClassNames","Object","keys","map","variantProp","defaultVariantProp","variantKey","propsWithoutUndefined","entries","reduce","acc","param","key","undefined","getCompoundVariantClassNames","compoundVariants","cvClass","cvClassName","compoundVariantOptions","every","includes","Button","title","_jsx","children","Input","placeholder"],"mappings":"wCAAA,SAASA,EAAEC,GAAG,IAAIC,EAAEC,EAAEC,EAAE,GAAG,GAAG,iBAAiBH,GAAG,iBAAiBA,EAAEG,GAAGH,OAAO,GAAG,iBAAiBA,EAAE,GAAGI,MAAMC,QAAQL,GAAG,CAAC,IAAIM,EAAEN,EAAEO,OAAO,IAAIN,EAAE,EAAEA,EAAEK,EAAEL,IAAID,EAAEC,KAAKC,EAAEH,EAAEC,EAAEC,OAAOE,IAAIA,GAAG,KAAKA,GAAGD,EAAE,MAAM,IAAIA,KAAKF,EAAEA,EAAEE,KAAKC,IAAIA,GAAG,KAAKA,GAAGD,GAAG,OAAOC,CAAC,CAAQ,SAASK,IAAO,IAAI,IAAIR,EAAEC,EAAEC,EAAE,EAAEC,EAAE,GAAGG,EAAEG,UAAUF,OAAOL,EAAEI,EAAEJ,KAAKF,EAAES,UAAUP,MAAMD,EAAEF,EAAEC,MAAMG,IAAIA,GAAG,KAAKA,GAAGF,GAAG,OAAOE,CAAC,CCe/W,MAAMO,EAAiBC,GAAyB,kBAAVA,EAAsB,GAAGA,IAAoB,IAAVA,EAAc,IAAMA,EAChFC,EAAKJ,ECNZK,GDOcC,ECNlB,8DDMwBC,ECLxB,CACEC,SAAU,CACRC,QAAS,CACPC,QAAS,yBACTC,UAAW,8BAGfC,gBAAiB,CACfH,QAAS,YDHqBI,IAC5B,IAAIC,EACJ,GAAyE,OAApEP,aAAuC,EAASA,EAAOC,UAAmB,OAAOJ,EAAGE,EAAMO,aAAqC,EAASA,EAAME,MAAOF,aAAqC,EAASA,EAAMG,WAC9M,MAAMR,SAAEA,EAAQI,gBAAEA,GAAoBL,EAChCU,EAAuBC,OAAOC,KAAKX,GAAUY,IAAKX,IACpD,MAAMY,EAAcR,aAAqC,EAASA,EAAMJ,GAClEa,EAAqBV,aAAyD,EAASA,EAAgBH,GAC7G,GAAoB,OAAhBY,EAAsB,OAAO,KACjC,MAAME,EAAarB,EAAcmB,IAAgBnB,EAAcoB,GAC/D,OAAOd,EAASC,GAASc,KAEvBC,EAAwBX,GAASK,OAAOO,QAAQZ,GAAOa,OAAO,CAACC,EAAKC,KACtE,IAAKC,EAAK1B,GAASyB,EACnB,YAAcE,IAAV3B,IAGJwB,EAAIE,GAAO1B,GAFAwB,GAIZ,CAAA,GACGI,EAA+BxB,SAAyG,QAAxDO,EAA2BP,EAAOyB,wBAA2D,IAA7BlB,OAA1E,EAAyHA,EAAyBY,OAAO,CAACC,EAAKC,KACvO,IAAMb,MAAOkB,EAASjB,UAAWkB,KAAgBC,GAA2BP,EAC5E,OAAOV,OAAOO,QAAQU,GAAwBC,MAAOR,IACjD,IAAKC,EAAK1B,GAASyB,EACnB,OAAOhC,MAAMC,QAAQM,GAASA,EAAMkC,SAAS,IACtCzB,KACAY,GACLK,IAAQ,IACHjB,KACAY,GACJK,KAAS1B,IACX,IACEwB,EACHM,EACAC,GACAP,GACL,IACH,OAAOvB,EAAGE,EAAMW,EAAsBc,EAA8BlB,aAAqC,EAASA,EAAME,MAAOF,aAAqC,EAASA,EAAMG,aApCxK,IAACV,EAAMC,ECQ1B,MAAM+B,EAAS,EAAG7B,UAAS8B,WAAU1B,KAEjC2B,YACExB,UAAWhB,EAAKK,EAAe,CAAEI,YAAYI,EAAMG,cAC/CH,EAAK4B,SAERF,IC3BDG,EAA8B,EAAGC,iBAC9BH,EAAA,QAAA,CAAOG,YAAaA","x_google_ignoreList":[0,1]}
package/dist/index.d.ts CHANGED
@@ -1,7 +1,12 @@
1
- interface IButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import React$1 from 'react';
3
+
4
+ type IButtonProps = React$1.ButtonHTMLAttributes<HTMLButtonElement> & {
5
+ className?: string;
2
6
  variant?: "primary" | "secondary";
3
- }
4
- declare const Button: React.FC<IButtonProps>;
7
+ title: string;
8
+ };
9
+ declare const Button: ({ variant, title, ...props }: IButtonProps) => react_jsx_runtime.JSX.Element;
5
10
 
6
11
  type InputProps = {
7
12
  placeholder?: string;
@@ -0,0 +1,43 @@
1
+ import React from "react";
2
+ type IButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {
3
+ className?: string;
4
+ variant?: "primary" | "secondary";
5
+ title: string;
6
+ };
7
+ declare const Button: {
8
+ ({ variant, title, ...props }: IButtonProps): import("react/jsx-runtime").JSX.Element;
9
+ __docgenInfo: {
10
+ description: string;
11
+ methods: never[];
12
+ displayName: string;
13
+ props: {
14
+ className: {
15
+ required: boolean;
16
+ tsType: {
17
+ name: string;
18
+ };
19
+ description: string;
20
+ };
21
+ variant: {
22
+ required: boolean;
23
+ tsType: {
24
+ name: string;
25
+ raw: string;
26
+ elements: {
27
+ name: string;
28
+ value: string;
29
+ }[];
30
+ };
31
+ description: string;
32
+ };
33
+ title: {
34
+ required: boolean;
35
+ tsType: {
36
+ name: string;
37
+ };
38
+ description: string;
39
+ };
40
+ };
41
+ };
42
+ };
43
+ export default Button;
@@ -0,0 +1,9 @@
1
+ import type { Meta, StoryObj } from "@storybook/react";
2
+ import "../../styles/tailwind.css";
3
+ import Button from "./Button";
4
+ declare const meta: Meta<typeof Button>;
5
+ export default meta;
6
+ type Story = StoryObj<typeof Button>;
7
+ export declare const Primary: Story;
8
+ export declare const Secondary: Story;
9
+ export declare const CustomClassName: Story;
@@ -0,0 +1,2 @@
1
+ import Button from "./Button";
2
+ export default Button;
@@ -0,0 +1,5 @@
1
+ type InputProps = {
2
+ placeholder?: string;
3
+ };
4
+ declare const Input: React.FC<InputProps>;
5
+ export default Input;
@@ -0,0 +1,2 @@
1
+ import Input from "./Input";
2
+ export default Input;
@@ -0,0 +1,2 @@
1
+ export { default as Button } from "./Button";
2
+ export { default as Input } from "./Input";
@@ -0,0 +1,2 @@
1
+ import "./styles/tailwind.css";
2
+ export * from "./components";
File without changes
@@ -0,0 +1,3 @@
1
+ /*
2
+ ! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com
3
+ */*,:after,:before{border:0 solid #e5e7eb;box-sizing:border-box}:after,:before{--tw-content:""}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:#9ca3af;opacity:1}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]{display:none}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.rounded-lg{border-radius:.5rem}.border-2{border-width:2px}.bg-blue-500{--tw-bg-opacity:1;background-color:rgb(59 130 246/var(--tw-bg-opacity))}.bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity))}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-3{padding-bottom:.75rem;padding-top:.75rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-gray-800{--tw-text-opacity:1;color:rgb(31 41 55/var(--tw-text-opacity))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yusufalperendumlu/component-library",
3
- "version": "0.0.2",
3
+ "version": "0.0.3",
4
4
  "main": "dist/cjs/index.js",
5
5
  "module": "dist/esm/index.js",
6
6
  "types": "dist/index.d.ts",
@@ -31,14 +31,20 @@
31
31
  "description": "A collection of reusable React components for building user interfaces.",
32
32
  "peerDependencies": {
33
33
  "react": ">=16.8.0",
34
- "react-dom": ">=16.8.0"
34
+ "react-dom": ">=16.8.0",
35
+ "tailwindcss": ">=3.0.0"
35
36
  },
36
37
  "devDependencies": {
38
+ "@babel/preset-typescript": "^7.27.1",
37
39
  "@rollup/plugin-terser": "^0.4.4",
38
40
  "@rollup/plugin-typescript": "^12.1.4",
39
41
  "@storybook/addon-docs": "9.0.17",
42
+ "@storybook/addon-essentials": "^9.0.0-alpha.12",
43
+ "@storybook/addon-styling-webpack": "2.0.0",
44
+ "@storybook/addon-themes": "9.0.18",
40
45
  "@storybook/addon-webpack5-compiler-swc": "3.0.0",
41
- "@storybook/react-webpack5": "9.0.17",
46
+ "@storybook/react-webpack5": "^9",
47
+ "@tailwindcss/postcss": "^4.1.11",
42
48
  "@testing-library/dom": "^10.4.0",
43
49
  "@testing-library/jest-dom": "^6.6.3",
44
50
  "@testing-library/react": "^16.3.0",
@@ -46,19 +52,26 @@
46
52
  "@types/jest": "^30.0.0",
47
53
  "@types/react": "^19.1.8",
48
54
  "@types/react-dom": "^18.0.0",
55
+ "autoprefixer": "^10.4.21",
56
+ "babel-loader": "^10.0.0",
49
57
  "jest": "^30.0.5",
50
58
  "jest-environment-jsdom": "^30.0.5",
51
59
  "postcss": "^8.5.6",
60
+ "postcss-loader": "^8.1.1",
52
61
  "react": "^18.0.0",
53
62
  "react-dom": "^18.0.0",
54
- "storybook": "9.0.17",
63
+ "storybook": "^9",
64
+ "tailwindcss": "3.4.1",
55
65
  "ts-jest": "^29.4.0",
66
+ "ts-loader": "^9.5.2",
56
67
  "tslib": "^2.8.1",
57
68
  "typescript": "^5.8.3"
58
69
  },
59
70
  "dependencies": {
60
71
  "@rollup/plugin-commonjs": "^28.0.6",
61
72
  "@rollup/plugin-node-resolve": "^16.0.1",
73
+ "class-variance-authority": "^0.7.1",
74
+ "clsx": "^2.1.1",
62
75
  "rollup": "^4.45.1",
63
76
  "rollup-plugin-dts": "^6.2.1",
64
77
  "rollup-plugin-peer-deps-external": "^2.2.4",
@@ -0,0 +1,6 @@
1
+ module.exports = {
2
+ plugins: {
3
+ tailwindcss: {},
4
+ autoprefixer: {},
5
+ },
6
+ };
package/rollup.config.mjs CHANGED
@@ -36,7 +36,7 @@ export default [
36
36
  commonjs(),
37
37
  typescript({
38
38
  tsconfig: "./tsconfig.json",
39
- declaration: false, // We'll handle declarations separately
39
+ declaration: false,
40
40
  declarationMap: false,
41
41
  }),
42
42
  postcss({
@@ -44,14 +44,13 @@ export default [
44
44
  extract: true,
45
45
  minimize: true,
46
46
  sourceMap: true,
47
- inject: {
48
- insertAt: "top",
49
- },
47
+ modules: false,
50
48
  }),
51
49
  terser(),
52
50
  ],
53
51
  external: ["react", "react-dom"],
54
52
  },
53
+
55
54
  // Type definitions build
56
55
  {
57
56
  input: "src/index.ts",
@@ -62,4 +61,17 @@ export default [
62
61
  plugins: [dts()],
63
62
  external: [/\.css$/],
64
63
  },
64
+ {
65
+ input: "src/styles/tailwind.css",
66
+ output: {
67
+ file: "dist/tailwind.css",
68
+ format: "esm",
69
+ },
70
+ plugins: [
71
+ postcss({
72
+ extract: true,
73
+ minimize: true,
74
+ }),
75
+ ],
76
+ },
65
77
  ];
@@ -1,14 +1,19 @@
1
1
  import type { Meta, StoryObj } from "@storybook/react";
2
+ import "../../styles/tailwind.css";
2
3
  import Button from "./Button";
3
4
 
4
5
  const meta: Meta<typeof Button> = {
5
- title: "components-library/Button",
6
+ title: "Components/Button",
6
7
  component: Button,
8
+ argTypes: {
9
+ variant: {
10
+ control: "select",
11
+ options: ["primary", "secondary"],
12
+ },
13
+ onClick: { action: "clicked" },
14
+ },
7
15
  tags: ["autodocs"],
8
- parameters: {
9
- layout: "centered",
10
- }
11
- } as Meta<typeof Button> ;
16
+ };
12
17
 
13
18
  export default meta;
14
19
  type Story = StoryObj<typeof Button>;
@@ -27,8 +32,10 @@ export const Secondary: Story = {
27
32
  },
28
33
  };
29
34
 
30
- export const Default: Story = {
35
+ export const CustomClassName: Story = {
31
36
  args: {
32
- title: "Default Button",
37
+ title: "Custom Class",
38
+ variant: "primary",
39
+ className: "text-lg px-6 py-3",
33
40
  },
34
41
  };
@@ -1,32 +1,35 @@
1
- export interface IButtonProps
2
- extends React.ButtonHTMLAttributes<HTMLButtonElement> {
3
- variant?: "primary" | "secondary";
4
- }
1
+ import React from "react";
2
+ import { cva } from "class-variance-authority";
3
+ import clsx from "clsx";
5
4
 
6
- const Button: React.FC<IButtonProps> = ({ variant, ...props }) => {
7
- const colorClasses = () => {
8
- if (variant === "primary") {
9
- return {
10
- borderColor: "#053786ff",
11
- color: "#ca1515ff",
12
- backgroundColor: "#bfdbfe",
13
- padding: "2rem 5rem",
14
- };
15
- }
16
- if (variant === "secondary") {
17
- return {
18
- borderColor: "#cbd5e1",
19
- textColor: "#6b7280",
20
- backgroundColor: "#f3f4f6",
21
- };
22
- }
5
+ type IButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {
6
+ className?: string;
7
+ variant?: "primary" | "secondary";
8
+ title: string;
9
+ };
23
10
 
24
- return {};
25
- };
11
+ const buttonVariants = cva(
12
+ "border-2 rounded-lg transition-all duration-300 ease-in-out",
13
+ {
14
+ variants: {
15
+ variant: {
16
+ primary: "bg-blue-500 text-white",
17
+ secondary: "bg-gray-200 text-gray-800",
18
+ },
19
+ },
20
+ defaultVariants: {
21
+ variant: "primary",
22
+ },
23
+ }
24
+ );
26
25
 
26
+ const Button = ({ variant, title, ...props }: IButtonProps) => {
27
27
  return (
28
- <button style={{ ...colorClasses(), ...props.style }} {...props}>
29
- {props.title}
28
+ <button
29
+ className={clsx(buttonVariants({ variant }), props.className)}
30
+ {...props}
31
+ >
32
+ {title}
30
33
  </button>
31
34
  );
32
35
  };
package/src/index.ts CHANGED
@@ -1 +1,3 @@
1
+ import "./styles/tailwind.css"
2
+
1
3
  export * from "./components";
@@ -0,0 +1,3 @@
1
+ @tailwind base;
2
+ @tailwind components;
3
+ @tailwind utilities;
@@ -0,0 +1,12 @@
1
+ /** @type {import('tailwindcss').Config} */
2
+ module.exports = {
3
+ content: [
4
+ "./src/**/*.{js,ts,jsx,tsx}",
5
+ "./.storybook/**/*.{js,ts,jsx,tsx,mdx}",
6
+ ],
7
+ darkMode: ["class", '[data-theme="dark"]'],
8
+ theme: {
9
+ extend: {},
10
+ },
11
+ plugins: [],
12
+ };
package/tsconfig.json CHANGED
@@ -15,7 +15,8 @@
15
15
  "skipLibCheck": true
16
16
  },
17
17
  "include": [
18
- "src/**/*"
18
+ "src/**/*",
19
+ ".storybook",
19
20
  ],
20
21
  "exclude": [
21
22
  "node_modules",