@amoa/casting 0.1.3 → 0.1.4

package/dist/packages/ingots/src/select/index.js

@@ -0,0 +1,155 @@
+import * as React from 'react';
+import { build } from '../../../forge/src/classes.js';
+import { j as jsxRuntimeExports } from '../../../../_virtual/jsx-runtime.js';
+import Down from '../../../runes/src/paths/chevron/down.js';
+import Text from '../text/index.js';
+import Card from './card/index.js';
+import Options from './options/index.js';
+import Option from './option/index.js';
+import Content from './content/index.js';
+import styles from './index.module.css.js';
+
+const Select = ({
+  className,
+  children,
+  options,
+  value: defaultValue,
+  onChange,
+  small,
+  reset,
+  placeholder = "Choisissez",
+  required = true,
+  icon: Icon,
+  formatter,
+  multiple,
+  selection,
+  onSearch,
+  add,
+  ...props
+}) => {
+  const ref = React.useRef();
+  const [selected, setSelected] = React.useState([]);
+  const [open, setOpen] = React.useState(false);
+  const [value, setValue] = React.useState(defaultValue);
+  const [title, setTitle] = React.useState();
+  const classes = build(styles.root, className, {
+    [styles.small]: small,
+    [styles.open]: open
+  });
+  const Chevron = Icon ? Icon : Down;
+  const Add = add;
+  const onClick = () => {
+    setOpen(prev => !prev);
+    setValue();
+  };
+  const onOptionClick = (value, title) => {
+    if (multiple) {
+      return setSelected(prev => {
+        const exists = prev.some(item => item.value === value);
+        return exists ? prev.filter(item => item.value !== value) : [...prev, {
+          value,
+          title
+        }];
+      });
+    }
+    setValue(value);
+    setOpen(false);
+  };
+  const onDelete = item => {
+    setSelected(prev => prev.filter(({
+      value
+    }) => value !== item));
+  };
+  const findTitle = key => {
+    if (!Array.isArray(options)) return;
+    const flat = options.flatMap(({
+      suboptions,
+      ...opt
+    }) => suboptions || [opt]);
+    const {
+      title = ""
+    } = flat.find(({
+      value
+    }) => value === key) || {};
+    setTitle(title || key);
+  };
+  React.useEffect(() => {
+    if (reset) {
+      setSelected([]);
+      setValue();
+    }
+  }, [reset]);
+  React.useEffect(() => {
+    if (typeof onChange !== "function") return;
+    const selection = multiple ? selected : value;
+    findTitle(value);
+    onChange(selection);
+  }, [value, selected, multiple]);
+  React.useEffect(() => {
+    if (defaultValue) {
+      setValue(defaultValue);
+      findTitle(defaultValue);
+    }
+  }, [defaultValue]);
+  return /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+    className: classes,
+    children: [/*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+      className: styles.container,
+      ref: ref,
+      children: [/*#__PURE__*/jsxRuntimeExports.jsx("div", {
+        onMouseDown: onClick,
+        children: /*#__PURE__*/jsxRuntimeExports.jsx(Text, {
+          className: styles.input,
+          Icon: Chevron,
+          value: title,
+          placeholder: placeholder,
+          small: small,
+          reset: reset,
+          onChange: onSearch,
+          readOnly: !onSearch,
+          required: true,
+          ...props,
+          children: children
+        })
+      }), /*#__PURE__*/jsxRuntimeExports.jsx(Options, {
+        open: open,
+        setOpen: setOpen,
+        container: ref,
+        children: /*#__PURE__*/jsxRuntimeExports.jsxs("ul", {
+          className: styles.options,
+          role: "listbox",
+          children: [!multiple && !required && /*#__PURE__*/jsxRuntimeExports.jsx(Option, {
+            title: placeholder,
+            onOptionClick: onOptionClick,
+            small: small,
+            value: ""
+          }), options.length ? /*#__PURE__*/jsxRuntimeExports.jsx(Content, {
+            options: options,
+            multiple: multiple,
+            small: small,
+            onOptionClick: onOptionClick,
+            formatter: formatter,
+            selected: selected
+          }) : /*#__PURE__*/jsxRuntimeExports.jsx(Option, {
+            title: "Aucun r\xE9sultat",
+            small: small
+          }), !!onSearch && Add && /*#__PURE__*/jsxRuntimeExports.jsx(Add, {
+            onClick: onClick
+          })]
+        })
+      })]
+    }), !!selected.length && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+      className: styles.list,
+      children: selected.map((item, index) => {
+        return /*#__PURE__*/jsxRuntimeExports.jsx(Card, {
+          onDelete: onDelete,
+          ...selection,
+          ...item,
+          small: small
+        }, `selected-${index}`);
+      })
+    })]
+  });
+};
+
+export { Select as default };

package/dist/packages/ingots/src/select/index.module.css.js

