@liujip0/components 0.0.2 → 0.2.0

package/README.md

@@ -1,3 +1,38 @@
 # @liujip0/components
 
 Just a simple components library for my own personal use!
+
+CSS variables to customize:
+
+| Variable                          | Description                                                                      | Default              |
+| --------------------------------- | -------------------------------------------------------------------------------- | -------------------- |
+| `--text-font-family`              | Text font family                                                                 | `sans-serif`         |
+| `--text-body-size`                | Size of body text                                                                | `1em`                |
+| `--text-h1-size`                  | Size of h1 text                                                                  | `2em`                |
+| `--text-h2-size`                  | Size of h2 text                                                                  | `1.5em`              |
+| `--text-label-size`               | Size of labels for input components                                              | `0.9em`              |
+| `--text-helperText-size`          | Size of helper text for input components                                         | `0.75em`             |
+|                                   |                                                                                  |                      |
+| `--color-primary`                 | Primary theme color                                                              | `blue`               |
+| `--color-primary-contrastText`    | Text color when background color is `--color-primary`                            | `white`              |
+| `--color-secondary`               | Secondary theme color                                                            | `orange`             |
+| `--color-secondary-contrastText`  | Text color when background color is `--color-secondary`                          | `white`              |
+| `--color-background`              | Background color                                                                 | `white`              |
+| `--color-background-contrastText` | Text color when background color is `--color-background`                         | `black`              |
+| `--color-paper`                   | Background color for modals, dialogs, popups, snackbars, etc.                    | `gray`               |
+| `--color-paper-contrastText`      | Text color when background color is `--color-paper`                              | `black`              |
+| `--color-error`                   | Color to indicate errors                                                         | `red`                |
+|                                   |                                                                                  |                      |
+| `--z-index-backdrop`              | z-index of backdrops or overlays                                                 | `99`                 |
+| `--z-index-snackbar`              | z-index of snackbars                                                             | `100`                |
+| `--z-index-modal`                 | z-index of modals, dialogs, popups, etc.                                         | `101`                |
+| `--z-index-tooltip`               | z-index of tooltips                                                              | `102`                |
+|                                   |                                                                                  |                      |
+| `--border-radius`                 | Border radius for buttons, input components, etc.                                | `0`                  |
+| `--border-width`                  | Border width for buttons, input components, etc.                                 | `1px`                |
+| `--input-height`                  | [Only used in the `Counter` component] Calculated height of an `Input` component | `calc(37.6px + 8px)` |
+| `--hover-dim`                     | Filter effect to apply to buttons, etc. on hover                                 | `brightness(0.8)`    |
+|                                   |                                                                                  |                      |
+| `--table-cell-padding`            | Padding for table cells                                                          | `8px`                |
+| `--table-border-width`            | Border width for tables                                                          | `3px`                |
+| `--table-cell-border-width`       | Border width for cells within tables                                             | `2px`                |

package/dist/Input.module-C7oR_KDs.js

@@ -0,0 +1,13 @@
+import './assets/Input.css';const e = "_container_1dgl9_1", t = "_outline_1dgl9_6", l = "_errorOutline_1dgl9_18", r = "_input_1dgl9_22", n = "_inputDisabled_1dgl9_41", _ = "_helperText_1dgl9_53", o = "_helperTextError_1dgl9_60", i = "_label_1dgl9_64", s = {
+  container: e,
+  outline: t,
+  errorOutline: l,
+  input: r,
+  inputDisabled: n,
+  helperText: _,
+  helperTextError: o,
+  label: i
+};
+export {
+  s
+};

package/dist/assets/Backdrop.css

