@solibo/solibo-ui 0.2.13 → 0.2.15

package/dist/components/picture/index.js

@@ -0,0 +1,150 @@
+import { jsxs as g, Fragment as R, jsx as l } from "react/jsx-runtime";
+import { t as f } from "../../classix-DG18itHa.js";
+import { useState as o, useRef as W, useCallback as j, useEffect as M } from "react";
+import { Button as F } from "../button/index.js";
+import { Dialog as T } from "../dialog/index.js";
+import { Dropzone as H } from "../dropzone/index.js";
+import { Figure as O } from "../figure/index.js";
+import { Icon as $ } from "../icon/index.js";
+import '../../assets/index3.css';const A = "_picture_1ou2v_1", B = "_image_1ou2v_17", q = "_dropzone_1ou2v_29", G = "_visible_1ou2v_36", J = "_hidden_1ou2v_41", K = "_profile_1ou2v_58", n = {
+  picture: A,
+  image: B,
+  dropzone: q,
+  visible: G,
+  hidden: J,
+  "preview-buttons": "_preview-buttons_1ou2v_47",
+  profile: K
+}, Q = {
+  default: n.default,
+  profile: n.profile
+}, ae = ({ source: t, alt: E, variant: v = "default", ...e }) => {
+  const [U, c] = o(e.placeholderSrc ?? t), [L, k] = o(!1), [p, h] = o(null), [C, s] = o(!1), [m, u] = o(!1), [_, r] = o(null), w = e.minimumImagePixelWidth ?? 400, b = e.minimumImagePixelHeight ?? 400, N = W(null), I = j(() => {
+    u(!1), h(null), c(t), r(null);
+  }, [t]), z = [
+    "image/jpeg",
+    "image/png",
+    "image/gif",
+    "image/webp",
+    "image/bmp",
+    "image/svg+xml",
+    "image/tiff"
+  ];
+  M(() => {
+    if (!t)
+      return;
+    c(t), u(!1);
+    const i = new window.Image(0, 0);
+    i.src = t, i.srcset = e.srcSet ?? t, i.onload = () => {
+      k(!0);
+    };
+  }, [t, e.srcSet]);
+  const D = (i) => {
+    const a = i[0];
+    if (!a) return;
+    z.includes(a.type) || r("Unsupported file type. Please upload a valid image.");
+    const S = new FileReader();
+    S.onload = (x) => {
+      var P;
+      const d = new window.Image();
+      d.onload = () => {
+        var y;
+        (d.width < w || d.height < b) && r(
+          `Image is too small. Minimum size is ${w}x${b}px.`
+        ), u(!0), c((y = x.target) == null ? void 0 : y.result);
+      }, d.src = (P = x.target) == null ? void 0 : P.result;
+    }, S.readAsDataURL(a), h(a);
+  };
+  return /* @__PURE__ */ g(R, { children: [
+    /* @__PURE__ */ g(
+      "div",
+      {
+        className: f(n.picture, Q[v], m ? n.previewing : ""),
+        onMouseEnter: () => s(e.canEdit),
+        onMouseLeave: () => s(!1),
+        onDragOver: (i) => {
+          i.preventDefault(), s(e.canEdit);
+        },
+        onDragLeave: () => s(!1),
+        onDrop: (i) => {
+          var a;
+          i.preventDefault(), s(!1), e.canEdit && D((a = i.dataTransfer) == null ? void 0 : a.files);
+        },
+        children: [
+          m ? null : /* @__PURE__ */ l(
+            "div",
+            {
+              className: f(
+                n.dropzone,
+                C && n.visible,
+                e.canEdit ? "" : n.hidden
+              ),
+              children: /* @__PURE__ */ l(
+                H,
+                {
+                  onUpload: (i) => {
+                    D(i);
+                  },
+                  mimeTypes: z,
+                  inputId: e.inputId
+                }
+              )
+            }
+          ),
+          v === "profile" && !t ? /* @__PURE__ */ l($, { name: "user" }) : /* @__PURE__ */ g(O, { label: e.caption, children: [
+            /* @__PURE__ */ l(
+              "img",
+              {
+                src: U,
+                srcSet: e.srcSet,
+                sizes: e.sizes,
+                alt: E,
+                className: f(
+                  n.image,
+                  m ? n.previewing : "",
+                  L ? "" : "loading"
+                ),
+                loading: "lazy",
+                ref: N
+              }
+            ),
+            m && /* @__PURE__ */ g("div", { className: n["preview-buttons"], children: [
+              /* @__PURE__ */ l(
+                F,
+                {
+                  label: "Save",
+                  loading: e.isUploading,
+                  onClick: () => {
+                    p && e.handleUpload && e.handleUpload(p);
+                  },
+                  variant: "primary"
+                }
+              ),
+              /* @__PURE__ */ l(
+                F,
+                {
+                  label: "Cancel",
+                  onClick: () => I()
+                }
+              )
+            ] })
+          ] })
+        ]
+      }
+    ),
+    /* @__PURE__ */ l(
+      T,
+      {
+        open: !!_,
+        button: "Ok",
+        message: _,
+        onSubmit: () => {
+          r(null), I();
+        }
+      }
+    )
+  ] });
+};
+export {
+  ae as Picture
+};
+//# sourceMappingURL=index.js.map