@@ -0,0 +1,7 @@
+import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".index-module_root__HNCs9 {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  align-items: flex-start;\n}\n\n.index-module_container__hK6Yp {\n  position: relative;\n  display: flex;\n  width: 100%;\n  cursor: pointer;\n}\n\n.index-module_container__hK6Yp > * {\n  width: 100%;\n}\n\n.index-module_input__sWJnB input {\n  cursor: pointer;\n}\n\n.index-module_open__f4HTz .index-module_input__sWJnB input {\n  border-radius: 8px 8px 0 0;\n}\n\n.index-module_input__sWJnB svg {\n  color: var(--tertiary-text);\n  height: 20px;\n  width: 20px;\n  transform: translateY(-50%) scaleY(1);\n  transition: all var(--transition-short);\n}\n\n.index-module_open__f4HTz .index-module_input__sWJnB svg {\n  transform: translateY(-50%) scaleY(-1);\n  transition: all var(--transition-short);\n}\n\n.index-module_small__3EGJs .index-module_input__sWJnB svg {\n  height: 16px;\n  width: 16px;\n}\n\n.index-module_options__6mL8F {\n  display: flex;\n  flex-direction: column;\n  border-radius: 0 0 8px 8px;\n  width: 100%;\n}\n\n.index-module_list__Y6Tk4 {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 4px;\n  margin-top: 4px;\n}\n";
+var styles = {"root":"index-module_root__HNCs9","container":"index-module_container__hK6Yp","input":"index-module_input__sWJnB","open":"index-module_open__f4HTz","small":"index-module_small__3EGJs","options":"index-module_options__6mL8F","list":"index-module_list__Y6Tk4"};
+styleInject(css_248z);
+
+export { styles as default };

package/dist/packages/ingots/src/select/option/index.js

@@ -0,0 +1,35 @@
+import { build } from '../../../../forge/src/classes.js';
+import 'react';
+import { j as jsxRuntimeExports } from '../../../../../_virtual/jsx-runtime.js';
+import Connect from '../../../../runes/src/paths/check/regular.js';
+import styles from './index.module.css.js';
+
+const Option = ({
+  value,
+  title,
+  onOptionClick,
+  multiple,
+  selected,
+  formatter,
+  small,
+  ...props
+}) => {
+  const classes = build(styles.root, {
+    [styles.selected]: selected,
+    [styles.small]: small
+  });
+  const text = typeof formatter === "function" ? formatter(value, title) : title;
+  const onClick = () => {
+    if (typeof onOptionClick === "function") onOptionClick(value, title);
+  };
+  return /*#__PURE__*/jsxRuntimeExports.jsxs("li", {
+    className: classes,
+    role: "option",
+    onClick: onClick,
+    "aria-selected": selected,
+    ...props,
+    children: [text, multiple && selected && /*#__PURE__*/jsxRuntimeExports.jsx(Connect, {})]
+  });
+};
+
+export { Option as default };

package/dist/packages/ingots/src/select/option/index.module.css.js

@@ -0,0 +1,7 @@
+import styleInject from '../../../../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".index-module_root__qWCGb {\n  display: flex;\n  justify-content: space-between;\n  gap: 6px;\n  padding: 8px 12px;\n}\n\n.index-module_root__qWCGb svg {\n  height: 18px;\n  width: 18px;\n}\n\n.index-module_root__qWCGb:hover {\n  background-color: var(--bright-green);\n  cursor: pointer;\n}\n\n.index-module_small__m55V2 {\n  font-size: 12px;\n  padding: 4px 8px;\n  gap: 4px;\n}\n\n.index-module_selected__pt-02 {\n  background-color: var(--light-background);\n  font-weight: 600;\n}\n\n.index-module_root__qWCGb.index-module_small__m55V2 svg {\n  height: 16px;\n  width: 16px;\n}\n";
+var styles = {"root":"index-module_root__qWCGb","small":"index-module_small__m55V2","selected":"index-module_selected__pt-02"};
+styleInject(css_248z);
+
+export { styles as default };

package/dist/packages/ingots/src/select/options/index.js

