@ck-ui/component-library 0.0.4 → 0.1.0

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.
Files changed (21) hide show
  1. package/dist/assets/index.css +1 -1
  2. package/dist/assets/index2.css +1 -1
  3. package/dist/assets/index4.css +1 -1
  4. package/dist/components/Button/Button.stories.d.ts +1 -1
  5. package/dist/components/Button/Button.stories.d.ts.map +1 -1
  6. package/dist/components/Button/index.js +1 -1
  7. package/dist/components/Copy/Copy.stories.d.ts +7 -5
  8. package/dist/components/Copy/Copy.stories.d.ts.map +1 -1
  9. package/dist/components/Copy/index.d.ts +8 -5
  10. package/dist/components/Copy/index.d.ts.map +1 -1
  11. package/dist/components/Copy/index.js +40 -26
  12. package/dist/components/Switch/Switch.stories.d.ts +1 -1
  13. package/dist/components/Switch/Switch.stories.d.ts.map +1 -1
  14. package/dist/components/Switch/index.js +11 -11
  15. package/dist/components/Tag/Tag.stories.d.ts +4 -4
  16. package/dist/components/Tag/Tag.stories.d.ts.map +1 -1
  17. package/dist/components/Tag/index.d.ts +3 -4
  18. package/dist/components/Tag/index.d.ts.map +1 -1
  19. package/dist/components/Tag/index.js +28 -29
  20. package/package.json +3 -2
  21. package/dist/assets/index5.css +0 -1