package/dist/components/picture/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/picture/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { Button } from '@/components/button';\nimport { Dialog } from '@/components/dialog';\nimport { Dropzone } from '@/components/dropzone';\nimport { Figure } from '@/components/figure';\nimport { Icon } from '@/components/icon';\n\nimport styles from './styles.module.css';\n\nconst variants = {\n  default: styles.default,\n  profile: styles.profile,\n};\n\nexport type ImageProps = {\n  alt: string;\n  canEdit: boolean;\n  caption?: string;\n  handleUpload?: (imageFile: File) => void;\n  inputId?: string;\n  isUploading?: boolean;\n  minimumImagePixelHeight?: number;\n  minimumImagePixelWidth?: number;\n  placeholderSrc?: string;\n  sizes?: string;\n  source?: string;\n  srcSet?: string;\n  variant?: keyof typeof variants;\n};\n\nexport const Picture = ({ source, alt, variant = 'default', ...props }: ImageProps) => {\n  const [imageSrc, setImageSrc] = useState(props.placeholderSrc ?? source);\n  const [imageLoaded, setImageLoaded] = useState(false);\n  const [pendingFile, setPendingFile] = useState<File | null>(null);\n  const [showDropzone, setShowDropzone] = useState(false);\n  const [isPreviewing, setIsPreviewing] = useState(false);\n  const [dialogWarning, setDialogWarning] = useState<string | null>(null);\n\n  const minimumImagePixelWidth = props.minimumImagePixelWidth ?? 400;\n  const minimumImagePixelHeight = props.minimumImagePixelHeight ?? 400;\n  const imgRef = useRef<HTMLImageElement>(null);\n\n  const reset = useCallback(() => {\n    setIsPreviewing(false);\n    setPendingFile(null);\n    setImageSrc(source);\n    setDialogWarning(null);\n  }, [source]);\n\n  const allowedImageFileTypes = [\n    'image/jpeg',\n    'image/png',\n    'image/gif',\n    'image/webp',\n    'image/bmp',\n    'image/svg+xml',\n    'image/tiff',\n  ];\n\n  useEffect(() => {\n    if (!source) {\n      return;\n    }\n\n    setImageSrc(source);\n    setIsPreviewing(false);\n    const img = new window.Image(0, 0);\n    img.src = source;\n    img.srcset = props.srcSet ?? source;\n    img.onload = () => {\n      setImageLoaded(true);\n    };\n  }, [source, props.srcSet]);\n\n  const handleFiles = (files: FileList | File[]) => {\n    const file = files[0];\n    if (!file) return;\n\n    if (!allowedImageFileTypes.includes(file.type)) {\n      setDialogWarning('Unsupported file type. Please upload a valid image.');\n    }\n\n    const reader = new FileReader();\n    reader.onload = (event) => {\n      const img = new window.Image();\n      img.onload = () => {\n        if (img.width < minimumImagePixelWidth || img.height < minimumImagePixelHeight) {\n          setDialogWarning(\n            `Image is too small. Minimum size is ${minimumImagePixelWidth}x${minimumImagePixelHeight}px.`\n          );\n        }\n        setIsPreviewing(true);\n        setImageSrc(event.target?.result as string);\n      };\n      img.src = event.target?.result as string;\n    };\n    reader.readAsDataURL(file);\n    setPendingFile(file);\n  };\n\n  return (\n    <>\n      <div\n        className={cx(styles.picture, variants[variant], isPreviewing ? styles.previewing : '')}\n        onMouseEnter={() => setShowDropzone(props.canEdit)}\n        onMouseLeave={() => setShowDropzone(false)}\n        onDragOver={(e) => {\n          e.preventDefault();\n          setShowDropzone(props.canEdit);\n        }}\n        onDragLeave={() => setShowDropzone(false)}\n        onDrop={(e) => {\n          e.preventDefault();\n          setShowDropzone(false);\n          if (props.canEdit) {\n            handleFiles(e.dataTransfer?.files);\n          }\n        }}\n      >\n        {isPreviewing ? null : (\n          <div\n            className={cx(\n              styles.dropzone,\n              showDropzone && styles.visible,\n              props.canEdit ? '' : styles.hidden\n            )}\n          >\n            <Dropzone\n              onUpload={(files) => {\n                handleFiles(files);\n              }}\n              mimeTypes={allowedImageFileTypes}\n              inputId={props.inputId}\n            />\n          </div>\n        )}\n\n        {variant === 'profile' && !source ? (\n          <Icon name={'user'} />\n        ) : (\n          <Figure label={props.caption}>\n            <img\n              src={imageSrc}\n              srcSet={props.srcSet}\n              sizes={props.sizes}\n              alt={alt}\n              className={cx(\n                styles.image,\n                isPreviewing ? styles.previewing : '',\n                imageLoaded ? '' : 'loading'\n              )}\n              loading={'lazy'}\n              ref={imgRef}\n            />\n            {isPreviewing && (\n              <div className={styles['preview-buttons']}>\n                <Button\n                  label={'Save'}\n                  loading={props.isUploading}\n                  onClick={() => {\n                    if (pendingFile && props.handleUpload) {\n                      props.handleUpload(pendingFile);\n                    }\n                  }}\n                  variant={'primary'}\n                />\n                <Button\n                  label={'Cancel'}\n                  onClick={() => reset()}\n                />\n              </div>\n            )}\n          </Figure>\n        )}\n      </div>\n\n      <Dialog\n        open={!!dialogWarning}\n        button={'Ok'}\n        message={dialogWarning!}\n        onSubmit={() => {\n          setDialogWarning(null);\n          reset();\n        }}\n      />\n    </>\n  );\n};\n"],"names":["variants","styles","Picture","source","alt","variant","props","imageSrc","setImageSrc","useState","imageLoaded","setImageLoaded","pendingFile","setPendingFile","showDropzone","setShowDropzone","isPreviewing","setIsPreviewing","dialogWarning","setDialogWarning","minimumImagePixelWidth","minimumImagePixelHeight","imgRef","useRef","reset","useCallback","allowedImageFileTypes","useEffect","img","handleFiles","files","file","reader","event","_a","jsxs","Fragment","cx","e","jsx","Dropzone","Icon","Figure","Button","Dialog"],"mappings":"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"}