@@ -0,0 +1,59 @@
+import * as React from 'react';
+import * as ReactDOM from 'react-dom';
+import styles from './index.module.css.js';
+import { j as jsxRuntimeExports } from '../../../../../_virtual/jsx-runtime.js';
+
+const Options = ({
+  children,
+  open,
+  setOpen,
+  container
+}) => {
+  const elements = React.useRef();
+  const position = React.useCallback(() => {
+    const {
+      current
+    } = elements;
+    if (!container.current || !current || !open) return;
+    const rect = container.current.getBoundingClientRect();
+    current.style.top = `${rect.bottom}px`;
+    current.style.left = `${rect.left}px`;
+    current.style.width = `${rect.width}px`;
+    const height = window.innerHeight - rect.bottom - 10;
+    current.style.maxHeight = `${height}px`;
+  }, [container, open]);
+  React.useEffect(() => {
+    if (!open) return;
+    const handler = ({
+      target
+    }) => {
+      const menu = elements.current?.contains(target);
+      const input = container.current?.contains(target);
+      if (!menu && !input) setOpen(false);
+    };
+    document.addEventListener("mousedown", handler);
+    return () => document.removeEventListener("mousedown", handler);
+  }, [open, container, setOpen]);
+  React.useLayoutEffect(() => {
+    const update = () => {
+      window.addEventListener("scroll", position, true);
+      window.addEventListener("resize", position);
+    };
+    if (open) {
+      position();
+      update();
+    }
+    return () => update();
+  }, [open, position, children]);
+  if (!open) return null;
+  return /*#__PURE__*/ReactDOM.createPortal(/*#__PURE__*/jsxRuntimeExports.jsx("div", {
+    className: styles.root,
+    ref: elements,
+    children: /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+      className: styles.scroller,
+      children: children
+    })
+  }), document.body);
+};
+
+export { Options as default };

package/dist/packages/ingots/src/select/options/index.module.css.js

@@ -0,0 +1,7 @@
+import styleInject from '../../../../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".index-module_root__mQkl3 {\n  position: fixed;\n  display: flex;\n  flex-direction: column;\n  background-color: var(--white);\n  border: 1px solid var(--light-stroke);\n  border-radius: 0 0 8px 8px;\n  overflow: hidden;\n  z-index: 40;\n  transition: max-height var(--transition-short);\n}\n\n.index-module_scroller__w-1Kk {\n  overflow-y: auto;\n  flex: 1;\n}\n";
+var styles = {"root":"index-module_root__mQkl3","scroller":"index-module_scroller__w-1Kk"};
+styleInject(css_248z);
+
+export { styles as default };

package/dist/packages/ingots/src/snackbar/context.js

@@ -0,0 +1,9 @@
+import * as React from 'react';
+
+const Context = /*#__PURE__*/React.createContext();
+const useContext = () => {
+  const context = React.useContext(Context);
+  return context;
+};
+
+export { Context, useContext };

package/dist/packages/ingots/src/tag/index.js

@@ -0,0 +1,16 @@
+import { build } from '../../../forge/src/classes.js';
+import styles from './index.module.css.js';
+import { j as jsxRuntimeExports } from '../../../../_virtual/jsx-runtime.js';
+
+const Tag = ({
+  children,
+  className
+}) => {
+  const classes = build(className, styles.root);
+  return /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+    className: classes,
+    children: children
+  });
+};
+
+export { Tag as default };

package/dist/packages/ingots/src/tag/index.module.css.js

@@ -0,0 +1,7 @@
+import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".index-module_root__2y8iA {\n  flex: 0 0 auto;\n  background-color: var(--lighter-stroke);\n  color: var(--secondary-text);\n  border-radius: 4px;\n  font-size: 11px;\n  font-weight: 600;\n  padding: 4px 8px;\n}\n";
+var styles = {"root":"index-module_root__2y8iA"};
+styleInject(css_248z);
+
+export { styles as default };

package/dist/packages/ingots/src/text/index.js

@@ -0,0 +1,92 @@
+import * as React from 'react';
+import { build } from '../../../forge/src/classes.js';
+import styles from './index.module.css.js';
+import { j as jsxRuntimeExports } from '../../../../_virtual/jsx-runtime.js';
+
+const validate = (value, validation) => {
+  if (value === undefined || value?.length === 0) return undefined;
+  return validation.test(value);
+};
+const Text = ({
+  className,
+  value,
+  onChange,
+  metric,
+  children,
+  Icon,
+  required,
+  optional,
+  helper,
+  error,
+  small,
+  fill,
+  reset,
+  validation = /^.+$/,
+  placeholder = "Écrivez ici",
+  ...props
+}) => {
+  const ref = React.useRef();
+  const valid = validate(ref.current?.value, validation);
+  const invalid = valid === false || error;
+  const classes = {
+    root: build(styles.root, className, {
+      [styles.fill]: fill,
+      [styles.valid]: valid,
+      [styles.small]: small,
+      [styles.written]: !!value,
+      [styles.invalid]: invalid,
+      [styles.optional]: !required || optional
+    }),
+    input: build(styles.input, {
+      [styles.unit]: metric,
+      [styles.iconic]: Icon
+    }),
+    error: build(styles.error, {
+      [styles.exception]: invalid
+    })
+  };
+  const _onChange = e => {
+    if (typeof onChange === "function") onChange(e);
+  };
+  React.useEffect(() => {
+    if (reset) ref.current.value = "";
+  }, [reset]);
+  React.useEffect(() => {
+    if (value) ref.current.value = value;
+  }, [value]);
+  return /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+    className: classes.root,
+    "data-error": error,
+    "data-invalid": invalid,
+    children: [children && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+      className: styles.label,
+      children: /*#__PURE__*/jsxRuntimeExports.jsx("label", {
+        children: children
+      })
+    }), /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+      className: styles.container,
+      children: [/*#__PURE__*/jsxRuntimeExports.jsx("input", {
+        className: classes.input,
+        type: "text",
+        defaultValue: value,
+        onChange: _onChange,
+        placeholder: placeholder,
+        ...props,
+        ref: ref
+      }), !!metric && /*#__PURE__*/jsxRuntimeExports.jsx("span", {
+        className: styles.metric,
+        children: metric
+      }), Icon && /*#__PURE__*/jsxRuntimeExports.jsx(Icon, {
+        className: styles.icon
+      })]
+    }), helper && /*#__PURE__*/jsxRuntimeExports.jsx("span", {
+      className: styles.helper,
+      children: helper
+    }), error && /*#__PURE__*/jsxRuntimeExports.jsx("span", {
+      className: classes.error,
+      children: error
+    })]
+  });
+};
+
+export { Text as default };