package/dist/assets/index.css CHANGED
@@ -1 +1 @@
1
- ._ckcl-tag_1vgmh_1{font-family:var(--ckcl-font-family-base, "Inter"),sans-serif;display:flex;align-items:center;width:fit-content;border-radius:40px;white-space:nowrap}._x-small_1vgmh_11{padding:var(--ckcl-spacing-2xs, 2px) var(--ckcl-spacing-sm, 8px);height:var(--ckcl-spacing-slg, 20px)}._small_1vgmh_16{padding:var(--ckcl-spacing-xs, 4px) var(--ckcl-spacing-sm, 8px);height:var(--ckcl-spacing-lg, 24px)}._medium_1vgmh_21{padding:var(--ckcl-spacing-xs, 4px) var(--ckcl-spacing-sm, 8px);height:var(--ckcl-spacing-xl, 28px)}._large_1vgmh_26{padding:var(--ckcl-spacing-xs, 4px) var(--ckcl-spacing-sm, 8px);height:var(--ckcl-spacing-2xl, 32px)}._neutral_1vgmh_32{background-color:var(--ckcl-tag-neutral-bg, #F4F4F4);border:1px solid var(--ckcl-tag-neutral-border, #AAAAAA);color:var(--ckcl-black-500, #2B2B2B);border-radius:40px}._error_1vgmh_39{background-color:var(--ckcl-tag-error-bg, #FDF4F4);border:1px solid var(--ckcl-tag-error-border, #E9787E);color:var(--ckcl-black-500, #2B2B2B);border-radius:40px}._success_1vgmh_46{background-color:var(--ckcl-tag-success-bg, #F4FAF6);border:1px solid var(--ckcl-tag-success-border, #7CC791);color:var(--ckcl-black-500, #2B2B2B);border-radius:40px}._in-progress_1vgmh_53{background-color:var(--ckcl-tag-inprogress-bg, #F8FBFF);border:1px solid var(--ckcl-tag-inprogress-border, #B0C6F4);color:var(--ckcl-black-500, #2B2B2B);border-radius:40px}._alert_1vgmh_60{background-color:var(--ckcl-tag-alert-bg, #FFFDF7);border:1px solid var(--ckcl-tag-alert-border, #FEEAA5);color:var(--ckcl-black-500, #2B2B2B);border-radius:40px}
1
+ ._ckcl-tag_1xrao_1{font-family:var(--ckcl-font-family-base, "Inter"),sans-serif;display:flex;align-items:center;width:fit-content;border-radius:40px;white-space:nowrap}._x-small_1xrao_11{padding:var(--ckcl-spacing-2xs, 2px) var(--ckcl-spacing-sm, 8px);height:var(--ckcl-spacing-slg, 20px)}._small_1xrao_16{padding:var(--ckcl-spacing-xs, 4px) var(--ckcl-spacing-sm, 8px);height:var(--ckcl-spacing-lg, 24px)}._medium_1xrao_21{padding:var(--ckcl-spacing-xs, 4px) var(--ckcl-spacing-sm, 8px);height:var(--ckcl-spacing-xl, 28px)}._large_1xrao_26{padding:var(--ckcl-spacing-xs, 4px) var(--ckcl-spacing-sm, 8px);height:var(--ckcl-spacing-2xl, 32px)}._neutral_1xrao_32{background-color:var(--ckcl-tag-neutral-bg, #F4F4F4);border:1px solid var(--ckcl-tag-neutral-border, #AAAAAA);color:var(--ckcl-black-500, #2B2B2B);border-radius:40px}._danger_1xrao_39{background-color:var(--ckcl-tag-error-bg, #FDF4F4);border:1px solid var(--ckcl-tag-error-border, #E9787E);color:var(--ckcl-black-500, #2B2B2B);border-radius:40px}._success_1xrao_46{background-color:var(--ckcl-tag-success-bg, #F4FAF6);border:1px solid var(--ckcl-tag-success-border, #7CC791);color:var(--ckcl-black-500, #2B2B2B);border-radius:40px}._info_1xrao_53{background-color:var(--ckcl-tag-inprogress-bg, #F8FBFF);border:1px solid var(--ckcl-tag-inprogress-border, #B0C6F4);color:var(--ckcl-black-500, #2B2B2B);border-radius:40px}._warning_1xrao_60{background-color:var(--ckcl-tag-alert-bg, #FFFDF7);border:1px solid var(--ckcl-tag-alert-border, #FEEAA5);color:var(--ckcl-black-500, #2B2B2B);border-radius:40px}
package/dist/assets/index2.css CHANGED
@@ -1 +1 @@
1
- ._ckcl-switch-wrapper_1utaq_1{font-family:var(--ckcl-font-family-base, "Inter"),sans-serif}._ckcl-switch-wrapper_1utaq_1 ._ckcl-switch_1utaq_1{position:relative;display:inline-block;cursor:pointer;width:var(--ckcl-spacing-xl, 28px);height:var(--ckcl-spacing-md, 16px)}._ckcl-switch-wrapper_1utaq_1 ._ckcl-switch_1utaq_1 ._slider_1utaq_11:before{width:var(--ckcl-fs-xs, 12px);height:var(--ckcl-fs-xs, 12px);left:2px;top:12%}._ckcl-switch-wrapper_1utaq_1 ._ckcl-switch_1utaq_1 input:checked+._slider_1utaq_11:before{transform:translate(var(--ckcl-fs-xs, 12px))}._ckcl-switch-wrapper_1utaq_1 ._ckcl-switch_1utaq_1 ._slider_1utaq_11{position:absolute;inset:0;background-color:var(--ckcl-black-400, #808080);transition:.4s;border-radius:var(--ckcl-spacing-md, 16px)}._ckcl-switch-wrapper_1utaq_1 ._ckcl-switch_1utaq_1 ._slider_1utaq_11:before{position:absolute;content:"";background-color:var(--ckcl-white, #FFFFFF);transition:.4s;border-radius:50%}._ckcl-switch-wrapper_1utaq_1 ._ckcl-switch_1utaq_1 input:checked+._slider_1utaq_11{background-color:var(--ckcl-primary-500, #3A72E4)}._ckcl-switch-wrapper_1utaq_1 ._ckcl-switch_1utaq_1 input:disabled+._slider_1utaq_11{background-color:var(--ckcl-black-200, #D5D5D5);cursor:not-allowed}._ckcl-switch-wrapper_1utaq_1 ._ckcl-switch_1utaq_1 input:checked:disabled+._slider_1utaq_11{background-color:var(--ckcl-primary-300, #B0C6F4);cursor:not-allowed}
1
+ ._ckcl-switch-wrapper_1h10p_1{font-family:var(--ckcl-font-family-base, "Inter"),sans-serif}._ckcl-switch-wrapper_1h10p_1 ._ckcl-switch_1h10p_1{position:relative;display:inline-flex;align-items:center;cursor:pointer;width:var(--ckcl-spacing-xl, 28px);height:var(--ckcl-spacing-md, 16px)}._ckcl-switch-wrapper_1h10p_1 ._ckcl-switch_1h10p_1 ._slider_1h10p_12:before{width:var(--ckcl-fs-xs, 12px);height:var(--ckcl-fs-xs, 12px);left:2px;top:50%;transform:translateY(-50%)}._ckcl-switch-wrapper_1h10p_1 ._ckcl-switch_1h10p_1 input:checked+._slider_1h10p_12:before{transform:translate(var(--ckcl-fs-xs, 12px),-50%)}._ckcl-switch-wrapper_1h10p_1 ._ckcl-switch_1h10p_1 ._slider_1h10p_12{position:absolute;inset:0;background-color:var(--ckcl-black-400, #808080);transition:.3s;border-radius:var(--ckcl-spacing-md, 16px)}._ckcl-switch-wrapper_1h10p_1 ._ckcl-switch_1h10p_1 ._slider_1h10p_12:before{position:absolute;content:"";background-color:var(--ckcl-white, #FFFFFF);transition:.3s;border-radius:50%}._ckcl-switch-wrapper_1h10p_1 ._ckcl-switch_1h10p_1 input:checked+._slider_1h10p_12{background-color:var(--ckcl-primary-500, #3A72E4)}._ckcl-switch-wrapper_1h10p_1 ._ckcl-switch_1h10p_1 input:disabled+._slider_1h10p_12{background-color:var(--ckcl-black-200, #D5D5D5);cursor:not-allowed}._ckcl-switch-wrapper_1h10p_1 ._ckcl-switch_1h10p_1 input:checked:disabled+._slider_1h10p_12{background-color:var(--ckcl-primary-300, #B0C6F4);cursor:not-allowed}._ckcl-switch-wrapper_1h10p_1 ._ckcl-switch_1h10p_1 input[type=checkbox]{margin:0;opacity:0}
package/dist/assets/index4.css CHANGED
@@ -1 +1 @@
1
- ._ckcl-copy_qj0vq_1{font-family:var(--ckcl-font-family-base, "Inter"),sans-serif;cursor:pointer;display:inline-block;align-items:center;-webkit-user-select:none;user-select:none}._icon_qj0vq_9{padding:var(--ckcl-spacing-xs, 4px) var(--ckcl-spacing-xs, 4px)}._small_qj0vq_14,._medium_qj0vq_18,._large_qj0vq_22{font-size:var(--ckcl-fs-xs, 12px)}
1
+ ._ckcl-button_zsbft_1{font-family:var(--ckcl-font-family-base, "Inter"),sans-serif;display:inline-flex;align-items:center;transition:all .3s ease;cursor:pointer;border-radius:var(--ckcl-spacing-xs, 4px);white-space:nowrap;text-decoration:none}._x-small_zsbft_13{padding:var(--ckcl-spacing-xs, 4px) var(--ckcl-spacing-sm, 8px);height:var(--ckcl-spacing-slg, 20px)}._small_zsbft_18{padding:var(--ckcl-spacing-xs, 4px) var(--ckcl-spacing-sm, 8px);height:var(--ckcl-spacing-lg, 24px)}._medium_zsbft_23{padding:var(--ckcl-spacing-xs, 4px) var(--ckcl-spacing-sm, 8px);height:var(--ckcl-spacing-xl, 28px)}._large_zsbft_28{padding:var(--ckcl-spacing-xs, 4px) var(--ckcl-spacing-sm, 8px);height:var(--ckcl-spacing-2xl, 32px)}._primary_zsbft_34{background-color:var(--ckcl-primary-500, #3A72E4);border:1px solid var(--ckcl-primary-500, #3A72E4);color:var(--ckcl-white, #FFFFFF)}._primary_zsbft_34:hover{background-color:var(--ckcl-primary-600, #1058EC);border:1px solid var(--ckcl-primary-600, #1058EC);color:var(--ckcl-white, #FFFFFF)}._primary_zsbft_34:disabled{background-color:var(--ckcl-black-300, #AAAAAA);color:var(--ckcl-white, #FFFFFF);border-color:var(--ckcl-black-300, #AAAAAA);cursor:not-allowed}._secondary_zsbft_52{background-color:transparent;border:1px solid var(--ckcl-primary-600, #1058EC);color:var(--ckcl-primary-600, #1058EC)}._secondary_zsbft_52:hover{background-color:var(--ckcl-primary-200, #D8E3FA);border:1px solid var(--ckcl-primary-600, #1058EC)}._secondary_zsbft_52:disabled{background-color:var(--ckcl-black-100, #F4F4F4);color:var(--ckcl-black-400, #808080);border-color:var(--ckcl-black-200, #D5D5D5);cursor:not-allowed}._tertiary_zsbft_69{background-color:var(--ckcl-white, #FFFFFF);border:none;color:var(--ckcl-primary-600, #1058EC)}._tertiary_zsbft_69:hover{text-decoration:underline}._tertiary_zsbft_69:disabled{color:var(--ckcl-black-400, #808080);cursor:not-allowed;text-decoration:none}
package/dist/components/Button/Button.stories.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { Meta, StoryObj } from '@storybook/react';
1
+ import { Meta, StoryObj } from '@storybook/react-vite';
2
2
  import { Button } from './index';
3
3
  declare const meta: Meta<typeof Button>;
4
4
  export default meta;
package/dist/components/Button/Button.stories.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Button.stories.d.ts","sourceRoot":"","sources":["../../../lib/components/Button/Button.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAEjC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CAG7B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,MAAM,CAAC,CAAC;AAErC,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAMvB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAC"}
1
+ {"version":3,"file":"Button.stories.d.ts","sourceRoot":"","sources":["../../../lib/components/Button/Button.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAEjC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CAG7B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,MAAM,CAAC,CAAC;AAErC,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAMvB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAC"}
package/dist/components/Button/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { jsx as n } from "react/jsx-runtime";
2
- import '../../assets/index5.css';const o = "_small_zsbft_18", u = "_medium_zsbft_23", b = "_large_zsbft_28", i = "_primary_zsbft_34", y = "_secondary_zsbft_52", d = "_tertiary_zsbft_69", s = {
2
+ import '../../assets/index4.css';const o = "_small_zsbft_18", u = "_medium_zsbft_23", b = "_large_zsbft_28", i = "_primary_zsbft_34", y = "_secondary_zsbft_52", d = "_tertiary_zsbft_69", s = {
3
3
  "ckcl-button": "_ckcl-button_zsbft_1",
4
4
  "x-small": "_x-small_zsbft_13",
5
5
  small: o,
package/dist/components/Copy/Copy.stories.d.ts CHANGED
@@ -1,7 +1,9 @@
1
- import { Meta, StoryObj } from '@storybook/react';
2
- import { Copy } from './index';
3
- declare const meta: Meta<typeof Copy>;
1
+ import { Meta, StoryObj } from '@storybook/react-vite';
2
+ import { CopyText } from './index';
3
+ declare const meta: Meta<typeof CopyText>;
4
4
  export default meta;
5
- type Story = StoryObj<typeof Copy>;
6
- export declare const CopyText: Story;
5
+ type Story = StoryObj<typeof CopyText>;
6
+ export declare const Default: Story;
7
+ export declare const WithCustomIcons: Story;
8
+ export declare const StyledWithClassName: Story;
7
9
  //# sourceMappingURL=Copy.stories.d.ts.map
package/dist/components/Copy/Copy.stories.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Copy.stories.d.ts","sourceRoot":"","sources":["../../../lib/components/Copy/Copy.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAK/B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,IAAI,CAG3B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAGnC,eAAO,MAAM,QAAQ,EAAE,KAetB,CAAC"}
1
+ {"version":3,"file":"Copy.stories.d.ts","sourceRoot":"","sources":["../../../lib/components/Copy/Copy.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAEnC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,QAAQ,CAQ/B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,QAAQ,CAAC,CAAC;AAEvC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC;AAEjC,eAAO,MAAM,eAAe,EAAE,KAM7B,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KAOjC,CAAC"}
package/dist/components/Copy/index.d.ts CHANGED
@@ -1,8 +1,11 @@
1
- interface CopyProps extends React.HTMLAttributes<HTMLSpanElement> {
2
- Icon: React.ReactNode;
3
- size?: "small" | "medium" | "large";
4
- onClick?: (event: React.MouseEvent<HTMLSpanElement>) => void;
1
+ import { default as React } from 'react';
2
+ interface CopyTextProps {
3
+ text: string;
4
+ className?: string;
5
+ icon?: React.ReactNode;
6
+ successIcon?: React.ReactNode;
7
+ onCopied?: (copiedText: string) => void;
5
8
  }
6
- export declare function Copy({ children, Icon, className, size, onClick, ...restProps }: CopyProps): import("react/jsx-runtime").JSX.Element;
9
+ export declare const CopyText: React.FC<CopyTextProps>;
7
10
  export {};
8
11
  //# sourceMappingURL=index.d.ts.map
package/dist/components/Copy/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/Copy/index.tsx"],"names":[],"mappings":"AAEA,UAAU,SAAU,SAAQ,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;IAC/D,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,eAAe,CAAC,KAAK,IAAI,CAAC;CAC9D;AAED,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,IAAI,EACJ,SAAc,EACd,IAAe,EACf,OAAO,EACP,GAAG,SAAS,EACb,EAAE,SAAS,2CAYX"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/Copy/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAInD,UAAU,aAAa;IACrB,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA6C5C,CAAC"}
package/dist/components/Copy/index.js CHANGED
@@ -1,31 +1,45 @@
1
- import { jsxs as e, jsx as i } from "react/jsx-runtime";
2
- import '../../assets/index4.css';const a = "_icon_qj0vq_9", q = "_small_qj0vq_14", r = "_medium_qj0vq_18", t = "_large_qj0vq_22", c = {
3
- "ckcl-copy": "_ckcl-copy_qj0vq_1",
4
- icon: a,
5
- small: q,
6
- medium: r,
7
- large: t
8
- };
9
- function j({
10
- children: s,
11
- Icon: l,
12
- className: o = "",
13
- size: m = "medium",
14
- onClick: n,
15
- ..._
16
- }) {
17
- return /* @__PURE__ */ e(
18
- "div",
1
+ import { jsx as r } from "react/jsx-runtime";
2
+ import * as o from "react";
3
+ import { useState as p, useEffect as h } from "react";
4
+ const g = (e) => /* @__PURE__ */ o.createElement("svg", { width: 20, height: 20, viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ o.createElement("path", { d: "M7.4999 7V5.5C7.4999 5.22386 7.72376 5 7.9999 5H13.9999C14.276 5 14.4999 5.22386 14.4999 5.5V12.5C14.4999 12.7761 14.276 13 13.9999 13H12.4999V14.4995C12.4999 14.7759 12.275 15 11.9965 15H6.00333C5.72529 15 5.5 14.7777 5.5 14.4995L5.5013 7.50044C5.50135 7.22406 5.72632 7 6.00471 7H7.4999ZM6.50121 8L6.50009 14H11.4999V8H6.50121ZM8.4999 7H12.4999V12H13.4999V6H8.4999V7Z", fill: "#0A3CA2" })), m = (e) => /* @__PURE__ */ o.createElement("svg", { width: 20, height: 20, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ o.createElement("path", { d: "M5 13L9 17L19 7", stroke: "#28a745", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" })), u = ({
5
+ text: e,
6
+ className: a = "",
7
+ icon: s = /* @__PURE__ */ r(g, { width: 20, height: 20 }),
8
+ successIcon: l = /* @__PURE__ */ r(m, { width: 20, height: 20 }),
9
+ onCopied: c
10
+ }) => {
11
+ const [t, n] = p(!1), d = async () => {
12
+ try {
13
+ await navigator.clipboard.writeText(e), n(!0), c?.(e);
14
+ } catch (i) {
15
+ console.error("Failed to copy: ", i);
16
+ }
17
+ };
18
+ return h(() => {
19
+ if (t) {
20
+ const i = setTimeout(() => n(!1), 1e3);
21
+ return () => clearTimeout(i);
22
+ }
23
+ }, [t]), /* @__PURE__ */ r(
24
+ "button",
19
25
  {
20
- className: `${o} ${c["ckcl-copy"]} ${c[m]}`,
21
- ..._,
22
- children: [
23
- s,
24
- /* @__PURE__ */ i("span", { className: c.icon, onClick: n, children: l })
25
- ]
26
+ type: "button",
27
+ onClick: d,
28
+ className: a,
29
+ disabled: t,
30
+ style: {
31
+ cursor: "pointer",
32
+ display: "inline-flex",
33
+ alignItems: "center",
34
+ background: "none",
35
+ border: "none",
36
+ padding: 0
37
+ },
38
+ "aria-label": t ? "Copied" : "Copy",
39
+ children: t ? l : s
26
40
  }
27
41
  );
28
- }
42
+ };
29
43
  export {
30
- j as Copy
44
+ u as CopyText
31
45
  };
package/dist/components/Switch/Switch.stories.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { Meta, StoryObj } from '@storybook/react';
1
+ import { Meta, StoryObj } from '@storybook/react-vite';
2
2
  import { Switch } from './index';
3
3
  declare const meta: Meta<typeof Switch>;
4
4
  export default meta;
package/dist/components/Switch/Switch.stories.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Switch.stories.d.ts","sourceRoot":"","sources":["../../../lib/components/Switch/Switch.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAEjC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CAG7B,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,MAAM,CAAC,CAAC;AAErC,eAAO,MAAM,aAAa,EAAE,KAW3B,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAW3B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAY5B,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,KAYnC,CAAC"}
1
+ {"version":3,"file":"Switch.stories.d.ts","sourceRoot":"","sources":["../../../lib/components/Switch/Switch.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AAEjC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CAG7B,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,MAAM,CAAC,CAAC;AAErC,eAAO,MAAM,aAAa,EAAE,KAW3B,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAW3B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAY5B,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,KAYnC,CAAC"}
package/dist/components/Switch/index.js CHANGED
@@ -1,25 +1,25 @@
1
- import { jsx as c, jsxs as i } from "react/jsx-runtime";
2
- import '../../assets/index2.css';const p = "_slider_1utaq_11", s = {
3
- "ckcl-switch-wrapper": "_ckcl-switch-wrapper_1utaq_1",
4
- "ckcl-switch": "_ckcl-switch_1utaq_1",
5
- slider: p
1
+ import { jsx as c, jsxs as p } from "react/jsx-runtime";
2
+ import '../../assets/index2.css';const a = "_slider_1h10p_12", s = {
3
+ "ckcl-switch-wrapper": "_ckcl-switch-wrapper_1h10p_1",
4
+ "ckcl-switch": "_ckcl-switch_1h10p_1",
5
+ slider: a
6
6
  };
7
7
  function n({
8
8
  checked: e,
9
9
  onChange: l,
10
- className: t = "",
11
- disabled: r = !1,
12
- ...a
10
+ className: r = "",
11
+ disabled: i = !1,
12
+ ...t
13
13
  }) {
14
- return /* @__PURE__ */ c("label", { className: `${s["ckcl-switch-wrapper"]} ${t}`, children: /* @__PURE__ */ i("span", { className: `${s["ckcl-switch"]}`, children: [
14
+ return /* @__PURE__ */ c("label", { className: `${s["ckcl-switch-wrapper"]} ${r}`, children: /* @__PURE__ */ p("span", { className: `${s["ckcl-switch"]}`, children: [
15
15
  /* @__PURE__ */ c(
16
16
  "input",
17
17
  {
18
18
  type: "checkbox",
19
19
  checked: e,
20
20
  onChange: l,
21
- disabled: r,
22
- ...a
21
+ disabled: i,
22
+ ...t
23
23
  }
24
24
  ),
25
25
  /* @__PURE__ */ c("span", { className: s.slider })
package/dist/components/Tag/Tag.stories.d.ts CHANGED
@@ -1,11 +1,11 @@
1
- import { Meta, StoryObj } from '@storybook/react';
1
+ import { Meta, StoryObj } from '@storybook/react-vite';
2
2
  import { Tag } from './index';
3
3
  declare const meta: Meta<typeof Tag>;
4
4
  export default meta;
5
5
  type Story = StoryObj<typeof Tag>;
6
6
  export declare const Neutral: Story;
7
- export declare const Error: Story;
7
+ export declare const Danger: Story;
8
8
  export declare const Success: Story;
9
- export declare const Inprogress: Story;
10
- export declare const Alert: Story;
9
+ export declare const Info: Story;
10
+ export declare const Warning: Story;
11
11
  //# sourceMappingURL=Tag.stories.d.ts.map
package/dist/components/Tag/Tag.stories.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Tag.stories.d.ts","sourceRoot":"","sources":["../../../lib/components/Tag/Tag.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,GAAG,EAAE,MAAM,SAAS,CAAC;AAE9B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,GAAG,CAG1B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,GAAG,CAAC,CAAC;AAElC,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAMnB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAOxB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAMjB,CAAC"}
1
+ {"version":3,"file":"Tag.stories.d.ts","sourceRoot":"","sources":["../../../lib/components/Tag/Tag.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAE,GAAG,EAAE,MAAM,SAAS,CAAC;AAE9B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,GAAG,CAG1B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,GAAG,CAAC,CAAC;AAElC,eAAO,MAAM,OAAO,EAAE,KAKrB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAKpB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAKrB,CAAC;AAEF,eAAO,MAAM,IAAI,EAAE,KAKlB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAKnB,CAAC"}
package/dist/components/Tag/index.d.ts CHANGED
@@ -1,11 +1,10 @@
1
- type TagStatus = "TIMEOUT" | "FAILED" | "RUNBOOK_TIMEOUT" | "COMPLETED" | "IN_PROGRESS" | "INITIATED";
2
- type AllStatuses = TagStatus | string;
1
+ type TagVariation = "NEUTRAL" | "DANGER" | "SUCCESS" | "WARNING" | "INFO";
3
2
  interface TagProps extends React.HTMLAttributes<HTMLSpanElement> {
4
- tagStatus: AllStatuses;
3
+ variation: TagVariation;
5
4
  children: React.ReactNode;
6
5
  className?: string;
7
6
  size?: "x-small" | "small" | "medium" | "large";
8
7
  }
9
- export declare function Tag({ tagStatus, children, className, size, ...restProps }: TagProps): import("react/jsx-runtime").JSX.Element;
8
+ export declare function Tag({ variation, children, className, size, ...restProps }: TagProps): import("react/jsx-runtime").JSX.Element;
10
9
  export {};
11
10
  //# sourceMappingURL=index.d.ts.map
package/dist/components/Tag/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/Tag/index.tsx"],"names":[],"mappings":"AAGA,KAAK,SAAS,GACV,SAAS,GACT,QAAQ,GACR,iBAAiB,GACjB,WAAW,GACX,aAAa,GACb,WAAW,CAAC;AAGhB,KAAK,WAAW,GAAG,SAAS,GAAG,MAAM,CAAC;AAGtC,UAAU,QAAS,SAAQ,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;IAC9D,SAAS,EAAE,WAAW,CAAC;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;CACjD;AAYD,wBAAgB,GAAG,CAAC,EAClB,SAAS,EACT,QAAQ,EACR,SAAc,EACd,IAAe,EACf,GAAG,SAAS,EACb,EAAE,QAAQ,2CAyBV"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/components/Tag/index.tsx"],"names":[],"mappings":"AAGA,KAAK,YAAY,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;AAG1E,UAAU,QAAS,SAAQ,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;IAC9D,SAAS,EAAE,YAAY,CAAC;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;CACjD;AAWD,wBAAgB,GAAG,CAAC,EAClB,SAAS,EACT,QAAQ,EACR,SAAc,EACd,IAAe,EACf,GAAG,SAAS,EACb,EAAE,QAAQ,2CAyBV"}
package/dist/components/Tag/index.js CHANGED
@@ -1,40 +1,39 @@
1
- import { jsx as o } from "react/jsx-runtime";
2
- import '../../assets/index.css';const g = "_small_1vgmh_16", n = "_medium_1vgmh_21", u = "_large_1vgmh_26", i = "_neutral_1vgmh_32", v = "_error_1vgmh_39", h = "_success_1vgmh_46", d = "_alert_1vgmh_60", s = {
3
- "ckcl-tag": "_ckcl-tag_1vgmh_1",
4
- "x-small": "_x-small_1vgmh_11",
1
+ import { jsx as _ } from "react/jsx-runtime";
2
+ import '../../assets/index.css';const g = "_small_1xrao_16", m = "_medium_1xrao_21", u = "_large_1xrao_26", x = "_neutral_1xrao_32", i = "_danger_1xrao_39", d = "_success_1xrao_46", f = "_info_1xrao_53", k = "_warning_1xrao_60", s = {
3
+ "ckcl-tag": "_ckcl-tag_1xrao_1",
4
+ "x-small": "_x-small_1xrao_11",
5
5
  small: g,
6
- medium: n,
6
+ medium: m,
7
7
  large: u,
8
- neutral: i,
9
- error: v,
10
- success: h,
11
- "in-progress": "_in-progress_1vgmh_53",
12
- alert: d
13
- }, T = {
14
- TIMEOUT: "error",
15
- FAILED: "error",
16
- RUNBOOK_TIMEOUT: "error",
17
- COMPLETED: "success",
18
- IN_PROGRESS: "in-progress",
19
- INITIATED: "in-progress"
8
+ neutral: x,
9
+ danger: i,
10
+ success: d,
11
+ info: f,
12
+ warning: k
13
+ }, N = {
14
+ NEUTRAL: "neutral",
15
+ DANGER: "danger",
16
+ SUCCESS: "success",
17
+ INFO: "info",
18
+ WARNING: "warning"
20
19
  };
21
- function E({
22
- tagStatus: e,
23
- children: c,
24
- className: _ = "",
25
- size: l = "medium",
26
- ...m
20
+ function $({
21
+ variation: r,
22
+ children: l,
23
+ className: e = "",
24
+ size: n = "medium",
25
+ ...c
27
26
  }) {
28
- const t = T[e] || e || "neutral", a = (r) => r === "x-small" ? "ckcl-body-xs-reg" : r === "small" ? "ckcl-body-sm-reg" : r === "medium" || r === "large" ? "ckcl-body-lg-reg" : "";
29
- return /* @__PURE__ */ o(
27
+ const o = N[r] || r || "neutral", t = (a) => a === "x-small" ? "ckcl-body-xs-reg" : a === "small" ? "ckcl-body-sm-reg" : a === "medium" || a === "large" ? "ckcl-body-lg-reg" : "";
28
+ return /* @__PURE__ */ _(
30
29
  "div",
31
30
  {
32
- className: `${_} ${s["ckcl-tag"]} ${s[t]} ${s[l]} ${a(l)}`,
33
- ...m,
34
- children: c
31
+ className: `${e} ${s["ckcl-tag"]} ${s[o]} ${s[n]} ${t(n)}`,
32
+ ...c,
33
+ children: l
35
34
  }
36
35
  );
37
36
  }
38
37
  export {
39
- E as Tag
38
+ $ as Tag
40
39
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ck-ui/component-library",
3
- "version": "0.0.4",
3
+ "version": "0.1.0",
4
4
  "type": "module",
5
5
  "main": "dist/main.js",
6
6
  "types": "dist/main.d.ts",
@@ -58,6 +58,7 @@
58
58
  "typescript-eslint": "^8.35.1",
59
59
  "vite": "^7.0.4",
60
60
  "vite-plugin-dts": "^4.5.4",
61
- "vite-plugin-lib-inject-css": "^2.2.2"
61
+ "vite-plugin-lib-inject-css": "^2.2.2",
62
+ "vite-plugin-svgr": "^4.3.0"
62
63
  }
63
64
  }
package/dist/assets/index5.css DELETED
@@ -1 +0,0 @@
1
- ._ckcl-button_zsbft_1{font-family:var(--ckcl-font-family-base, "Inter"),sans-serif;display:inline-flex;align-items:center;transition:all .3s ease;cursor:pointer;border-radius:var(--ckcl-spacing-xs, 4px);white-space:nowrap;text-decoration:none}._x-small_zsbft_13{padding:var(--ckcl-spacing-xs, 4px) var(--ckcl-spacing-sm, 8px);height:var(--ckcl-spacing-slg, 20px)}._small_zsbft_18{padding:var(--ckcl-spacing-xs, 4px) var(--ckcl-spacing-sm, 8px);height:var(--ckcl-spacing-lg, 24px)}._medium_zsbft_23{padding:var(--ckcl-spacing-xs, 4px) var(--ckcl-spacing-sm, 8px);height:var(--ckcl-spacing-xl, 28px)}._large_zsbft_28{padding:var(--ckcl-spacing-xs, 4px) var(--ckcl-spacing-sm, 8px);height:var(--ckcl-spacing-2xl, 32px)}._primary_zsbft_34{background-color:var(--ckcl-primary-500, #3A72E4);border:1px solid var(--ckcl-primary-500, #3A72E4);color:var(--ckcl-white, #FFFFFF)}._primary_zsbft_34:hover{background-color:var(--ckcl-primary-600, #1058EC);border:1px solid var(--ckcl-primary-600, #1058EC);color:var(--ckcl-white, #FFFFFF)}._primary_zsbft_34:disabled{background-color:var(--ckcl-black-300, #AAAAAA);color:var(--ckcl-white, #FFFFFF);border-color:var(--ckcl-black-300, #AAAAAA);cursor:not-allowed}._secondary_zsbft_52{background-color:transparent;border:1px solid var(--ckcl-primary-600, #1058EC);color:var(--ckcl-primary-600, #1058EC)}._secondary_zsbft_52:hover{background-color:var(--ckcl-primary-200, #D8E3FA);border:1px solid var(--ckcl-primary-600, #1058EC)}._secondary_zsbft_52:disabled{background-color:var(--ckcl-black-100, #F4F4F4);color:var(--ckcl-black-400, #808080);border-color:var(--ckcl-black-200, #D5D5D5);cursor:not-allowed}._tertiary_zsbft_69{background-color:var(--ckcl-white, #FFFFFF);border:none;color:var(--ckcl-primary-600, #1058EC)}._tertiary_zsbft_69:hover{text-decoration:underline}._tertiary_zsbft_69:disabled{color:var(--ckcl-black-400, #808080);cursor:not-allowed;text-decoration:none}