package/dist/components/toggle/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index2.css');const e=require("react/jsx-runtime"),r=require("../../classix-5H4IWnMA.cjs"),d=require("../../styles.module-B_pXIacc.cjs"),g="_toggle_12y8y_1",i="_track_12y8y_15",u="_dot_12y8y_24",t={toggle:g,track:i,dot:u},y=({isChecked:c,isDefaultChecked:l,isDisabled:o,isLoading:s,label:a,onChange:n})=>e.jsxs("label",{className:t.toggle,children:[e.jsx("input",{checked:c,defaultChecked:l,disabled:o||s,onChange:n,type:"checkbox"}),e.jsx("span",{"aria-hidden":"true",className:t.track,children:e.jsx("span",{className:r.t(t.dot,s&&d.loadingStyles.spinner)})}),e.jsx("span",{className:"toggle",children:a})]});exports.Toggle=y;
+//# sourceMappingURL=index.cjs.map

package/dist/components/toggle/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../src/components/toggle/index.tsx"],"sourcesContent":["import cx from 'classix';\n\nimport loadingStyles from '../loading/styles.module.css';\nimport styles from './styles.module.css';\n\nexport type ToggleProps = {\n  isChecked?: boolean;\n  isDefaultChecked?: boolean;\n  isDisabled?: boolean;\n  isLoading?: boolean;\n  label?: string;\n  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n};\n\nexport const Toggle = ({\n  isChecked,\n  isDefaultChecked,\n  isDisabled,\n  isLoading,\n  label,\n  onChange,\n}: ToggleProps) => {\n  return (\n    <label className={styles.toggle}>\n      <input\n        checked={isChecked}\n        defaultChecked={isDefaultChecked}\n        disabled={isDisabled || isLoading}\n        onChange={onChange}\n        type='checkbox'\n      />\n      <span\n        aria-hidden='true'\n        className={styles.track}\n      >\n        <span className={cx(styles.dot, isLoading && loadingStyles.spinner)}></span>\n      </span>\n      <span className='toggle'>{label}</span>\n    </label>\n  );\n};\n"],"names":["Toggle","isChecked","isDefaultChecked","isDisabled","isLoading","label","onChange","jsxs","styles","jsx","cx","loadingStyles"],"mappings":"gSAcaA,EAAS,CAAC,CACrB,UAAAC,EACA,iBAAAC,EACA,WAAAC,EACA,UAAAC,EACA,MAAAC,EACA,SAAAC,CACF,IAEIC,EAAAA,KAAC,QAAA,CAAM,UAAWC,EAAO,OACvB,SAAA,CAAAC,EAAAA,IAAC,QAAA,CACC,QAASR,EACT,eAAgBC,EAChB,SAAUC,GAAcC,EACxB,SAAAE,EACA,KAAK,UAAA,CAAA,EAEPG,EAAAA,IAAC,OAAA,CACC,cAAY,OACZ,UAAWD,EAAO,MAElB,SAAAC,EAAAA,IAAC,QAAK,UAAWC,EAAAA,EAAGF,EAAO,IAAKJ,GAAaO,EAAAA,cAAc,OAAO,CAAA,CAAG,CAAA,CAAA,EAEvEF,EAAAA,IAAC,OAAA,CAAK,UAAU,SAAU,SAAAJ,CAAA,CAAM,CAAA,EAClC"}