package/dist/packages/ingots/src/text/index.module.css.js

@@ -0,0 +1,7 @@
+import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".index-module_root__gFc58 {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.index-module_label__6lPAe {\n  display: flex;\n  justify-content: space-between;\n  padding: 0 8px;\n}\n\n.index-module_container__ftudO {\n  position: relative;\n  display: flex;\n}\n\n.index-module_input__4FGVb {\n  flex: 1 1 auto;\n  width: 100%;\n  height: 40px;\n  padding: 0 8px;\n  font-family: inherit !important;\n  color: var(--tertiary-text);\n  background-color: var(--light-background);\n  border: 1px solid var(--stroke-blue);\n  border-radius: var(--border-radius);\n  transition:\n    background-color var(--transition-short),\n    color var(--transition-short),\n    border var(--transition-short),\n    box-shadow var(--transition-long);\n}\n\n.index-module_input__4FGVb:hover {\n  border: 1px solid var(--bright-blue);\n}\n\n.index-module_valid__IrjhT .index-module_input__4FGVb,\n.index-module_written__DE1sJ .index-module_input__4FGVb,\n.index-module_input__4FGVb:active,\n.index-module_input__4FGVb:focus {\n  color: var(--font-color);\n  background-color: var(--white);\n  border: 1px solid var(--green);\n}\n\n.index-module_input__4FGVb:active,\n.index-module_input__4FGVb:focus {\n  box-shadow: 0 0 0 3px rgba(var(--mountain-meadow), 0.3);\n}\n\n.index-module_invalid__YGpJN .index-module_input__4FGVb {\n  color: var(--font-color);\n  background-color: var(--white);\n  border: 1px solid var(--strong-red);\n}\n\n.index-module_invalid__YGpJN .index-module_input__4FGVb:active,\n.index-module_invalid__YGpJN .index-module_input__4FGVb:focus {\n  border: 1px solid var(--strong-red);\n  box-shadow: 0 0 0 3px rgba(var(--fuzzy-wuzzy), 0.3);\n}\n\n.index-module_label__6lPAe label {\n  font-weight: 600;\n}\n\n.index-module_optional__dWJ3x .index-module_label__6lPAe::after {\n  content: \"Optionnel\";\n  right: 8px;\n  color: var(--tertiary-text);\n}\n\n.index-module_unit__rwisi {\n  padding-right: 24px;\n}\n\n.index-module_metric__zbGaJ {\n  position: absolute;\n  right: 8px;\n  top: 50%;\n  transform: translateY(-50%);\n}\n\n.index-module_iconic__HCUkk {\n  padding-right: 36px;\n}\n\n.index-module_icon__e9Vm7 {\n  position: absolute;\n  right: 8px;\n  top: 50%;\n  transform: translateY(-50%);\n}\n\n.index-module_helper__RMmIU {\n  font-size: 14px;\n  color: var(--tertiary-text);\n}\n\n.index-module_error__lRlJB {\n  display: flex;\n  align-items: center;\n  color: var(--strong-red);\n  gap: 4px;\n  opacity: 0;\n  transition: opacity var(--transition-short);\n}\n\n.index-module_error__lRlJB::before {\n  content: \"!\";\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 14px;\n  font-weight: bold;\n  border-radius: 50%;\n  flex: 0 0 16px;\n  height: 16px;\n  width: 16px;\n  color: var(--white);\n  background-color: var(--strong-red);\n}\n\n.index-module_exception__Y4jMB {\n  opacity: 1;\n}\n\n.index-module_fill__YjZaZ {\n  width: 100%;\n}\n\n.index-module_small__Fh1-g input {\n  height: 30px;\n}\n\n.index-module_small__Fh1-g .index-module_label__6lPAe,\n.index-module_small__Fh1-g input,\n.index-module_small__Fh1-g .index-module_metric__zbGaJ {\n  font-size: 12px;\n}\n\n.index-module_small__Fh1-g .index-module_helper__RMmIU,\n.index-module_small__Fh1-g .index-module_error__lRlJB {\n  font-size: 11px;\n}\n\n.index-module_small__Fh1-g .index-module_icon__e9Vm7 {\n  width: 16px;\n  height: 16px;\n}\n\n.index-module_small__Fh1-g .index-module_iconic__HCUkk {\n  padding-right: 30px;\n}\n\n.index-module_small__Fh1-g input::placeholder {\n  font-size: 12px;\n}\n\n.index-module_input__4FGVb:disabled {\n  border: 1px solid var(--stroke-blue);\n  background-color: var(--light-background);\n  opacity: 0.75;\n}\n";
+var styles = {"root":"index-module_root__gFc58","label":"index-module_label__6lPAe","container":"index-module_container__ftudO","input":"index-module_input__4FGVb","valid":"index-module_valid__IrjhT","written":"index-module_written__DE1sJ","invalid":"index-module_invalid__YGpJN","optional":"index-module_optional__dWJ3x","unit":"index-module_unit__rwisi","metric":"index-module_metric__zbGaJ","iconic":"index-module_iconic__HCUkk","icon":"index-module_icon__e9Vm7","helper":"index-module_helper__RMmIU","error":"index-module_error__lRlJB","exception":"index-module_exception__Y4jMB","fill":"index-module_fill__YjZaZ","small":"index-module_small__Fh1-g"};
+styleInject(css_248z);
+
+export { styles as default };

