@amoa/casting 0.1.3 → 0.1.5

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

@@ -0,0 +1,75 @@
+import 'react';
+import Button from '../button/index.js';
+import Checkbox from '../checkbox/index.js';
+import Textarea from '../textarea/index.js';
+import Input$1 from '../date/input/index.js';
+import File from '../file/input/index.js';
+import Select from '../select/index.js';
+import Toggle from '../toggle/index.js';
+import Address from '../address/index.js';
+import Text from '../text/index.js';
+import { email } from './src/validation/index.js';
+import { j as jsxRuntimeExports } from '../../../../_virtual/jsx-runtime.js';
+
+const Fallback = ({
+  type
+}) => {
+  console.warn(`Type ${type} non pris en compte.`);
+  return /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+    children: ["Type $", type, " non pris en compte."]
+  });
+};
+const Input = ({
+  type,
+  ...props
+}) => {
+  switch (type) {
+    case "button":
+      return /*#__PURE__*/jsxRuntimeExports.jsx(Button, {
+        ...props
+      });
+    case "checkbox":
+      return /*#__PURE__*/jsxRuntimeExports.jsx(Checkbox, {
+        ...props
+      });
+    case "date":
+      return /*#__PURE__*/jsxRuntimeExports.jsx(Input$1, {
+        ...props
+      });
+    case "color":
+      return /*#__PURE__*/jsxRuntimeExports.jsx(Fallback, {
+        type: type
+      });
+    case "file":
+      return /*#__PURE__*/jsxRuntimeExports.jsx(File, {
+        ...props
+      });
+    case "textarea":
+      return /*#__PURE__*/jsxRuntimeExports.jsx(Textarea, {
+        ...props
+      });
+    case "select":
+      return /*#__PURE__*/jsxRuntimeExports.jsx(Select, {
+        ...props
+      });
+    case "toggle":
+      return /*#__PURE__*/jsxRuntimeExports.jsx(Toggle, {
+        ...props
+      });
+    case "address":
+      return /*#__PURE__*/jsxRuntimeExports.jsx(Address, {
+        ...props
+      });
+    case "email":
+      return /*#__PURE__*/jsxRuntimeExports.jsx(Text, {
+        validation: email,
+        ...props
+      });
+  }
+  return /*#__PURE__*/jsxRuntimeExports.jsx(Text, {
+    type: type,
+    ...props
+  });
+};
+
+export { Input as default };

package/dist/packages/ingots/src/input/src/validation/index.js

@@ -0,0 +1,3 @@
+const email = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
+
+export { email };

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

@@ -0,0 +1,23 @@
+import 'react';
+import { build } from '../../../forge/src/classes.js';
+import Spinner from './variants/spinner/index.js';
+import styles from './index.module.css.js';
+import { j as jsxRuntimeExports } from '../../../../_virtual/jsx-runtime.js';
+
+const variants = {
+  spinner: Spinner
+};
+const Loader = ({
+  variant = "spinner",
+  className,
+  ...props
+}) => {
+  const Variant = variants[variant];
+  const classes = build(styles.loader, className);
+  return /*#__PURE__*/jsxRuntimeExports.jsx(Variant, {
+    className: classes,
+    ...props
+  });
+};
+
+export { Loader as default };

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

@@ -0,0 +1,3 @@
+var styles = {};
+
+export { styles as default };

package/dist/packages/ingots/src/loader/variants/spinner/index.js

@@ -0,0 +1,31 @@
+import '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 hexaPattern = /^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{8}|[A-Fa-f0-9]{3})$/;
+const checkHexa = string => hexaPattern.test(string);
+const shader = shade => {
+  const isHexa = checkHexa(shade);
+  return isHexa ? {
+    borderBottomColor: shade
+  } : {};
+};
+const Spinner = ({
+  color,
+  shade,
+  className
+}) => {
+  const classes = build(styles.root, className, {
+    [styles.color]: color
+  });
+  const style = {
+    ...shader(shade)
+  };
+  return /*#__PURE__*/jsxRuntimeExports.jsx("div", {
+    className: classes,
+    style: style
+  });
+};
+
+export { Spinner as default };

package/dist/packages/ingots/src/loader/variants/spinner/index.module.css.js

@@ -0,0 +1,3 @@
+var styles = {"root":"index-module_root__ndbCK"};
+
+export { styles as default };

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