package/dist/components/toggle/index.js

@@ -0,0 +1,39 @@
+import { jsxs as n, jsx as t } from "react/jsx-runtime";
+import { t as d } from "../../classix-DG18itHa.js";
+import { l as g } from "../../styles.module-BhmNqlYd.js";
+import '../../assets/index2.css';const i = "_toggle_12y8y_1", m = "_track_12y8y_15", p = "_dot_12y8y_24", e = {
+  toggle: i,
+  track: m,
+  dot: p
+}, k = ({
+  isChecked: o,
+  isDefaultChecked: a,
+  isDisabled: c,
+  isLoading: s,
+  label: l,
+  onChange: r
+}) => /* @__PURE__ */ n("label", { className: e.toggle, children: [
+  /* @__PURE__ */ t(
+    "input",
+    {
+      checked: o,
+      defaultChecked: a,
+      disabled: c || s,
+      onChange: r,
+      type: "checkbox"
+    }
+  ),
+  /* @__PURE__ */ t(
+    "span",
+    {
+      "aria-hidden": "true",
+      className: e.track,
+      children: /* @__PURE__ */ t("span", { className: d(e.dot, s && g.spinner) })
+    }
+  ),
+  /* @__PURE__ */ t("span", { className: "toggle", children: l })
+] });
+export {
+  k as Toggle
+};
+//# sourceMappingURL=index.js.map

package/dist/components/toggle/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/toggle/index.tsx"],"sourcesContent":["import cx from 'classix';\n\nimport loadingStyles from '../loading/styles.module.css';\nimport styles from './styles.module.css';\n\nexport type ToggleProps = {\n  isChecked?: boolean;\n  isDefaultChecked?: boolean;\n  isDisabled?: boolean;\n  isLoading?: boolean;\n  label?: string;\n  onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;\n};\n\nexport const Toggle = ({\n  isChecked,\n  isDefaultChecked,\n  isDisabled,\n  isLoading,\n  label,\n  onChange,\n}: ToggleProps) => {\n  return (\n    <label className={styles.toggle}>\n      <input\n        checked={isChecked}\n        defaultChecked={isDefaultChecked}\n        disabled={isDisabled || isLoading}\n        onChange={onChange}\n        type='checkbox'\n      />\n      <span\n        aria-hidden='true'\n        className={styles.track}\n      >\n        <span className={cx(styles.dot, isLoading && loadingStyles.spinner)}></span>\n      </span>\n      <span className='toggle'>{label}</span>\n    </label>\n  );\n};\n"],"names":["Toggle","isChecked","isDefaultChecked","isDisabled","isLoading","label","onChange","jsxs","styles","jsx","cx","loadingStyles"],"mappings":";;;;;;;GAcaA,IAAS,CAAC;AAAA,EACrB,WAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AACF,MAEI,gBAAAC,EAAC,SAAA,EAAM,WAAWC,EAAO,QACvB,UAAA;AAAA,EAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,SAASR;AAAA,MACT,gBAAgBC;AAAA,MAChB,UAAUC,KAAcC;AAAA,MACxB,UAAAE;AAAA,MACA,MAAK;AAAA,IAAA;AAAA,EAAA;AAAA,EAEP,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,eAAY;AAAA,MACZ,WAAWD,EAAO;AAAA,MAElB,UAAA,gBAAAC,EAAC,UAAK,WAAWC,EAAGF,EAAO,KAAKJ,KAAaO,EAAc,OAAO,EAAA,CAAG;AAAA,IAAA;AAAA,EAAA;AAAA,EAEvE,gBAAAF,EAAC,QAAA,EAAK,WAAU,UAAU,UAAAJ,EAAA,CAAM;AAAA,GAClC;"}