package/dist/packages/ingots/src/textarea/index.js

@@ -0,0 +1,62 @@
+import * as React from 'react';
+import { build } from '../../../forge/src/classes.js';
+import styles from './index.module.css.js';
+import { j as jsxRuntimeExports } from '../../../../_virtual/jsx-runtime.js';
+
+const Textarea = ({
+  className,
+  value,
+  onChange,
+  children,
+  small,
+  lines = 0,
+  fill,
+  reset,
+  placeholder = "Écrivez ici",
+  autofocus,
+  ...props
+}) => {
+  const ref = React.useRef();
+  const [content, setContent] = React.useState("");
+  const classes = build(styles.root, className, {
+    [styles.fill]: fill,
+    [styles.small]: small,
+    [styles.written]: !!value || !!content
+  });
+  const _onChange = e => {
+    if (typeof onChange === "function") onChange(e);
+    setContent(e.target.value);
+  };
+  React.useEffect(() => {
+    if (reset) ref.current.value = "";
+  }, [reset]);
+  React.useEffect(() => {
+    if (autofocus) {
+      ref.current.focus();
+      ref.current.setSelectionRange(-1, -1);
+    }
+  }, [autofocus]);
+  return /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+    className: classes,
+    children: [children && /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+      className: styles.label,
+      children: children && /*#__PURE__*/jsxRuntimeExports.jsx("label", {
+        children: children
+      })
+    }), /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+      className: styles.container,
+      "data-content": content || value,
+      children: /*#__PURE__*/jsxRuntimeExports.jsx("textarea", {
+        className: styles.input,
+        type: "textarea",
+        defaultValue: value,
+        onChange: _onChange,
+        placeholder: placeholder,
+        ...props,
+        ref: ref
+      })
+    })]
+  });
+};
+
+export { Textarea as default };

package/dist/packages/ingots/src/textarea/index.module.css.js