@@ -0,0 +1 @@
+._backdrop_qbjym_1{position:absolute;top:0;left:0;width:100%;height:100%;z-index:var(--z-index-backdrop, var(--z-index-backdrop-fallback));background-color:#00000080;pointer-events:none}

package/dist/assets/Button.css

@@ -1 +1 @@
-._button_7qhy4_1{min-width:64px;padding:6px 16px;border:none;border-radius:var(--border-radius);display:flex;align-items:center;justify-content:center;gap:4px;font-size:1.25rem;font-family:var(--text-font-family);text-transform:uppercase;font-weight:500;line-height:1.75;letter-spacing:.02857em;cursor:pointer}._button_7qhy4_1:hover{filter:var(--hover-dim)}
+._button_y7o2r_1{min-width:64px;padding:6px 16px;border:none;border-radius:var(--border-radius, var(--border-radius-fallback));display:flex;align-items:center;justify-content:center;gap:4px;font-size:1.25rem;font-family:var(--text-font-family, var(--text-font-family-fallback));text-transform:uppercase;font-weight:500;line-height:1.75;letter-spacing:.02857em;cursor:pointer}._button_y7o2r_1:hover{filter:var(--hover-dim, var(--hover-dim-fallback))}

package/dist/assets/Counter.css

@@ -0,0 +1 @@
+._container_12kgw_1{display:flex;align-items:flex-end}._button_12kgw_6{height:var(--input-height, var(--input-height-fallback));width:var(--input-height, var(--input-height-fallback));min-width:0;min-height:0;background-color:var(--color-primary, var(--color-primary-fallback));color:var( --color-primary-contrastText, var(--color-primary-contrastText-fallback) );border:none}._buttonDisabled_12kgw_19{background-color:color-mix(in srgb,var(--color-primary, var(--color-primary-fallback)) 50%,#888);cursor:default}._buttonDisabled_12kgw_19:hover{filter:none}._input_12kgw_31{flex:1}

package/dist/assets/Dialog.css

@@ -0,0 +1 @@
+._screenDarken_9wfqy_1{position:fixed;top:0;left:0;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;background-color:#00000080;z-index:var(--z-index-modal, var(--z-index-modal-fallback))}._dialog_9wfqy_16{max-width:80vw;max-height:80vh;display:flex;flex-direction:column;padding:24px;background-color:var(--color-paper, var(--color-paper-fallback));border-radius:var(--border-radius, var(--border-radius-fallback));border:var(--border-width, var(--border-width-fallback)) solid var(--color-primary, var(--color-primary-fallback))}._dialogTitle_9wfqy_29{margin-bottom:16px;font-family:var(--text-font-family, var(--text-font-family-fallback));font-size:var(--text-h2-size, var(--text-h2-size-fallback))}._dialogContent_9wfqy_36{flex:1;overflow-y:auto}._dialogActions_9wfqy_41{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}

package/dist/assets/Divider.css

@@ -0,0 +1 @@
+._divider_rubc3_1{border-width:.5px;border-style:solid;border-color:var(--color-primary, var(--color-primary-fallback));margin:8px}._horizontalDivider_rubc3_8{width:100%;height:0}._verticalDivider_rubc3_13{height:100%;width:0}

package/dist/assets/IconButton.css

@@ -1 +1 @@
-._button_rs8jj_1{display:flex;align-items:center;justify-content:center;padding:6px;border:none;color:var(--color-primary);background-color:var(--color-background);cursor:pointer;clip-path:circle(50%)}._button_rs8jj_1:hover{filter:var(--hover-dim)}
+._button_180ek_1{display:flex;align-items:center;justify-content:center;padding:6px;border:none;color:var(--color-primary, var(--color-primary-fallback));background-color:var(--color-background, var(--color-background-fallback));cursor:pointer;clip-path:circle(50%)}._button_180ek_1:hover{filter:var(--hover-dim, var(--hover-dim-fallback))}

package/dist/assets/Input.css

@@ -0,0 +1 @@
+._container_1dgl9_1{display:flex;flex-direction:column}._outline_1dgl9_6{display:flex;padding:4px 8px;gap:4px;align-items:center;width:100%;border-width:var(--border-width, var(--border-width-fallback));border-style:solid;border-color:var(--color-primary, var(--color-primary-fallback));border-radius:var(--border-radius, var(--border-radius-fallback))}._errorOutline_1dgl9_18{border-color:var(--color-error, var(--color-error-fallback))}._input_1dgl9_22{min-width:1em;flex:1;padding:6px;width:100%;height:100%;border:none;background-color:transparent;color:var( --color-background-contrastText, var(--color-background-contrastText-fallback) );font-family:var(--text-font-family, var(--text-font-family-fallback));font-size:var(--text-body-size, var(--text-body-size-fallback))}._input_1dgl9_22:focus{outline:none}._inputDisabled_1dgl9_41{color:color-mix(in srgb,var( --color-background-contrastText, var(--color-background-contrastText-fallback) ) 50%,#888)}._helperText_1dgl9_53{margin:4px 8px;font-family:var(--text-font-family, var(--text-font-family-fallback));font-size:var(--text-helperText-size, var(--text-helperText-size-fallback));color:var(--color-primary, var(--color-primary-fallback))}._helperTextError_1dgl9_60{color:var(--color-error, var(--color-error-fallback))}._label_1dgl9_64{font-family:var(--text-font-family, var(--text-font-family-fallback));font-size:var(--text-label-size, var(--text-label-size-fallback))}

package/dist/assets/Radio.css

@@ -0,0 +1 @@
+._container_12u6r_1{display:flex;align-items:center;gap:8px}._label_12u6r_7{font-family:var(--text-font-family, var(--text-font-family-fallback));font-size:var(--text-body-size, var(--text-body-size-fallback));cursor:pointer}

package/dist/assets/RadioGroup.css

@@ -0,0 +1 @@
+._container_1ygqk_1{display:flex;flex-direction:column}._outline_1ygqk_6{display:flex;flex-direction:column;gap:4px}._label_1ygqk_12{font-family:var(--text-font-family, var(--text-font-family-fallback));font-size:var(--text-label-size, var(--text-label-size-fallback))}._helperText_1ygqk_17{margin:4px 8px;font-family:var(--text-font-family, var(--text-font-family-fallback));font-size:var(--text-helperText-size, var(--text-helperText-size-fallback));color:var(--color-primary, var(--color-primary-fallback))}._helperTextError_1ygqk_24{color:var(--color-error, var(--color-error-fallback))}

package/dist/assets/Select.css

@@ -0,0 +1 @@
+._container_14cji_1{display:flex;flex-direction:column}._outline_14cji_6{display:flex;padding:4px 8px;gap:4px;align-items:center;width:100%;border-width:1px;border-style:solid;border-color:var(--color-primary, var(--color-primary-fallback));border-radius:var(--border-radius, var(--border-radius-fallback))}._errorOutline_14cji_18{border-color:var(--color-error, var(--color-error-fallback))}._select_14cji_22{min-width:1em;flex:1;padding:6px;border:none;background-color:transparent;color:var( --color-background-contrastText, var(--color-background-contrastText-fallback) );font-family:var(--text-font-family, var(--text-font-family-fallback));font-size:var(--text-body-size, var(--text-body-size-fallback))}._select_14cji_22:focus{outline:none}._selectDisabled_14cji_39{color:color-mix(in srgb,var( --color-background-contrastText, var(--color-background-contrastText-fallback) ) 50%,#888)}._helperText_14cji_51{margin:4px 8px;font-family:var(--text-font-family, var(--text-font-family-fallback));font-size:var(--text-helperText-size, var(--text-helperText-size-fallback));color:var(--color-primary, var(--color-primary-fallback))}._helperTextError_14cji_58{color:var(--color-error, var(--color-error-fallback))}._label_14cji_62{font-family:var(--text-font-family, var(--text-font-family-fallback));font-size:var(--text-label-size, var(--text-label-size-fallback))}

package/dist/assets/Snackbar.css

@@ -0,0 +1 @@
+._snackbar_tl00m_1{position:fixed;bottom:16px;left:16px;display:flex;gap:16px;padding:8px 16px;align-items:center;max-width:500px;z-index:var(--z-index-snackbar, var(--z-index-snackbar-fallback));background-color:var(--color-paper, var(--color-paper-fallback));border:var(--border-width, var(--border-width-fallback)) solid var(--color-primary, var(--color-primary-fallback));border-radius:var(--border-radius, var(--border-radius-fallback))}._message_tl00m_18{font-family:var(--text-font-family, var(--text-font-family-fallback));font-size:var(--text-label-size, var(--text-label-size-fallback));color:var( --color-paper-contrastText, var(--color-paper-contrastText-fallback) )}

package/dist/assets/Tab.css

@@ -0,0 +1 @@
+._tab_1m0oo_1{padding:.5em;cursor:pointer;color:var(--color-primary, var(--color-primary-fallback));font-family:var(--text-font-family, var(--text-font-family-fallback));font-size:var(--text-body-size, var(--text-body-size-fallback));text-transform:uppercase;font-weight:500;background-color:var(--color-background, var(--color-background-fallback))}._tab_1m0oo_1:hover{filter:var(--hover-dim, var(--hover-dim-fallback))}._activeTab_1m0oo_15{font-weight:700;border-bottom:4px solid var(--color-primary, var(--color-primary-fallback))}

package/dist/assets/TabBar.css

@@ -0,0 +1 @@
+._tabBar_1oym3_1{display:flex;width:100%}

package/dist/assets/Table.css

@@ -0,0 +1 @@
+._table_10gvy_1{border-collapse:separate;border:var(--table-border-width, var(--table-border-width-fallback)) solid var(--color-primary, var(--color-primary-fallback));border-spacing:0}._tableHead_10gvy_8{position:sticky;top:var(--table-cell-border-width, var(--table-cell-border-width-fallback));z-index:1;background-color:var(--color-background, var(--color-background-fallback));outline:var( --table-cell-border-width, var(--table-cell-border-width-fallback) ) solid var(--color-primary, var(--color-primary-fallback))}._th_10gvy_21{padding:var(--table-cell-padding, var(--table-cell-padding-fallback));font-family:var(--text-font-family, var(--text-font-family-fallback));font-size:var(--text-body-size, var(--text-body-size-fallback));font-weight:700;border-style:solid;border-color:var(--color-primary, var(--color-primary-fallback));border-width:var(--table-border-width, var(--table-border-width-fallback)) var(--table-cell-border-width, var(--table-cell-border-width-fallback))}._td_10gvy_33{padding:var(--table-cell-padding, var(--table-cell-padding-fallback));font-family:var(--text-font-family, var(--text-font-family-fallback));font-size:var(--text-body-size, var(--text-body-size-fallback));border:var( --table-cell-border-width, var(--table-cell-border-width-fallback) ) solid var(--color-primary, var(--color-primary-fallback))}

package/dist/assets/Tabs.css

@@ -0,0 +1 @@
+._container_1q694_1{display:flex;flex-direction:column}._contentContainer_1q694_6{flex-grow:1}

package/dist/assets/ToggleButton.css

@@ -1 +1 @@
-._buttonFalse_1ssvl_1{color:var(--color-primary);border:var(--button-border-width) solid var(--color-primary);background-color:var(--color-background)}._buttonTrue_1ssvl_7{color:var(--color-primary-contrastText);border:none;background-color:var(--color-primary)}
+._buttonFalse_1ed44_1{color:var(--color-primary, var(--color-primary-fallback));border:var(--border-width, var(--border-width-fallback)) solid var(--color-primary, var(--color-primary-fallback));background-color:var(--color-background, var(--color-background-fallback))}._buttonTrue_1ed44_8{color:var( --color-primary-contrastText, var(--color-primary-contrastText-fallback) );border:none;background-color:var(--color-primary, var(--color-primary-fallback))}

package/dist/assets/ToggleButtonGroup.css

@@ -1 +1 @@
-._container_12l5n_1{display:flex;flex-direction:column}._outline_12l5n_6{display:flex;gap:4px}._label_12l5n_11{font-family:var(--text-font-family);font-size:var(--text-label-size)}._helperText_12l5n_16{margin:4px 8px;font-family:var(--text-font-family);font-size:.75em;color:var(--color-primary)}._helperTextError_12l5n_23{color:var(--color-error)}
+._container_1ngm3_1{display:flex;flex-direction:column}._outline_1ngm3_6{display:flex;gap:4px}._label_1ngm3_11{font-family:var(--text-font-family, var(--text-font-family-fallback));font-size:var(--text-label-size, var(--text-label-size-fallback))}._helperText_1ngm3_16{margin:4px 8px;font-family:var(--text-font-family, var(--text-font-family-fallback));font-size:var(--text-helperText-size, var(--text-helperText-size-fallback));color:var(--color-primary, var(--color-primary-fallback))}._helperTextError_1ngm3_23{color:var(--color-error)}

package/dist/assets/Tooltip.css

@@ -0,0 +1 @@
+._container_147qb_1{display:inline;position:static}._tooltipContainer_147qb_7{position:fixed;transform:translate(-50%)}._tooltip_147qb_7{position:absolute;padding:4px;left:-50%;background-color:#000;opacity:.8;z-index:var(--z-index-tooltip, var(--z-index-tooltip-fallback));border-radius:var(--border-radius, var(--border-radius-fallback));font-size:var(--text-label-size)}._tooltip_147qb_7:after{content:"";position:absolute}

package/dist/assets/main.css

@@ -0,0 +1 @@
+:root{--text-font-family-fallback: sans-serif;--text-body-size-fallback: 1em;--text-h1-size-fallback: 2em;--text-h2-size-fallback: 1.5em;--text-label-size-fallback: .9em;--text-helperText-size-fallback: .75em;--color-primary-fallback: blue;--color-primary-contrastText-fallback: white;--color-secondary-fallback: orange;--color-secondary-contrastText-fallback: white;--color-background-fallback: white;--color-background-contrastText-fallback: black;--color-paper-fallback: gray;--color-paper-contrastText-fallback: black;--color-error-fallback: red;--z-index-backdrop-fallback: 99;--z-index-snackbar-fallback: 100;--z-index-modal-fallback: 101;--z-index-tooltip-fallback: 102;--border-radius-fallback: 0;--border-width-fallback: 1px;--input-height-fallback: 45.6px ;--hover-dim-fallback: brightness(.8);--table-cell-padding-fallback: 8px;--table-border-width-fallback: 3px;--table-cell-border-width-fallback: 2px}.material-symbols-outlined{font-variation-settings:"FILL" 1}

package/dist/components/Backdrop/Backdrop.d.ts

@@ -0,0 +1,6 @@
+type BackdropProps = {
+    open: boolean;
+    onClose?: () => void;
+};
+export declare function Backdrop({ open, onClose }: BackdropProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Backdrop/Backdrop.js

@@ -0,0 +1,18 @@
+import { jsx as c, Fragment as a } from "react/jsx-runtime";
+import '../../assets/Backdrop.css';const t = "_backdrop_qbjym_1", p = {
+  backdrop: t
+};
+function k({ open: o, onClose: r }) {
+  return o ? /* @__PURE__ */ c(
+    "div",
+    {
+      onClick: () => {
+        r && r();
+      },
+      className: p.backdrop
+    }
+  ) : /* @__PURE__ */ c(a, {});
+}
+export {
+  k as Backdrop
+};

package/dist/components/Button/Button.js

@@ -1,13 +1,13 @@
 import { jsx as s } from "react/jsx-runtime";
-import '../../assets/Button.css';const b = "_button_7qhy4_1", r = {
-  button: b
+import '../../assets/Button.css';const r = "_button_y7o2r_1", b = {
+  button: r
 };
 function e({ children: t, className: o, ref: n, ...u }) {
   return /* @__PURE__ */ s(
     "button",
     {
       ref: n,
-      className: r.button + " " + (o || ""),
+      className: b.button + " " + (o || ""),
       ...u,
       children: t
     }

package/dist/components/Button/IconButton/IconButton.js

@@ -1,17 +1,17 @@
-import { jsx as s } from "react/jsx-runtime";
-import '../../../assets/IconButton.css';const u = "_button_rs8jj_1", r = {
-  button: u
+import { jsx as u } from "react/jsx-runtime";
+import '../../../assets/IconButton.css';const s = "_button_180ek_1", b = {
+  button: s
 };
-function c({ children: t, className: o, ...n }) {
-  return /* @__PURE__ */ s(
+function e({ children: t, className: o, ...n }) {
+  return /* @__PURE__ */ u(
     "button",
     {
-      className: r.button + " " + (o || ""),
+      className: b.button + " " + (o || ""),
       ...n,
       children: t
     }
   );
 }
 export {
-  c as IconButton
+  e as IconButton
 };

package/dist/components/Button/ToggleButton/ToggleButton.js

@@ -1,32 +1,32 @@
-import { jsx as a } from "react/jsx-runtime";
-import { Button as b } from "../Button.js";
-import '../../../assets/ToggleButton.css';const C = "_buttonFalse_1ssvl_1", _ = "_buttonTrue_1ssvl_7", e = {
+import { jsx as b } from "react/jsx-runtime";
+import { Button as s } from "../Button.js";
+import '../../../assets/ToggleButton.css';const C = "_buttonFalse_1ed44_1", d = "_buttonTrue_1ed44_8", e = {
   buttonFalse: C,
-  buttonTrue: _
+  buttonTrue: d
 };
-function m({
+function g({
   value: n,
   children: o,
-  className: l,
-  classNameTrue: u,
-  classNameFalse: i,
-  disabled: s,
-  ref: c,
+  className: u,
+  classNameTrue: i,
+  classNameFalse: l,
+  disabled: c,
+  ref: a,
   ...t
 }) {
-  return /* @__PURE__ */ a(
-    b,
+  return /* @__PURE__ */ b(
+    s,
     {
-      ref: c,
-      className: (("selected" in t ? t.selected : n) ? e.buttonTrue + " " + (u || "") : e.buttonFalse + " " + (i || "")) + " " + (l || ""),
+      ref: a,
+      className: (("selected" in t ? t.selected : n) ? e.buttonTrue + " " + (i || "") : e.buttonFalse + " " + (l || "")) + " " + (u || ""),
       onClick: () => {
         "onChange" in t && t.onChange !== void 0 ? t.onChange(!n) : "onClick" in t && t.onClick !== void 0 && t.onClick();
       },
-      disabled: s,
+      disabled: c,
       children: o
     }
   );
 }
 export {
-  m as ToggleButton
+  g as ToggleButton
 };

package/dist/components/Button/ToggleButton/ToggleButtonGroup.js

@@ -1,14 +1,14 @@
-import { jsxs as u, jsx as l } from "react/jsx-runtime";
-import n from "react";
-import '../../../assets/ToggleButtonGroup.css';const m = "_container_12l5n_1", x = "_outline_12l5n_6", h = "_label_12l5n_11", T = "_helperText_12l5n_16", E = "_helperTextError_12l5n_23", r = {
-  container: m,
+import { jsxs as _, jsx as n } from "react/jsx-runtime";
+import t from "react";
+import '../../../assets/ToggleButtonGroup.css';const u = "_container_1ngm3_1", x = "_outline_1ngm3_6", h = "_label_1ngm3_11", T = "_helperText_1ngm3_16", g = "_helperTextError_1ngm3_23", r = {
+  container: u,
   outline: x,
   label: h,
   helperText: T,
-  helperTextError: E
+  helperTextError: g
 };
-function v({
-  value: t,
+function f({
+  value: l,
   onChange: o,
   children: c,
   label: s,
@@ -16,16 +16,16 @@ function v({
   helperText: p,
   className: a
 }) {
-  const _ = n.Children.map(c, (e) => n.isValidElement(e) ? n.cloneElement(e, {
-    selected: t === e.props.value,
+  const m = t.Children.map(c, (e) => t.isValidElement(e) ? t.cloneElement(e, {
+    selected: l === e.props.value,
     onClick: () => {
-      t === e.props.value ? o("") : o(e.props.value);
+      l === e.props.value ? o("") : o(e.props.value);
     }
   }) : e);
-  return /* @__PURE__ */ u("div", { className: r.container + " " + (a || ""), children: [
-    s && /* @__PURE__ */ l("p", { className: r.label, children: s }),
-    /* @__PURE__ */ l("div", { className: r.outline, children: _ }),
-    p && /* @__PURE__ */ l(
+  return /* @__PURE__ */ _("div", { className: r.container + " " + (a || ""), children: [
+    s && /* @__PURE__ */ n("p", { className: r.label, children: s }),
+    /* @__PURE__ */ n("div", { className: r.outline, children: m }),
+    p && /* @__PURE__ */ n(
       "p",
       {
         className: r.helperText + " " + (i ? r.helperTextError : ""),
@@ -35,5 +35,5 @@ function v({
   ] });
 }
 export {
-  v as ToggleButtonGroup
+  f as ToggleButtonGroup
 };

package/dist/components/Dialog/Dialog.d.ts

@@ -0,0 +1,19 @@
+type DialogProps = {
+    open: boolean;
+    onClose?: () => void;
+    children?: React.ReactNode;
+};
+export declare function Dialog({ open, onClose, children }: DialogProps): import("react/jsx-runtime").JSX.Element;
+type DialogTitleProps = {
+    children: React.ReactNode;
+};
+export declare function DialogTitle({ children }: DialogTitleProps): import("react/jsx-runtime").JSX.Element;
+type DialogContentProps = {
+    children: React.ReactNode;
+};
+export declare function DialogContent({ children }: DialogContentProps): import("react/jsx-runtime").JSX.Element;
+type DialogActionsProps = {
+    children: React.ReactNode;
+};
+export declare function DialogActions({ children }: DialogActionsProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Dialog/Dialog.js

@@ -0,0 +1,44 @@
+import { jsx as n, Fragment as l } from "react/jsx-runtime";
+import '../../assets/Dialog.css';const s = "_screenDarken_9wfqy_1", c = "_dialog_9wfqy_16", g = "_dialogTitle_9wfqy_29", r = "_dialogContent_9wfqy_36", d = "_dialogActions_9wfqy_41", i = {
+  screenDarken: s,
+  dialog: c,
+  dialogTitle: g,
+  dialogContent: r,
+  dialogActions: d
+};
+function f({ open: o, onClose: t, children: a }) {
+  return o ? /* @__PURE__ */ n(
+    "div",
+    {
+      className: i.screenDarken,
+      onClick: () => {
+        t && t();
+      },
+      children: /* @__PURE__ */ n(
+        "div",
+        {
+          className: i.dialog,
+          onClick: (e) => {
+            e.stopPropagation();
+          },
+          children: a
+        }
+      )
+    }
+  ) : /* @__PURE__ */ n(l, {});
+}
+function m({ children: o }) {
+  return /* @__PURE__ */ n("h2", { className: i.dialogTitle, children: o });
+}
+function u({ children: o }) {
+  return /* @__PURE__ */ n("div", { className: i.dialogContent, children: o });
+}
+function D({ children: o }) {
+  return /* @__PURE__ */ n("div", { className: i.dialogActions, children: o });
+}
+export {
+  f as Dialog,
+  D as DialogActions,
+  u as DialogContent,
+  m as DialogTitle
+};

package/dist/components/Divider/Divider.d.ts

@@ -0,0 +1,5 @@
+type DividerProps = {
+    orientation: "horizontal" | "vertical";
+};
+export declare function Divider({ orientation }: DividerProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Divider/Divider.js

@@ -0,0 +1,17 @@
+import { jsx as e } from "react/jsx-runtime";
+import '../../assets/Divider.css';const d = "_divider_rubc3_1", v = "_horizontalDivider_rubc3_8", t = "_verticalDivider_rubc3_13", i = {
+  divider: d,
+  horizontalDivider: v,
+  verticalDivider: t
+};
+function c({ orientation: r }) {
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      className: i.divider + " " + (i[r] + "Divider")
+    }
+  );
+}
+export {
+  c as Divider
+};

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

@@ -0,0 +1,9 @@
+type CheckboxProps = {
+    value: boolean;
+    onChange: (value: boolean) => void;
+    id: string;
+    label?: string | React.ReactNode;
+    className?: string;
+};
+export declare function Checkbox({ value, onChange, id, label, className, }: CheckboxProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Input/Checkbox/Checkbox.js

@@ -0,0 +1,51 @@
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import { IconButton as i } from "../../Button/IconButton/IconButton.js";
+import '../../../assets/Radio.css';const h = "_container_12u6r_1", m = "_label_12u6r_7", r = {
+  container: h,
+  label: m
+};
+function _({
+  value: c,
+  onChange: n,
+  id: l,
+  label: o,
+  className: a
+}) {
+  return /* @__PURE__ */ t("div", { className: r.container, children: [
+    /* @__PURE__ */ t(
+      i,
+      {
+        className: a,
+        onClick: () => {
+          n(!c);
+        },
+        children: [
+          c ? /* @__PURE__ */ e("span", { className: "material-symbols-outlined", children: "check_box" }) : /* @__PURE__ */ e("span", { className: "material-symbols-outlined", children: "check_box_outline_blank" }),
+          /* @__PURE__ */ e(
+            "input",
+            {
+              type: "checkbox",
+              id: l,
+              checked: c,
+              onChange: (s) => {
+                n(s.currentTarget.checked);
+              },
+              hidden: !0
+            }
+          )
+        ]
+      }
+    ),
+    o && /* @__PURE__ */ e(
+      "label",
+      {
+        htmlFor: l,
+        className: r.label,
+        children: o
+      }
+    )
+  ] });
+}
+export {
+  _ as Checkbox
+};

package/dist/components/Input/Counter/Counter.d.ts

@@ -0,0 +1,11 @@
+type CounterProps = {
+    value: number;
+    id: string;
+    increment: () => void;
+    decrement: () => void;
+    label: string;
+    max?: number;
+    disabled?: boolean;
+};
+export declare function Counter({ value, id, increment, decrement, label, max, disabled, }: CounterProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Input/Counter/Counter.js

@@ -0,0 +1,57 @@
+import { jsxs as u, jsx as o } from "react/jsx-runtime";
+import { Button as e } from "../../Button/Button.js";
+import { Input as m } from "../Input.js";
+import '../../../assets/Counter.css';const b = "_container_12kgw_1", p = "_button_12kgw_6", _ = "_buttonDisabled_12kgw_19", d = "_input_12kgw_31", t = {
+  container: b,
+  button: p,
+  buttonDisabled: _,
+  input: d
+};
+function h({
+  value: s,
+  id: c,
+  increment: r,
+  decrement: a,
+  label: l,
+  max: i,
+  disabled: n = !1
+}) {
+  return /* @__PURE__ */ u("div", { className: t.container, children: [
+    /* @__PURE__ */ o(
+      e,
+      {
+        className: t.button + " " + (n ? t.buttonDisabled : ""),
+        onClick: () => {
+          s > 0 && a();
+        },
+        disabled: n,
+        children: /* @__PURE__ */ o("span", { className: "material-symbols-outlined", children: "remove" })
+      }
+    ),
+    /* @__PURE__ */ o(
+      m,
+      {
+        id: c,
+        value: s,
+        label: l,
+        disabled: n,
+        className: t.input,
+        type: "number"
+      }
+    ),
+    /* @__PURE__ */ o(
+      e,
+      {
+        className: t.button + " " + (n ? t.buttonDisabled : ""),
+        onClick: () => {
+          (i === void 0 || s < i) && r();
+        },
+        disabled: n,
+        children: /* @__PURE__ */ o("span", { className: "material-symbols-outlined", children: "add" })
+      }
+    )
+  ] });
+}
+export {
+  h as Counter
+};

package/dist/components/Input/Input.d.ts

@@ -0,0 +1,17 @@
+type InputProps = {
+    value: string | number;
+    onChange?: (event: string) => void;
+    type?: "text" | "password" | "email" | "number" | "search";
+    id: string;
+    onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+    startIcon?: React.ReactNode;
+    endIcon?: React.ReactNode;
+    placeholder?: string;
+    label?: string;
+    error?: boolean;
+    helperText?: string;
+    disabled?: boolean;
+    className?: string;
+};
+export declare function Input({ value, onChange, type, id, onKeyDown, startIcon, endIcon, placeholder, label, error, helperText, disabled, className, }: InputProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Input/Input.js

@@ -0,0 +1,63 @@
+import { jsxs as c, jsx as r } from "react/jsx-runtime";
+import { s as e } from "../../Input.module-C7oR_KDs.js";
+function j({
+  value: m,
+  onChange: t,
+  type: o = "text",
+  id: l,
+  onKeyDown: u,
+  startIcon: p,
+  endIcon: h,
+  placeholder: x,
+  label: s,
+  error: n,
+  helperText: a,
+  disabled: i,
+  className: N
+}) {
+  return /* @__PURE__ */ c("div", { className: e.container + " " + (N || ""), children: [
+    s && /* @__PURE__ */ r(
+      "label",
+      {
+        htmlFor: l,
+        className: e.label,
+        children: s
+      }
+    ),
+    /* @__PURE__ */ c(
+      "div",
+      {
+        className: e.outline + " " + (n ? e.errorOutline : ""),
+        children: [
+          p,
+          /* @__PURE__ */ r(
+            "input",
+            {
+              className: e.input + " " + (i ? e.inputDisabled : ""),
+              value: m,
+              onChange: (d) => {
+                t && t(d.currentTarget.value);
+              },
+              type: o,
+              id: l,
+              onKeyDown: u,
+              placeholder: x,
+              disabled: i
+            }
+          ),
+          h
+        ]
+      }
+    ),
+    a && /* @__PURE__ */ r(
+      "p",
+      {
+        className: e.helperText + " " + (n ? e.helperTextError : ""),
+        children: a
+      }
+    )
+  ] });
+}
+export {
+  j as Input
+};

package/dist/components/Input/Radio/Radio.d.ts

@@ -0,0 +1,10 @@
+export type RadioProps = {
+    selected?: boolean;
+    onChange?: (value: boolean) => void;
+    id: string;
+    value: string;
+    name?: string;
+    label?: string | React.ReactNode;
+    className?: string;
+};
+export declare function Radio({ selected, onChange, name, id, label, className, }: RadioProps): import("react/jsx-runtime").JSX.Element;