package/dist/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./assets/index.css');const n=require("./components/accordion/index.cjs"),e=require("./components/aside/index.cjs"),o=require("./components/banner/index.cjs"),r=require("./components/branding/index.cjs"),i=require("./components/button/index.cjs"),t=require("./components/card/index.cjs"),c=require("./components/dialog/index.cjs"),d=require("./components/dropdown/index.cjs"),s=require("./components/editor/index.cjs"),_=require("./components/figure/index.cjs"),u=require("./components/header/index.cjs"),p=require("./components/icon/index.cjs"),a=require("./components/input/index.cjs"),m=require("./components/link/index.cjs"),q=require("./components/list/index.cjs"),x=require("./components/nav/index.cjs");exports.Accordion=n.Accordion;exports.AccordionGroup=n.AccordionGroup;exports.Aside=e.Aside;exports.Banner=o.Banner;exports.Branding=r.Branding;exports.Button=i.Button;exports.Card=t.Card;exports.Dialog=c.Dialog;exports.Dropdown=d.Dropdown;exports.Editor=s.Editor;exports.Figure=_.Figure;exports.Header=u.Header;exports.Icon=p.Icon;exports.Input=a.Input;exports.Link=m.Link;exports.List=q.List;exports.Nav=x.Nav;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./assets/index.css');const e=require("./components/accordion/index.cjs"),n=require("./components/aside/index.cjs"),o=require("./components/banner/index.cjs"),r=require("./components/branding/index.cjs"),i=require("./components/button/index.cjs"),t=require("./components/card/index.cjs"),c=require("./components/checkbox/index.cjs"),d=require("./components/dialog/index.cjs"),s=require("./components/document/index.cjs"),_=require("./components/dropdown/index.cjs"),u=require("./components/dropzone/index.cjs"),p=require("./components/editor/index.cjs"),m=require("./components/figure/index.cjs"),a=require("./components/footer/index.cjs"),x=require("./components/form/index.cjs"),q=require("./components/grid/index.cjs"),g=require("./components/header/index.cjs"),l=require("./components/icon/index.cjs"),b=require("./components/input/index.cjs"),D=require("./components/layout/index.cjs"),L=require("./components/link/index.cjs"),k=require("./components/list/index.cjs"),A=require("./components/nav/index.cjs"),B=require("./components/loading/index.cjs"),F=require("./components/picture/index.cjs"),y=require("./components/toggle/index.cjs");exports.Accordion=e.Accordion;exports.AccordionGroup=e.AccordionGroup;exports.Aside=n.Aside;exports.Banner=o.Banner;exports.Branding=r.Branding;exports.Button=i.Button;exports.Card=t.Card;exports.Checkbox=c.Checkbox;exports.Dialog=d.Dialog;exports.Document=s.Document;exports.Dropdown=_.Dropdown;exports.Dropzone=u.Dropzone;exports.Editor=p.Editor;exports.Figure=m.Figure;exports.Footer=a.Footer;exports.Form=x.Form;exports.Grid=q.Grid;exports.Header=g.Header;exports.Icon=l.Icon;exports.Input=b.Input;exports.Layout=D.Layout;exports.Link=L.Link;exports.List=k.List;exports.Nav=A.Nav;exports.PageLoader=B.PageLoader;exports.Picture=F.Picture;exports.Toggle=y.Toggle;
 //# sourceMappingURL=index.cjs.map

package/dist/index.d.ts

@@ -1,7 +1,10 @@
+import { default as default_2 } from 'react';
 import { DetailedHTMLProps } from 'react';
+import { DragEvent as DragEvent_2 } from 'react';
 import { ForwardRefExoticComponent } from 'react';
 import { InputHTMLAttributes } from 'react';
 import { JSX } from 'react/jsx-runtime';