@@ -0,0 +1,33 @@
+import 'react';
+import { build } from '../../../../forge/src/classes.js';
+import { j as jsxRuntimeExports } from '../../../../../_virtual/jsx-runtime.js';
+import Regular from '../../../../runes/src/paths/cross/regular.js';
+import styles from './index.module.css.js';
+
+const Card = ({
+  title,
+  value,
+  formatter,
+  onDelete,
+  small
+}) => {
+  const classes = build(styles.root, {
+    [styles.small]: small
+  });
+  const text = typeof formatter === "function" ? formatter(value, title) : title;
+  const onClick = () => {
+    onDelete(value);
+  };
+  return /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+    className: classes,
+    children: [/*#__PURE__*/jsxRuntimeExports.jsx("span", {
+      className: styles.text,
+      children: text
+    }), /*#__PURE__*/jsxRuntimeExports.jsx(Regular, {
+      className: styles.delete,
+      onClick: onClick
+    })]
+  });
+};
+
+export { Card as default };

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

@@ -0,0 +1,3 @@
+var styles = {"root":"index-module_root__lLUIk","text":"index-module_text__IrSLW","delete":"index-module_delete__1S-5A","small":"index-module_small__d5SxP"};
+
+export { styles as default };

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

@@ -0,0 +1,13 @@
+import styles from './index.module.css.js';
+import { j as jsxRuntimeExports } from '../../../../../_virtual/jsx-runtime.js';
+
+const Category = ({
+  title
+}) => {
+  return /*#__PURE__*/jsxRuntimeExports.jsx("span", {
+    className: styles.root,
+    children: title
+  });
+};
+
+export { Category as default };

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

@@ -0,0 +1,3 @@
+var styles = {"root":"index-module_root__9df-r"};
+
+export { styles as default };

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

@@ -0,0 +1,46 @@
+import * as React from 'react';
+import Option from '../option/index.js';
+import Category from '../category/index.js';
+import { j as jsxRuntimeExports } from '../../../../../_virtual/jsx-runtime.js';
+
+const Content = ({
+  options,
+  multiple,
+  small,
+  onOptionClick,
+  formatter,
+  selected
+}) => {
+  const props = {
+    multiple,
+    small,
+    onOptionClick,
+    formatter
+  };
+  return options.map((option, index) => {
+    const {
+      suboptions
+    } = option || {};
+    return !!suboptions ? /*#__PURE__*/jsxRuntimeExports.jsxs(React.Fragment, {
+      children: [/*#__PURE__*/jsxRuntimeExports.jsx(Category, {
+        title: option.title
+      }), suboptions.map(({
+        value,
+        title
+      }, subIndex) => /*#__PURE__*/jsxRuntimeExports.jsx(Option, {
+        selected: selected.some(item => value === item.value),
+        title: title,
+        value: value,
+        ...props
+      }, `${option.value}-suboption-${subIndex}`))]
+    }, `${option.value}-${index}`) : /*#__PURE__*/jsxRuntimeExports.jsx(Option, {
+      selected: selected.some(({
+        value
+      }) => value === option.value),
+      ...option,
+      ...props
+    }, `option-${index}`);
+  });
+};
+
+export { Content as default };

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,3 @@
+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"};
+
+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,3 @@
+var styles = {"root":"index-module_root__qWCGb","small":"index-module_small__m55V2","selected":"index-module_selected__pt-02"};
+
+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,3 @@
+var styles = {"root":"index-module_root__mQkl3","scroller":"index-module_scroller__w-1Kk"};
+
+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,3 @@
+var styles = {"root":"index-module_root__2y8iA"};
+
+export { styles as default };

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

@@ -0,0 +1,92 @@
+import * as React from 'react';
+import * as Classes from 'forge/classes';
+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: Classes.build(styles.root, className, {
+      [styles.fill]: fill,
+      [styles.valid]: valid,
+      [styles.small]: small,
+      [styles.written]: !!value,
+      [styles.invalid]: invalid,
+      [styles.optional]: !required || optional
+    }),
+    input: Classes.build(styles.input, {
+      [styles.unit]: metric,
+      [styles.iconic]: Icon
+    }),
+    error: Classes.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,3 @@
+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"};
+
+export { styles as default };