@@ -0,0 +1,7 @@
+import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".index-module_root__-sFMR {\n  display: flex;\n  flex-direction: column;\n  align-self: stretch;\n  gap: 4px;\n}\n\n.index-module_label__medJR {\n  display: flex;\n  justify-content: space-between;\n  padding: 0 8px;\n}\n\n.index-module_container__U2pdr {\n  position: relative;\n  display: grid;\n}\n\n.index-module_container__U2pdr::after {\n  content: attr(data-content) \" \";\n  white-space: pre-wrap;\n  visibility: hidden;\n  min-height: 80px;\n  max-height: 200px;\n}\n\n.index-module_input__jsxEP {\n  resize: none;\n  color: var(--tertiary-text);\n  overflow-y: scroll;\n  background-color: var(--light-background);\n  transition:\n    background-color var(--transition-short),\n    color var(--transition-short),\n    border var(--transition-short),\n    box-shadow var(--transition-long);\n  min-height: 80px;\n  max-height: 200px;\n}\n\n.index-module_container__U2pdr::after,\n.index-module_input__jsxEP {\n  grid-area: 1 / 1 / 2 / 2;\n  width: 100%;\n  padding: 8px;\n  font-family: inherit !important;\n  font-size: 16px;\n  line-height: 22px;\n  border: 1px solid var(--stroke-blue);\n  border-radius: var(--border-radius);\n  word-break: break-word;\n  overflow: auto;\n}\n\n.index-module_input__jsxEP:hover {\n  border: 1px solid var(--bright-blue);\n}\n\n.index-module_input__jsxEP:active,\n.index-module_input__jsxEP:focus {\n  box-shadow: 0 0 0 3px rgba(var(--mountain-meadow), 0.3);\n}\n\n.index-module_input__jsxEP:active,\n.index-module_input__jsxEP:focus,\n.index-module_written__E-nU5 .index-module_input__jsxEP {\n  color: var(--font-color);\n  background-color: var(--white);\n  border: 1px solid var(--green);\n}\n\n.index-module_label__medJR label {\n  font-weight: 600;\n}\n\n.index-module_fill__8hK9o {\n  width: 100%;\n}\n\n.index-module_small__iH4CV .index-module_input__jsxEP,\n.index-module_container__U2pdr::after {\n  min-height: 60px;\n}\n\n.index-module_small__iH4CV .index-module_label__medJR,\n.index-module_small__iH4CV .index-module_input__jsxEP,\n.index-module_small__iH4CV {\n  font-size: 12px;\n}\n\n.index-module_small__iH4CV .index-module_input__jsxEP::placeholder {\n  font-size: 12px;\n}\n";
+var styles = {"root":"index-module_root__-sFMR","label":"index-module_label__medJR","container":"index-module_container__U2pdr","input":"index-module_input__jsxEP","written":"index-module_written__E-nU5","fill":"index-module_fill__8hK9o","small":"index-module_small__iH4CV"};
+styleInject(css_248z);
+
+export { styles as default };

package/dist/packages/ingots/src/toggle/index.js

@@ -0,0 +1,43 @@
+import * as React from 'react';
+import { build } from '../../../forge/src/classes.js';
+import styles from './index.module.css.js';
+import { j as jsxRuntimeExports } from '../../../../_virtual/jsx-runtime.js';
+
+const Toggle = ({
+  id = "toggle",
+  label,
+  variant = "medium",
+  disabled,
+  active = false,
+  onChange,
+  className,
+  ...props
+}) => {
+  const ref = React.useRef();
+  const classes = build(styles.root, className, {
+    [styles.disabled]: disabled,
+    [styles[variant]]: variant
+  });
+  const _onChange = e => {
+    if (typeof onChange === "function") onChange(e.target.checked);
+  };
+  React.useEffect(() => {
+    if (ref.current.checked !== active) ref.current.checked = active;
+  }, [active]);
+  return /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+    className: classes,
+    "data-label": label,
+    children: [/*#__PURE__*/jsxRuntimeExports.jsx("input", {
+      type: "checkbox",
+      id: id,
+      defaultChecked: active,
+      ref: ref,
+      onChange: _onChange,
+      ...props
+    }), /*#__PURE__*/jsxRuntimeExports.jsx("label", {
+      htmlFor: id
+    })]
+  });
+};
+
+export { Toggle as default };

package/dist/packages/ingots/src/toggle/index.module.css.js

@@ -0,0 +1,7 @@
+import styleInject from '../../../../node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".index-module_root__Ts-Ef {\n  display: flex;\n  flex-direction: row-reverse;\n  justify-content: flex-end;\n  gap: 8px;\n  --input-width: 30px;\n  --input-height: 16px;\n  --input-radius: 6px;\n  --handle-width: 12px;\n  --handle-radius: 4px;\n}\n\n.index-module_root__Ts-Ef.index-module_large__aQ1dG {\n  --input-width: 40px;\n  --input-height: 20px;\n  --input-radius: 8px;\n  --handle-width: 16px;\n  --handle-radius: 6px;\n}\n\n.index-module_root__Ts-Ef.index-module_small__Fy1tm {\n  --input-width: 24px;\n  --input-height: 12px;\n  --handle-width: 8px;\n  --handle-radius: 2px;\n  --input-radius: 4px;\n}\n\n.index-module_root__Ts-Ef *,\n.index-module_root__Ts-Ef *::after,\n.index-module_root__Ts-Ef *::before {\n  box-sizing: content-box;\n}\n\n.index-module_root__Ts-Ef input {\n  display: none;\n}\n\n.index-module_root__Ts-Ef::after {\n  content: attr(data-label);\n  display: flex;\n}\n\n.index-module_root__Ts-Ef label {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n}\n\n.index-module_root__Ts-Ef label::before,\n.index-module_root__Ts-Ef label::after {\n  content: \"\";\n  position: absolute;\n  left: 0;\n  transition: all 0.2s ease;\n  cursor: pointer;\n}\n\n.index-module_root__Ts-Ef label::before {\n  width: var(--input-width);\n  height: var(--input-height);\n  border-radius: var(--input-radius);\n  background-color: var(--stroke-blue);\n}\n\n.index-module_root__Ts-Ef label::after {\n  content: \"\";\n  width: var(--handle-width);\n  height: var(--handle-width);\n  border-radius: var(--handle-radius);\n  left: 2px;\n  background: #fff;\n  box-sizing: border-box;\n  transition: all 0.2s ease;\n}\n\n.index-module_root__Ts-Ef input:checked + label::after {\n  left: calc(var(--input-width) - var(--handle-width) - 2px);\n}\n\n.index-module_root__Ts-Ef input:checked + label::before {\n  background-color: var(--highlight-green);\n}\n\n.index-module_disabled__stSWq label {\n  pointer-events: none;\n}\n\n.index-module_disabled__stSWq label::before {\n  background-color: var(--lighter-stroke);\n}\n\n.index-module_disabled__stSWq input:checked + label::before {\n  background-color: var(--stroke-green);\n}\n";
+var styles = {"root":"index-module_root__Ts-Ef","large":"index-module_large__aQ1dG","small":"index-module_small__Fy1tm","disabled":"index-module_disabled__stSWq"};
+styleInject(css_248z);
+
+export { styles as default };