+import { ReactNode } from 'react';
 import { RefAttributes } from 'react';
 
 export declare const Accordion: ({ children, icon, label, open }: AccordionProps) => JSX.Element;
@@ -55,29 +58,44 @@ declare const brandingSVG: {
     logo: string;
 };
 
-export declare const Button: ({ children, className, disabled, label, title, icon, iconOnly, type, variant, ...props }: ButtonProps) => JSX.Element;
+export declare const Button: ({ children, className, disabled, icon, label, loading, onClick, title, type, variant, ...props }: ButtonProps) => JSX.Element;
 
 declare type ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & {
     children?: React.ReactNode;
     className?: string;
     disabled?: boolean;
+    icon?: IconName;
     label?: string;
+    onClick?: React.MouseEventHandler<HTMLButtonElement>;
+    loading?: boolean;
     title?: string;
-    iconOnly?: boolean;
-    icon?: IconName;
-    variant?: keyof typeof variants_3;
     type?: 'button' | 'submit' | 'reset';
+    variant?: keyof typeof variants_3;
 };
 
-export declare const Card: ({ ...props }: CardProps) => JSX.Element;
+export declare const Card: ({ children, contentHtml, contentText, draft, headerText, image, onClick, onDrop, subHeaderText, }: CardProps) => JSX.Element;
 
 declare type CardProps = {
-    image?: React.ReactNode;
-    headerText?: string;
-    subHeaderText?: string;
+    children?: ReactNode;
+    contentHtml?: string;
     contentText?: string;
-    children: React.ReactNode;
+    draft?: boolean;
+    headerText?: string;
+    image?: ReactNode;
     onClick?: () => void;
+    onDrop?: (event: DragEvent_2<HTMLElement>) => void;
+    subHeaderText?: string;
+};
+
+export declare const Checkbox: ({ isChecked, isDefaultChecked, isDisabled, isLoading, label, onChange, ...props }: CheckboxProps) => JSX.Element;
+
+declare type CheckboxProps = React.InputHTMLAttributes<HTMLInputElement> & {
+    isChecked?: boolean;
+    isDefaultChecked?: boolean;
+    isDisabled?: boolean;
+    isLoading?: boolean;
+    label?: string;
+    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
 };
 
 export declare const Dialog: ({ button, children, message, title, ...props }: DialogProps) => JSX.Element;
@@ -89,18 +107,45 @@ declare type DialogProps = React.DialogHTMLAttributes<HTMLDialogElement> & {
     title?: string;
 };
 
-export declare const Dropdown: ({ children, ...props }: DropdownProps) => JSX.Element;
+declare type DivProps = Omit<default_2.HTMLAttributes<HTMLDivElement>, 'children'>;
+
+declare const Document_2: ({ name, onClick, onDelete }: DocumentProps) => JSX.Element;
+export { Document_2 as Document }
 
-declare type DropdownProps = {
+declare type DocumentProps = {
+    name: string;
+    onClick?: () => void;
+    onDelete?: () => void;
+};
+
+export declare const Dropdown: ({ children, inline, label, placeholder, ...props }: DropdownProps) => JSX.Element;
+
+declare type DropdownProps = React.SelectHTMLAttributes<HTMLSelectElement> & {
     children?: React.ReactNode;
+    inline?: boolean;
+    label?: string;
+    placeholder?: string;
+};
+
+export declare const Dropzone: (props: DropzoneProps) => JSX.Element;
+
+declare type DropzoneProps = {
+    allowDirectoryUpload?: boolean;
+    inputId?: string;
+    isMultiple?: boolean;
+    label?: string;
+    maxFileSizeMB?: number;
+    mimeTypes?: string[];
+    onUpload: (uploadContent: File[] | FileList) => void;
 };
 
-export declare const Editor: ({ autofocus, autolink, content, onChange }: EditorProps) => JSX.Element;
+export declare const Editor: ({ autofocus, autolink, content, inline, onChange, }: EditorProps) => JSX.Element;
 
 declare type EditorProps = {
     autofocus?: boolean;
     autolink?: boolean;
     content?: string;
+    inline?: boolean;
     onChange?: (html: string) => void;
 };
 
@@ -111,42 +156,111 @@ declare type FigureProps = {
     label?: string;
 };
 
-export declare const Header: ({ children, size, label, subtitle }: HeaderProps) => JSX.Element;
+export declare const Footer: ({ children, ...props }: FooterProps) => JSX.Element;
+
+declare type FooterProps = {
+    children?: React.ReactNode;
+};
+
+export declare const Form: ({ animation, children, inline, ...props }: FormProps) => JSX.Element;
+
+declare type FormProps = React.FormHTMLAttributes<HTMLFormElement> & {
+    animation?: AnimationName;
+    children?: React.ReactNode;
+    inline?: boolean;
+};
+
+export declare const Grid: ({ canRearrange, className, columns, items, onRearrange, ...props }: GridProps) => JSX.Element;
+
+declare type GridItem = {
+    component: default_2.ReactNode;
+    id: number;
+};
+
+declare type GridProps = DivProps & {
+    canRearrange?: boolean;
+    columns?: number;
+    items: GridItem[];
+    onRearrange?: (items: Array<{
+        id: number;
+        index: number;
+    }>) => void;
+};
+
+export declare const Header: ({ children, size, label, ...props }: HeaderProps) => JSX.Element;
 
 declare type HeaderProps = {
     children?: React.ReactNode;
-    label: string;
+    label?: string;
     size?: 1 | 2 | 3;
-    subtitle?: string;
+    superHeader?: string;
+    subHeader?: string;
 };
 
-export declare const Icon: ({ name, size, variant }: IconProps) => JSX.Element;
+export declare const Icon: ({ name, size, variant, loading, }: IconProps) => JSX.Element;
 
 declare type IconName = keyof typeof iconPaths;
 
 declare const iconPaths: {
     bold: string;
+    buildings: string;
+    card: string;
     chevron: string;
+    clipboard: string;
+    gear: string;
+    document: string;
     home: string;
     italic: string;
     link: string;
     list: string;
+    pencil: string;
+    people: string;
+    phone: string;
+    plus: string;
     search: string;
+    toDocument: string;
+    upload: string;
+    user: string;
     x: string;
 };
 
 declare type IconProps = {
-    variant?: keyof typeof variants_4;
     name: IconName;
     size?: keyof typeof sizes;
+    variant?: keyof typeof variants_4;
+    loading?: boolean;
+};
+
+declare type ImageProps = {
+    alt: string;
+    canEdit: boolean;
+    caption?: string;
+    handleUpload?: (imageFile: File) => void;
+    inputId?: string;
+    isUploading?: boolean;
+    minimumImagePixelHeight?: number;
+    minimumImagePixelWidth?: number;
+    placeholderSrc?: string;
+    sizes?: string;
+    source?: string;
+    srcSet?: string;
+    variant?: keyof typeof variants_6;
 };
 
 export declare const Input: ForwardRefExoticComponent<Omit<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & {
 disabled?: boolean;
+label?: string;
 placeholder?: string;
-type?: "text" | "password" | "search" | "number";
+type?: "datetime-local" | "email" | "number" | "password" | "radio" | "search" | "tel" | "text";
 } & RefAttributes<HTMLInputElement>>;
 
+export declare const Layout: ({ children, feature, ...props }: LayoutProps) => JSX.Element;
+
+declare type LayoutProps = {
+    children: React.ReactNode;
+    feature: 'home';
+};
+
 export declare const Link: ({ children, className, to, label, ...props }: LinkProps) => JSX.Element;
 
 declare type LinkProps = React.AnchorHTMLAttributes<HTMLAnchorElement> & {
@@ -163,23 +277,46 @@ declare type ListProps = {
     className?: string;
 };
 
-export declare const Nav: ({ animation, children, horizontal, variant }: NavProps) => JSX.Element;
+export declare const Nav: ({ animation, children, horizontal, variant, ...props }: NavProps) => JSX.Element;
 
 declare type NavProps = {
     animation?: AnimationName;
     children?: React.ReactNode;
     horizontal?: boolean;
+    isResultsPage?: boolean;
+    isSearchable?: boolean;
+    onSearchSubmit?: (value: string) => void;
     variant?: keyof typeof variants_5;
 };
 
+export declare const PageLoader: ({ size }: PageLoaderProps) => JSX.Element;
+
+declare type PageLoaderProps = {
+    size?: number;
+};
+
+export declare const Picture: ({ source, alt, variant, ...props }: ImageProps) => JSX.Element;
+
 declare const sizes: {
-    medium: string;
     large: string;
+    medium: string;
     small: string;
 };
 
+export declare const Toggle: ({ isChecked, isDefaultChecked, isDisabled, isLoading, label, onChange, }: ToggleProps) => JSX.Element;
+
+declare type ToggleProps = {
+    isChecked?: boolean;
+    isDefaultChecked?: boolean;
+    isDisabled?: boolean;
+    isLoading?: boolean;
+    label?: string;
+    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
+};
+
 declare const variants: {
     default: string;
+    right: string;
     'site-wide': string;
 };
 
@@ -199,15 +336,22 @@ declare const variants_3: {
 };
 
 declare const variants_4: {
+    clickable: string;
     default: string;
+    deletable: string;
     dialog: string;
     white: string;
 };
 
 declare const variants_5: {
     default: string;
-    tabs: string;
     pills: string;
+    tabs: string;
+};
+
+declare const variants_6: {
+    default: string;
+    profile: string;
 };
 
 export { }

package/dist/index.js

@@ -1,36 +1,56 @@
 import { Accordion as e, AccordionGroup as t } from "./components/accordion/index.js";
-import { Aside as f } from "./components/aside/index.js";
-import { Banner as x } from "./components/banner/index.js";
+import { Aside as m } from "./components/aside/index.js";
+import { Banner as f } from "./components/banner/index.js";
 import { Branding as i } from "./components/branding/index.js";
 import { Button as a } from "./components/button/index.js";
 import { Card as u } from "./components/card/index.js";
+import { Checkbox as D } from "./components/checkbox/index.js";
 import { Dialog as A } from "./components/dialog/index.js";
-import { Dropdown as s } from "./components/dropdown/index.js";
+import { Document as F } from "./components/document/index.js";
+import { Dropdown as l } from "./components/dropdown/index.js";
+import { Dropzone as C } from "./components/dropzone/index.js";
 import { Editor as I } from "./components/editor/index.js";
-import { Figure as k } from "./components/figure/index.js";
-import { Header as v } from "./components/header/index.js";
-import { Icon as C } from "./components/icon/index.js";
-import { Input as F } from "./components/input/index.js";
-import { Link as H } from "./components/link/index.js";
-import { List as b } from "./components/list/index.js";
-import { Nav as j } from "./components/nav/index.js";
+import { Figure as b } from "./components/figure/index.js";
+import { Footer as v } from "./components/footer/index.js";
+import { Form as y } from "./components/form/index.js";
+import { Grid as E } from "./components/grid/index.js";
+import { Header as N } from "./components/header/index.js";
+import { Icon as j } from "./components/icon/index.js";
+import { Input as J } from "./components/input/index.js";
+import { Layout as M } from "./components/layout/index.js";
+import { Link as Q } from "./components/link/index.js";
+import { List as S } from "./components/list/index.js";
+import { Nav as V } from "./components/nav/index.js";
+import { PageLoader as X } from "./components/loading/index.js";
+import { Picture as Z } from "./components/picture/index.js";
+import { Toggle as $ } from "./components/toggle/index.js";
 import './assets/index.css';export {
   e as Accordion,
   t as AccordionGroup,
-  f as Aside,
-  x as Banner,
+  m as Aside,
+  f as Banner,
   i as Branding,
   a as Button,
   u as Card,
+  D as Checkbox,
   A as Dialog,
-  s as Dropdown,
+  F as Document,
+  l as Dropdown,
+  C as Dropzone,
   I as Editor,
-  k as Figure,
-  v as Header,
-  C as Icon,
-  F as Input,
-  H as Link,
-  b as List,
-  j as Nav
+  b as Figure,
+  v as Footer,
+  y as Form,
+  E as Grid,
+  N as Header,
+  j as Icon,
+  J as Input,
+  M as Layout,
+  Q as Link,
+  S as List,
+  V as Nav,
+  X as PageLoader,
+  Z as Picture,
+  $ as Toggle
 };
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/styles.module-B_pXIacc.cjs

@@ -0,0 +1,2 @@
+"use strict";require('./assets/styles.css');const s="_spinner_gsv2s_1",n={spinner:s};exports.loadingStyles=n;
+//# sourceMappingURL=styles.module-B_pXIacc.cjs.map

package/dist/styles.module-B_pXIacc.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.module-B_pXIacc.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/styles.module-BhmNqlYd.js

@@ -0,0 +1,7 @@
+import './assets/styles.css';const n = "_spinner_gsv2s_1", s = {
+  spinner: n
+};
+export {
+  s as l
+};
+//# sourceMappingURL=styles.module-BhmNqlYd.js.map

package/dist/styles.module-BhmNqlYd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.module-BhmNqlYd.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}