package/dist/packages/runes/src/icon.js

@@ -0,0 +1,16 @@
+import 'react';
+import { j as jsxRuntimeExports } from '../../../_virtual/jsx-runtime.js';
+
+const Icon = ({
+  children,
+  ...props
+}) => /*#__PURE__*/jsxRuntimeExports.jsx("svg", {
+  width: "24",
+  height: "24",
+  viewBox: "0 0 24 24",
+  fill: "currentColor",
+  ...props,
+  children: children
+});
+
+export { Icon as default };

package/dist/packages/runes/src/paths/alert.js

@@ -0,0 +1,18 @@
+import Icon from '../icon.js';
+import { j as jsxRuntimeExports } from '../../../../_virtual/jsx-runtime.js';
+
+const Alert = ({
+  ...props
+}) => {
+  return /*#__PURE__*/jsxRuntimeExports.jsx(Icon, {
+    ...props,
+    children: /*#__PURE__*/jsxRuntimeExports.jsx("path", {
+      fillRule: "evenodd",
+      clipRule: "evenodd",
+      d: "M10.1812 2.99385C10.9895 1.59385 13.0102 1.59385 13.8185 2.99385L21.3529 16.0438C22.1612 17.4439 21.1509 19.1938 19.5343 19.1938H4.46544C2.84885 19.1938 1.83849 17.4438 2.64678 16.0438L10.1812 2.99385ZM11.9998 5.99985C12.4969 5.99985 12.8998 6.4028 12.8998 6.89985V11.0999C12.8998 11.5969 12.4969 11.9999 11.9998 11.9999C11.5027 11.9999 11.0998 11.5969 11.0998 11.0999V6.89985C11.0998 6.4028 11.5027 5.99985 11.9998 5.99985ZM11.9998 16.7999C12.6625 16.7999 13.1998 16.2626 13.1998 15.5999C13.1998 14.9371 12.6625 14.3999 11.9998 14.3999C11.3371 14.3999 10.7998 14.9371 10.7998 15.5999C10.7998 16.2626 11.3371 16.7999 11.9998 16.7999Z",
+      fill: "currentColor"
+    })
+  });
+};
+
+export { Alert as default };

package/dist/packages/runes/src/paths/arrow/path.js

@@ -0,0 +1,18 @@
+import Icon from '../../icon.js';
+import { j as jsxRuntimeExports } from '../../../../../_virtual/jsx-runtime.js';
+
+const Path = ({
+  ...props
+}) => {
+  return /*#__PURE__*/jsxRuntimeExports.jsx(Icon, {
+    ...props,
+    children: /*#__PURE__*/jsxRuntimeExports.jsx("path", {
+      fill: "currentColor",
+      fillRule: "evenodd",
+      clipRule: "evenodd",
+      d: "M17.0998 13.2446C16.3136 16.1787 13.2978 17.9199 10.3637 17.1337C9.3947 16.8741 8.55765 16.3724 7.89793 15.7115L7.58639 15.3999L10.0196 15.3995C10.4338 15.3994 10.7696 15.0636 10.7695 14.6494C10.7694 14.2351 10.4336 13.8994 10.0194 13.8995L5.77592 13.9003C5.57701 13.9003 5.38625 13.9793 5.24563 14.12C5.105 14.2607 5.02602 14.4515 5.02606 14.6504L5.02695 18.8922C5.02704 19.3065 5.3629 19.6422 5.77711 19.6421C6.19132 19.642 6.52704 19.3061 6.52695 18.8919L6.52644 16.4613L6.83629 16.7712C7.67733 17.6137 8.74501 18.2529 9.97549 18.5826C13.7098 19.5832 17.5481 17.3671 18.5487 13.6328C18.6559 13.2327 18.4185 12.8215 18.0184 12.7143C17.6183 12.6071 17.207 12.8445 17.0998 13.2446ZM18.3287 9.52223C18.4694 9.38156 18.5484 9.19076 18.5484 8.99183L18.5477 4.74988C18.5476 4.33566 18.2118 3.99993 17.7975 4C17.3833 4.00007 17.0476 4.33591 17.0477 4.75012L17.0481 7.18099L16.7382 6.87118C15.8973 6.02876 14.8293 5.38931 13.599 5.05963C9.86469 4.05904 6.02633 6.27512 5.02574 10.0094C4.91854 10.4095 5.15597 10.8207 5.55607 10.9279C5.95617 11.0351 6.36742 10.7977 6.47463 10.3976C7.26081 7.46355 10.2767 5.72234 13.2107 6.50852C14.1798 6.76818 15.0169 7.26985 15.6766 7.93083L15.9877 8.24195L13.5557 8.24195C13.1415 8.24195 12.8057 8.57773 12.8057 8.99195C12.8057 9.40616 13.1415 9.74195 13.5557 9.74195H17.7984C17.9973 9.74195 18.1881 9.66291 18.3287 9.52223Z"
+    })
+  });
+};
+
+export { Path as default };

package/dist/packages/runes/src/paths/calendar.js

@@ -0,0 +1,18 @@
+import Icon from '../icon.js';
+import { j as jsxRuntimeExports } from '../../../../_virtual/jsx-runtime.js';
+
+const Calendar = ({
+  ...props
+}) => {
+  return /*#__PURE__*/jsxRuntimeExports.jsx(Icon, {
+    ...props,
+    children: /*#__PURE__*/jsxRuntimeExports.jsx("path", {
+      fillRule: "evenodd",
+      clipRule: "evenodd",
+      d: "M6.8999 2.3999C7.39696 2.3999 7.7999 2.80285 7.7999 3.2999V4.7999H16.1999V3.2999C16.1999 2.80285 16.6028 2.3999 17.0999 2.3999C17.597 2.3999 17.9999 2.80285 17.9999 3.2999V4.7999H18.2999C20.1224 4.7999 21.5999 6.27736 21.5999 8.0999V18.2999C21.5999 20.1224 20.1224 21.5999 18.2999 21.5999H5.6999C3.87736 21.5999 2.3999 20.1224 2.3999 18.2999V8.0999C2.3999 6.27736 3.87736 4.7999 5.6999 4.7999H5.9999V3.2999C5.9999 2.80285 6.40285 2.3999 6.8999 2.3999ZM5.6999 8.9999C4.87148 8.9999 4.1999 9.67147 4.1999 10.4999V18.2999C4.1999 19.1283 4.87148 19.7999 5.6999 19.7999H18.2999C19.1283 19.7999 19.7999 19.1283 19.7999 18.2999V10.4999C19.7999 9.67148 19.1283 8.9999 18.2999 8.9999H5.6999Z",
+      fill: "currentColor"
+    })
+  });
+};
+
+export { Calendar as default };

package/dist/packages/runes/src/paths/check/fill.js

@@ -0,0 +1,18 @@
+import Icon from '../../icon.js';
+import { j as jsxRuntimeExports } from '../../../../../_virtual/jsx-runtime.js';
+
+const Fill = ({
+  ...props
+}) => {
+  return /*#__PURE__*/jsxRuntimeExports.jsx(Icon, {
+    ...props,
+    children: /*#__PURE__*/jsxRuntimeExports.jsx("path", {
+      fillRule: "evenodd",
+      clipRule: "evenodd",
+      d: "M11.9999 21.5999C17.3018 21.5999 21.5999 17.3018 21.5999 11.9999C21.5999 6.69797 17.3018 2.3999 11.9999 2.3999C6.69797 2.3999 2.3999 6.69797 2.3999 11.9999C2.3999 17.3018 6.69797 21.5999 11.9999 21.5999ZM16.6278 9.82926C16.9201 9.42727 16.8312 8.86439 16.4293 8.57204C16.0273 8.27969 15.4644 8.36856 15.172 8.77055L10.9915 14.5187L8.7363 12.2635C8.38483 11.912 7.81498 11.912 7.46351 12.2635C7.11203 12.615 7.11203 13.1848 7.46351 13.5363L10.4635 16.5363C10.6496 16.7224 10.9079 16.8177 11.1703 16.7971C11.4327 16.7766 11.673 16.6421 11.8278 16.4293L16.6278 9.82926Z",
+      fill: "currentColor"
+    })
+  });
+};
+
+export { Fill as default };