@payloadcms/ui 3.0.0-beta.9 → 3.0.0-canary.03427d3

package/dist/elements/Autosave/index.js

@@ -1,30 +1,41 @@
 'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { versionDefaults } from 'payload/shared';
 import React, { useEffect, useRef, useState } from 'react';
-import { useAllFormFields, useFormModified } from '../../forms/Form/context.js';
+import { toast } from 'sonner';
+import { useAllFormFields, useForm, useFormModified, useFormSubmitted } from '../../forms/Form/context.js';
 import { useDebounce } from '../../hooks/useDebounce.js';
 import { useConfig } from '../../providers/Config/index.js';
+import { useDocumentEvents } from '../../providers/DocumentEvents/index.js';
 import { useDocumentInfo } from '../../providers/DocumentInfo/index.js';
 import { useLocale } from '../../providers/Locale/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
 import { formatTimeToNow } from '../../utilities/formatDate.js';
-import { reduceFieldsToValues } from '../../utilities/reduceFieldsToValues.js';
+import { reduceFieldsToValuesWithValidation } from '../../utilities/reduceFieldsToValuesWithValidation.js';
+import './index.scss';
 const baseClass = 'autosave';
 export const Autosave = ({ id, collection, global: globalDoc, publishedDocUpdatedAt })=>{
     const { routes: { api }, serverURL } = useConfig();
     const { docConfig, getVersions, versions } = useDocumentInfo();
+    const { reportUpdate } = useDocumentEvents();
+    const { dispatchFields, setSubmitted } = useForm();
+    const submitted = useFormSubmitted();
     const versionsConfig = docConfig?.versions;
     const [fields] = useAllFormFields();
-    const modified = useFormModified();
+    const formModified = useFormModified();
     const { code: locale } = useLocale();
     const { i18n, t } = useTranslation();
-    let interval = 800;
-    if (versionsConfig.drafts && versionsConfig?.drafts?.autosave) interval = versionsConfig.drafts.autosave.interval;
+    let interval = versionDefaults.autosaveInterval;
+    if (versionsConfig.drafts && versionsConfig.drafts.autosave) interval = versionsConfig.drafts.autosave.interval;
     const [saving, setSaving] = useState(false);
     const [lastSaved, setLastSaved] = useState();
     const debouncedFields = useDebounce(fields, interval);
+    const modified = useDebounce(formModified, interval);
     const fieldRef = useRef(fields);
     const modifiedRef = useRef(modified);
     const localeRef = useRef(locale);
+    const debouncedRef = useRef(debouncedFields);
+    debouncedRef.current = debouncedFields;
     // Store fields in ref so the autosave func
     // can always retrieve the most to date copies
     // after the timeout has executed
@@ -38,38 +49,97 @@ export const Autosave = ({ id, collection, global: globalDoc, publishedDocUpdate
     localeRef.current = locale;
     // When debounced fields change, autosave
     useEffect(()=>{
+        const abortController = new AbortController();
+        let autosaveTimeout = undefined;
         const autosave = ()=>{
             if (modified) {
                 setSaving(true);
                 let url;
                 let method;
+                let entitySlug;
                 if (collection && id) {
-                    url = `${serverURL}${api}/${collection.slug}/${id}?draft=true&autosave=true&locale=${localeRef.current}`;
+                    entitySlug = collection.slug;
+                    url = `${serverURL}${api}/${entitySlug}/${id}?draft=true&autosave=true&locale=${localeRef.current}`;
                     method = 'PATCH';
                 }
                 if (globalDoc) {
-                    url = `${serverURL}${api}/globals/${globalDoc.slug}?draft=true&autosave=true&locale=${localeRef.current}`;
+                    entitySlug = globalDoc.slug;
+                    url = `${serverURL}${api}/globals/${entitySlug}?draft=true&autosave=true&locale=${localeRef.current}`;
                     method = 'POST';
                 }
                 if (url) {
-                    setTimeout(async ()=>{
+                    autosaveTimeout = setTimeout(async ()=>{
                         if (modifiedRef.current) {
-                            const body = {
-                                ...reduceFieldsToValues(fieldRef.current, true),
-                                _status: 'draft'
+                            const { data, valid } = {
+                                ...reduceFieldsToValuesWithValidation(fieldRef.current, true)
                             };
-                            const res = await fetch(url, {
-                                body: JSON.stringify(body),
-                                credentials: 'include',
-                                headers: {
-                                    'Accept-Language': i18n.language,
-                                    'Content-Type': 'application/json'
-                                },
-                                method
-                            });
-                            if (res.status === 200) {
-                                setLastSaved(new Date().getTime());
-                                void getVersions();
+                            data._status = 'draft';
+                            const skipSubmission = submitted && !valid && versionsConfig?.drafts && versionsConfig?.drafts?.validate;
+                            if (!skipSubmission) {
+                                const res = await fetch(url, {
+                                    body: JSON.stringify(data),
+                                    credentials: 'include',
+                                    headers: {
+                                        'Accept-Language': i18n.language,
+                                        'Content-Type': 'application/json'
+                                    },
+                                    method,
+                                    signal: abortController.signal
+                                });
+                                if (res.status === 200) {
+                                    const newDate = new Date();
+                                    setLastSaved(newDate.getTime());
+                                    reportUpdate({
+                                        id,
+                                        entitySlug,
+                                        updatedAt: newDate.toISOString()
+                                    });
+                                    void getVersions();
+                                }
+                                if (versionsConfig?.drafts && versionsConfig?.drafts?.validate && res.status === 400) {
+                                    const json = await res.json();
+                                    if (Array.isArray(json.errors)) {
+                                        const [fieldErrors, nonFieldErrors] = json.errors.reduce(([fieldErrs, nonFieldErrs], err)=>{
+                                            const newFieldErrs = [];
+                                            const newNonFieldErrs = [];
+                                            if (err?.message) {
+                                                newNonFieldErrs.push(err);
+                                            }
+                                            if (Array.isArray(err?.data)) {
+                                                err.data.forEach((dataError)=>{
+                                                    if (dataError?.field) {
+                                                        newFieldErrs.push(dataError);
+                                                    } else {
+                                                        newNonFieldErrs.push(dataError);
+                                                    }
+                                                });
+                                            }
+                                            return [
+                                                [
+                                                    ...fieldErrs,
+                                                    ...newFieldErrs
+                                                ],
+                                                [
+                                                    ...nonFieldErrs,
+                                                    ...newNonFieldErrs
+                                                ]
+                                            ];
+                                        }, [
+                                            [],
+                                            []
+                                        ]);
+                                        dispatchFields({
+                                            type: 'ADD_SERVER_ERRORS',
+                                            errors: fieldErrors
+                                        });
+                                        nonFieldErrors.forEach((err)=>{
+                                            toast.error(err.message || i18n.t('error:unknown'));
+                                        });
+                                        setSubmitted(true);
+                                        setSaving(false);
+                                        return;
+                                    }
+                                }
                             }
                         }
                         setSaving(false);
@@ -78,16 +148,27 @@ export const Autosave = ({ id, collection, global: globalDoc, publishedDocUpdate
             }
         };
         void autosave();
+        return ()=>{
+            clearTimeout(autosaveTimeout);
+            if (abortController.signal) abortController.abort();
+            setSaving(false);
+        };
     }, [
-        i18n,
-        debouncedFields,
-        modified,
-        serverURL,
         api,
         collection,
+        dispatchFields,
+        getVersions,
         globalDoc,
+        i18n,
         id,
-        getVersions
+        interval,
+        modified,
+        reportUpdate,
+        serverURL,
+        setSubmitted,
+        versionsConfig?.drafts,
+        debouncedFields,
+        submitted
     ]);
     useEffect(()=>{
         if (versions?.docs?.[0]) {
@@ -99,14 +180,20 @@ export const Autosave = ({ id, collection, global: globalDoc, publishedDocUpdate
         publishedDocUpdatedAt,
         versions
     ]);
-    return /*#__PURE__*/ React.createElement("div", {
-        className: baseClass
-    }, saving && t('general:saving'), !saving && lastSaved && /*#__PURE__*/ React.createElement(React.Fragment, null, t('version:lastSavedAgo', {
-        distance: formatTimeToNow({
-            date: lastSaved,
-            i18n
-        })
-    })));
+    return /*#__PURE__*/ _jsxs("div", {
+        className: baseClass,
+        children: [
+            saving && t('general:saving'),
+            !saving && lastSaved && /*#__PURE__*/ _jsx(React.Fragment, {
+                children: t('version:lastSavedAgo', {
+                    distance: formatTimeToNow({
+                        date: lastSaved,
+                        i18n
+                    })
+                })
+            })
+        ]
+    });
 };
 
 //# sourceMappingURL=index.js.map

package/dist/elements/Autosave/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Autosave/index.tsx"],"sourcesContent":["'use client'\n// TODO: abstract the `next/navigation` dependency out from this component\nimport type { ClientCollectionConfig, ClientGlobalConfig } from 'payload/types'\n\nimport React, { useEffect, useRef, useState } from 'react'\n\nimport { useAllFormFields, useFormModified } from '../../forms/Form/context.js'\nimport { useDebounce } from '../../hooks/useDebounce.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { formatTimeToNow } from '../../utilities/formatDate.js'\nimport { reduceFieldsToValues } from '../../utilities/reduceFieldsToValues.js'\nimport './index.scss'\n\nconst baseClass = 'autosave'\n\nexport type Props = {\n  collection?: ClientCollectionConfig\n  global?: ClientGlobalConfig\n  id?: number | string\n  publishedDocUpdatedAt: string\n}\n\nexport const Autosave: React.FC<Props> = ({\n  id,\n  collection,\n  global: globalDoc,\n  publishedDocUpdatedAt,\n}) => {\n  const {\n    routes: { api },\n    serverURL,\n  } = useConfig()\n  const { docConfig, getVersions, versions } = useDocumentInfo()\n  const versionsConfig = docConfig?.versions\n\n  const [fields] = useAllFormFields()\n  const modified = useFormModified()\n  const { code: locale } = useLocale()\n  const { i18n, t } = useTranslation()\n\n  let interval = 800\n  if (versionsConfig.drafts && versionsConfig?.drafts?.autosave)\n    interval = versionsConfig.drafts.autosave.interval\n\n  const [saving, setSaving] = useState(false)\n  const [lastSaved, setLastSaved] = useState<number>()\n  const debouncedFields = useDebounce(fields, interval)\n  const fieldRef = useRef(fields)\n  const modifiedRef = useRef(modified)\n  const localeRef = useRef(locale)\n\n  // Store fields in ref so the autosave func\n  // can always retrieve the most to date copies\n  // after the timeout has executed\n  fieldRef.current = fields\n\n  // Store modified in ref so the autosave func\n  // can bail out if modified becomes false while\n  // timing out during autosave\n  modifiedRef.current = modified\n\n  // Store locale in ref so the autosave func\n  // can always retrieve the most to date locale\n  localeRef.current = locale\n\n  // When debounced fields change, autosave\n  useEffect(() => {\n    const autosave = () => {\n      if (modified) {\n        setSaving(true)\n\n        let url: string\n        let method: string\n\n        if (collection && id) {\n          url = `${serverURL}${api}/${collection.slug}/${id}?draft=true&autosave=true&locale=${localeRef.current}`\n          method = 'PATCH'\n        }\n\n        if (globalDoc) {\n          url = `${serverURL}${api}/globals/${globalDoc.slug}?draft=true&autosave=true&locale=${localeRef.current}`\n          method = 'POST'\n        }\n\n        if (url) {\n          setTimeout(async () => {\n            if (modifiedRef.current) {\n              const body = {\n                ...reduceFieldsToValues(fieldRef.current, true),\n                _status: 'draft',\n              }\n              const res = await fetch(url, {\n                body: JSON.stringify(body),\n                credentials: 'include',\n                headers: {\n                  'Accept-Language': i18n.language,\n                  'Content-Type': 'application/json',\n                },\n                method,\n              })\n\n              if (res.status === 200) {\n                setLastSaved(new Date().getTime())\n                void getVersions()\n              }\n            }\n\n            setSaving(false)\n          }, 1000)\n        }\n      }\n    }\n\n    void autosave()\n  }, [i18n, debouncedFields, modified, serverURL, api, collection, globalDoc, id, getVersions])\n\n  useEffect(() => {\n    if (versions?.docs?.[0]) {\n      setLastSaved(new Date(versions.docs[0].updatedAt).getTime())\n    } else if (publishedDocUpdatedAt) {\n      setLastSaved(new Date(publishedDocUpdatedAt).getTime())\n    }\n  }, [publishedDocUpdatedAt, versions])\n\n  return (\n    <div className={baseClass}>\n      {saving && t('general:saving')}\n      {!saving && lastSaved && (\n        <React.Fragment>\n          {t('version:lastSavedAgo', {\n            distance: formatTimeToNow({ date: lastSaved, i18n }),\n          })}\n        </React.Fragment>\n      )}\n    </div>\n  )\n}\n"],"names":["React","useEffect","useRef","useState","useAllFormFields","useFormModified","useDebounce","useConfig","useDocumentInfo","useLocale","useTranslation","formatTimeToNow","reduceFieldsToValues","baseClass","Autosave","id","collection","global","globalDoc","publishedDocUpdatedAt","routes","api","serverURL","docConfig","getVersions","versions","versionsConfig","fields","modified","code","locale","i18n","t","interval","drafts","autosave","saving","setSaving","lastSaved","setLastSaved","debouncedFields","fieldRef","modifiedRef","localeRef","current","url","method","slug","setTimeout","body","_status","res","fetch","JSON","stringify","credentials","headers","language","status","Date","getTime","docs","updatedAt","div","className","Fragment","distance","date"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../src/elements/Autosave/index.tsx"],"sourcesContent":["'use client'\n// TODO: abstract the `next/navigation` dependency out from this component\nimport type { ClientCollectionConfig, ClientGlobalConfig } from 'payload'\n\nimport { versionDefaults } from 'payload/shared'\nimport React, { useEffect, useRef, useState } from 'react'\nimport { toast } from 'sonner'\n\nimport {\n  useAllFormFields,\n  useForm,\n  useFormModified,\n  useFormSubmitted,\n} from '../../forms/Form/context.js'\nimport { useDebounce } from '../../hooks/useDebounce.js'\nimport { useConfig } from '../../providers/Config/index.js'\nimport { useDocumentEvents } from '../../providers/DocumentEvents/index.js'\nimport { useDocumentInfo } from '../../providers/DocumentInfo/index.js'\nimport { useLocale } from '../../providers/Locale/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { formatTimeToNow } from '../../utilities/formatDate.js'\nimport { reduceFieldsToValuesWithValidation } from '../../utilities/reduceFieldsToValuesWithValidation.js'\nimport './index.scss'\n\nconst baseClass = 'autosave'\n\nexport type Props = {\n  collection?: ClientCollectionConfig\n  global?: ClientGlobalConfig\n  id?: number | string\n  publishedDocUpdatedAt: string\n}\n\nexport const Autosave: React.FC<Props> = ({\n  id,\n  collection,\n  global: globalDoc,\n  publishedDocUpdatedAt,\n}) => {\n  const {\n    routes: { api },\n    serverURL,\n  } = useConfig()\n  const { docConfig, getVersions, versions } = useDocumentInfo()\n  const { reportUpdate } = useDocumentEvents()\n  const { dispatchFields, setSubmitted } = useForm()\n  const submitted = useFormSubmitted()\n  const versionsConfig = docConfig?.versions\n\n  const [fields] = useAllFormFields()\n  const formModified = useFormModified()\n  const { code: locale } = useLocale()\n  const { i18n, t } = useTranslation()\n\n  let interval = versionDefaults.autosaveInterval\n  if (versionsConfig.drafts && versionsConfig.drafts.autosave)\n    interval = versionsConfig.drafts.autosave.interval\n\n  const [saving, setSaving] = useState(false)\n  const [lastSaved, setLastSaved] = useState<number>()\n  const debouncedFields = useDebounce(fields, interval)\n  const modified = useDebounce(formModified, interval)\n  const fieldRef = useRef(fields)\n  const modifiedRef = useRef(modified)\n  const localeRef = useRef(locale)\n  const debouncedRef = useRef(debouncedFields)\n\n  debouncedRef.current = debouncedFields\n\n  // Store fields in ref so the autosave func\n  // can always retrieve the most to date copies\n  // after the timeout has executed\n  fieldRef.current = fields\n\n  // Store modified in ref so the autosave func\n  // can bail out if modified becomes false while\n  // timing out during autosave\n  modifiedRef.current = modified\n\n  // Store locale in ref so the autosave func\n  // can always retrieve the most to date locale\n  localeRef.current = locale\n\n  // When debounced fields change, autosave\n  useEffect(() => {\n    const abortController = new AbortController()\n    let autosaveTimeout = undefined\n\n    const autosave = () => {\n      if (modified) {\n        setSaving(true)\n\n        let url: string\n        let method: string\n        let entitySlug: string\n\n        if (collection && id) {\n          entitySlug = collection.slug\n          url = `${serverURL}${api}/${entitySlug}/${id}?draft=true&autosave=true&locale=${localeRef.current}`\n          method = 'PATCH'\n        }\n\n        if (globalDoc) {\n          entitySlug = globalDoc.slug\n          url = `${serverURL}${api}/globals/${entitySlug}?draft=true&autosave=true&locale=${localeRef.current}`\n          method = 'POST'\n        }\n\n        if (url) {\n          autosaveTimeout = setTimeout(async () => {\n            if (modifiedRef.current) {\n              const { data, valid } = {\n                ...reduceFieldsToValuesWithValidation(fieldRef.current, true),\n              }\n              data._status = 'draft'\n              const skipSubmission =\n                submitted && !valid && versionsConfig?.drafts && versionsConfig?.drafts?.validate\n\n              if (!skipSubmission) {\n                const res = await fetch(url, {\n                  body: JSON.stringify(data),\n                  credentials: 'include',\n                  headers: {\n                    'Accept-Language': i18n.language,\n                    'Content-Type': 'application/json',\n                  },\n                  method,\n                  signal: abortController.signal,\n                })\n\n                if (res.status === 200) {\n                  const newDate = new Date()\n                  setLastSaved(newDate.getTime())\n                  reportUpdate({\n                    id,\n                    entitySlug,\n                    updatedAt: newDate.toISOString(),\n                  })\n                  void getVersions()\n                }\n\n                if (\n                  versionsConfig?.drafts &&\n                  versionsConfig?.drafts?.validate &&\n                  res.status === 400\n                ) {\n                  const json = await res.json()\n                  if (Array.isArray(json.errors)) {\n                    const [fieldErrors, nonFieldErrors] = json.errors.reduce(\n                      ([fieldErrs, nonFieldErrs], err) => {\n                        const newFieldErrs = []\n                        const newNonFieldErrs = []\n\n                        if (err?.message) {\n                          newNonFieldErrs.push(err)\n                        }\n\n                        if (Array.isArray(err?.data)) {\n                          err.data.forEach((dataError) => {\n                            if (dataError?.field) {\n                              newFieldErrs.push(dataError)\n                            } else {\n                              newNonFieldErrs.push(dataError)\n                            }\n                          })\n                        }\n\n                        return [\n                          [...fieldErrs, ...newFieldErrs],\n                          [...nonFieldErrs, ...newNonFieldErrs],\n                        ]\n                      },\n                      [[], []],\n                    )\n\n                    dispatchFields({\n                      type: 'ADD_SERVER_ERRORS',\n                      errors: fieldErrors,\n                    })\n\n                    nonFieldErrors.forEach((err) => {\n                      toast.error(err.message || i18n.t('error:unknown'))\n                    })\n\n                    setSubmitted(true)\n                    setSaving(false)\n                    return\n                  }\n                }\n              }\n            }\n\n            setSaving(false)\n          }, 1000)\n        }\n      }\n    }\n\n    void autosave()\n\n    return () => {\n      clearTimeout(autosaveTimeout)\n      if (abortController.signal) abortController.abort()\n      setSaving(false)\n    }\n  }, [\n    api,\n    collection,\n    dispatchFields,\n    getVersions,\n    globalDoc,\n    i18n,\n    id,\n    interval,\n    modified,\n    reportUpdate,\n    serverURL,\n    setSubmitted,\n    versionsConfig?.drafts,\n    debouncedFields,\n    submitted,\n  ])\n\n  useEffect(() => {\n    if (versions?.docs?.[0]) {\n      setLastSaved(new Date(versions.docs[0].updatedAt).getTime())\n    } else if (publishedDocUpdatedAt) {\n      setLastSaved(new Date(publishedDocUpdatedAt).getTime())\n    }\n  }, [publishedDocUpdatedAt, versions])\n\n  return (\n    <div className={baseClass}>\n      {saving && t('general:saving')}\n      {!saving && lastSaved && (\n        <React.Fragment>\n          {t('version:lastSavedAgo', {\n            distance: formatTimeToNow({ date: lastSaved, i18n }),\n          })}\n        </React.Fragment>\n      )}\n    </div>\n  )\n}\n"],"names":["versionDefaults","React","useEffect","useRef","useState","toast","useAllFormFields","useForm","useFormModified","useFormSubmitted","useDebounce","useConfig","useDocumentEvents","useDocumentInfo","useLocale","useTranslation","formatTimeToNow","reduceFieldsToValuesWithValidation","baseClass","Autosave","id","collection","global","globalDoc","publishedDocUpdatedAt","routes","api","serverURL","docConfig","getVersions","versions","reportUpdate","dispatchFields","setSubmitted","submitted","versionsConfig","fields","formModified","code","locale","i18n","t","interval","autosaveInterval","drafts","autosave","saving","setSaving","lastSaved","setLastSaved","debouncedFields","modified","fieldRef","modifiedRef","localeRef","debouncedRef","current","abortController","AbortController","autosaveTimeout","undefined","url","method","entitySlug","slug","setTimeout","data","valid","_status","skipSubmission","validate","res","fetch","body","JSON","stringify","credentials","headers","language","signal","status","newDate","Date","getTime","updatedAt","toISOString","json","Array","isArray","errors","fieldErrors","nonFieldErrors","reduce","fieldErrs","nonFieldErrs","err","newFieldErrs","newNonFieldErrs","message","push","forEach","dataError","field","type","error","clearTimeout","abort","docs","div","className","Fragment","distance","date"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/dist/elements/Banner/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Banner/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEvC,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,cAAc,CAAA;AAMrB,KAAK,OAAO,GAAG,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAA;AAE1C,MAAM,MAAM,KAAK,GAAG;IAClB,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC5B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,CAAA;CAChD,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC9B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,EAAE,EAAE,MAAM,CAAA;CACX,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAiClC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Banner/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAEvC,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,cAAc,CAAA;AAMrB,KAAK,OAAO,GAAG,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAA;AAE1C,MAAM,MAAM,KAAK,GAAG;IAClB,SAAS,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IAC5B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,CAAA;CAChD,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC9B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,EAAE,EAAE,MAAM,CAAA;CACX,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAiClC,CAAA"}

package/dist/elements/Banner/index.js

@@ -1,5 +1,8 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import LinkImport from 'next/link.js'; // TODO: abstract this out to support all routers
 import React from 'react';
+import './index.scss';
 const Link = LinkImport.default || LinkImport;
 const baseClass = 'banner';
 export const Banner = ({ type = 'default', alignIcon = 'right', children, className, icon, onClick, to })=>{
@@ -15,13 +18,23 @@ export const Banner = ({ type = 'default', alignIcon = 'right', children, classN
     let RenderedType = 'div';
     if (onClick && !to) RenderedType = 'button';
     if (to) RenderedType = Link;
-    return /*#__PURE__*/ React.createElement(RenderedType, {
+    return /*#__PURE__*/ _jsxs(RenderedType, {
         className: classes,
-        href: to || '',
-        onClick: onClick
-    }, icon && alignIcon === 'left' && /*#__PURE__*/ React.createElement(React.Fragment, null, icon), /*#__PURE__*/ React.createElement("span", {
-        className: `${baseClass}__content`
-    }, children), icon && alignIcon === 'right' && /*#__PURE__*/ React.createElement(React.Fragment, null, icon));
+        href: to || null,
+        onClick: onClick,
+        children: [
+            icon && alignIcon === 'left' && /*#__PURE__*/ _jsx(React.Fragment, {
+                children: icon
+            }),
+            /*#__PURE__*/ _jsx("span", {
+                className: `${baseClass}__content`,
+                children: children
+            }),
+            icon && alignIcon === 'right' && /*#__PURE__*/ _jsx(React.Fragment, {
+                children: icon
+            })
+        ]
+    });
 };
 
 //# sourceMappingURL=index.js.map

package/dist/elements/Banner/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Banner/index.tsx"],"sourcesContent":["import LinkImport from 'next/link.js' // TODO: abstract this out to support all routers\nimport type { MouseEvent } from 'react'\n\nimport React from 'react'\n\nimport './index.scss'\n\nconst Link = (LinkImport.default || LinkImport) as unknown as typeof LinkImport.default\n\nconst baseClass = 'banner'\n\ntype onClick = (event: MouseEvent) => void\n\nexport type Props = {\n  alignIcon?: 'left' | 'right'\n  children?: React.ReactNode\n  className?: string\n  icon?: React.ReactNode\n  onClick?: onClick\n  to?: string\n  type?: 'default' | 'error' | 'info' | 'success'\n}\n\nexport type RenderedTypeProps = {\n  children?: React.ReactNode\n  className?: string\n  onClick?: onClick\n  to: string\n}\n\nexport const Banner: React.FC<Props> = ({\n  type = 'default',\n  alignIcon = 'right',\n  children,\n  className,\n  icon,\n  onClick,\n  to,\n}) => {\n  const classes = [\n    baseClass,\n    `${baseClass}--type-${type}`,\n    className && className,\n    to && `${baseClass}--has-link`,\n    (to || onClick) && `${baseClass}--has-action`,\n    icon && `${baseClass}--has-icon`,\n    icon && `${baseClass}--align-icon-${alignIcon}`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  let RenderedType: React.ComponentType<RenderedTypeProps> | React.ElementType = 'div'\n\n  if (onClick && !to) RenderedType = 'button'\n  if (to) RenderedType = Link\n\n  return (\n    <RenderedType className={classes} href={to || ''} onClick={onClick}>\n      {icon && alignIcon === 'left' && <React.Fragment>{icon}</React.Fragment>}\n      <span className={`${baseClass}__content`}>{children}</span>\n      {icon && alignIcon === 'right' && <React.Fragment>{icon}</React.Fragment>}\n    </RenderedType>\n  )\n}\n"],"names":["LinkImport","React","Link","default","baseClass","Banner","type","alignIcon","children","className","icon","onClick","to","classes","filter","Boolean","join","RenderedType","href","Fragment","span"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,OAAOA,gBAAgB,eAAc,CAAC,iDAAiD;AAGvF,OAAOC,WAAW,QAAO;AAIzB,MAAMC,OAAQF,WAAWG,OAAO,IAAIH;AAEpC,MAAMI,YAAY;AAqBlB,OAAO,MAAMC,SAA0B,CAAC,EACtCC,OAAO,SAAS,EAChBC,YAAY,OAAO,EACnBC,QAAQ,EACRC,SAAS,EACTC,IAAI,EACJC,OAAO,EACPC,EAAE,EACH;IACC,MAAMC,UAAU;QACdT;QACA,CAAC,EAAEA,UAAU,OAAO,EAAEE,KAAK,CAAC;QAC5BG,aAAaA;QACbG,MAAM,CAAC,EAAER,UAAU,UAAU,CAAC;QAC7BQ,CAAAA,MAAMD,OAAM,KAAM,CAAC,EAAEP,UAAU,YAAY,CAAC;QAC7CM,QAAQ,CAAC,EAAEN,UAAU,UAAU,CAAC;QAChCM,QAAQ,CAAC,EAAEN,UAAU,aAAa,EAAEG,UAAU,CAAC;KAChD,CACEO,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,IAAIC,eAA2E;IAE/E,IAAIN,WAAW,CAACC,IAAIK,eAAe;IACnC,IAAIL,IAAIK,eAAef;IAEvB,qBACE,oBAACe;QAAaR,WAAWI;QAASK,MAAMN,MAAM;QAAID,SAASA;OACxDD,QAAQH,cAAc,wBAAU,oBAACN,MAAMkB,QAAQ,QAAET,qBAClD,oBAACU;QAAKX,WAAW,CAAC,EAAEL,UAAU,SAAS,CAAC;OAAGI,WAC1CE,QAAQH,cAAc,yBAAW,oBAACN,MAAMkB,QAAQ,QAAET;AAGzD,EAAC"}
+{"version":3,"sources":["../../../src/elements/Banner/index.tsx"],"sourcesContent":["'use client'\nimport LinkImport from 'next/link.js' // TODO: abstract this out to support all routers\nimport type { MouseEvent } from 'react'\n\nimport React from 'react'\n\nimport './index.scss'\n\nconst Link = (LinkImport.default || LinkImport) as unknown as typeof LinkImport.default\n\nconst baseClass = 'banner'\n\ntype onClick = (event: MouseEvent) => void\n\nexport type Props = {\n  alignIcon?: 'left' | 'right'\n  children?: React.ReactNode\n  className?: string\n  icon?: React.ReactNode\n  onClick?: onClick\n  to?: string\n  type?: 'default' | 'error' | 'info' | 'success'\n}\n\nexport type RenderedTypeProps = {\n  children?: React.ReactNode\n  className?: string\n  onClick?: onClick\n  to: string\n}\n\nexport const Banner: React.FC<Props> = ({\n  type = 'default',\n  alignIcon = 'right',\n  children,\n  className,\n  icon,\n  onClick,\n  to,\n}) => {\n  const classes = [\n    baseClass,\n    `${baseClass}--type-${type}`,\n    className && className,\n    to && `${baseClass}--has-link`,\n    (to || onClick) && `${baseClass}--has-action`,\n    icon && `${baseClass}--has-icon`,\n    icon && `${baseClass}--align-icon-${alignIcon}`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  let RenderedType: React.ComponentType<RenderedTypeProps> | React.ElementType = 'div'\n\n  if (onClick && !to) RenderedType = 'button'\n  if (to) RenderedType = Link\n\n  return (\n    <RenderedType className={classes} href={to || null} onClick={onClick}>\n      {icon && alignIcon === 'left' && <React.Fragment>{icon}</React.Fragment>}\n      <span className={`${baseClass}__content`}>{children}</span>\n      {icon && alignIcon === 'right' && <React.Fragment>{icon}</React.Fragment>}\n    </RenderedType>\n  )\n}\n"],"names":["LinkImport","React","Link","default","baseClass","Banner","type","alignIcon","children","className","icon","onClick","to","classes","filter","Boolean","join","RenderedType","href","Fragment","span"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AACA,OAAOA,gBAAgB,eAAc,CAAC,iDAAiD;AAGvF,OAAOC,WAAW,QAAO;AAEzB,OAAO,eAAc;AAErB,MAAMC,OAAQF,WAAWG,OAAO,IAAIH;AAEpC,MAAMI,YAAY;AAqBlB,OAAO,MAAMC,SAA0B,CAAC,EACtCC,OAAO,SAAS,EAChBC,YAAY,OAAO,EACnBC,QAAQ,EACRC,SAAS,EACTC,IAAI,EACJC,OAAO,EACPC,EAAE,EACH;IACC,MAAMC,UAAU;QACdT;QACA,CAAC,EAAEA,UAAU,OAAO,EAAEE,KAAK,CAAC;QAC5BG,aAAaA;QACbG,MAAM,CAAC,EAAER,UAAU,UAAU,CAAC;QAC7BQ,CAAAA,MAAMD,OAAM,KAAM,CAAC,EAAEP,UAAU,YAAY,CAAC;QAC7CM,QAAQ,CAAC,EAAEN,UAAU,UAAU,CAAC;QAChCM,QAAQ,CAAC,EAAEN,UAAU,aAAa,EAAEG,UAAU,CAAC;KAChD,CACEO,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,IAAIC,eAA2E;IAE/E,IAAIN,WAAW,CAACC,IAAIK,eAAe;IACnC,IAAIL,IAAIK,eAAef;IAEvB,qBACE,MAACe;QAAaR,WAAWI;QAASK,MAAMN,MAAM;QAAMD,SAASA;;YAC1DD,QAAQH,cAAc,wBAAU,KAACN,MAAMkB,QAAQ;0BAAET;;0BAClD,KAACU;gBAAKX,WAAW,CAAC,EAAEL,UAAU,SAAS,CAAC;0BAAGI;;YAC1CE,QAAQH,cAAc,yBAAW,KAACN,MAAMkB,QAAQ;0BAAET;;;;AAGzD,EAAC"}

package/dist/elements/Button/index.js

@@ -1,33 +1,50 @@
 'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { Fragment, forwardRef, isValidElement } from 'react';
-import { Chevron } from '../../icons/Chevron/index.js';
-import { Edit } from '../../icons/Edit/index.js';
+import { ChevronIcon } from '../../icons/Chevron/index.js';
+import { EditIcon } from '../../icons/Edit/index.js';
 import { LinkIcon } from '../../icons/Link/index.js';
-import { Plus } from '../../icons/Plus/index.js';
-import { Swap } from '../../icons/Swap/index.js';
-import { X } from '../../icons/X/index.js';
+import { PlusIcon } from '../../icons/Plus/index.js';
+import { SwapIcon } from '../../icons/Swap/index.js';
+import { XIcon } from '../../icons/X/index.js';
 import { Tooltip } from '../Tooltip/index.js';
+import './index.scss';
 const icons = {
-    chevron: Chevron,
-    edit: Edit,
+    chevron: ChevronIcon,
+    edit: EditIcon,
     link: LinkIcon,
-    plus: Plus,
-    swap: Swap,
-    x: X
+    plus: PlusIcon,
+    swap: SwapIcon,
+    x: XIcon
 };
 const baseClass = 'btn';
 export const ButtonContents = ({ children, icon, showTooltip, tooltip })=>{
     const BuiltInIcon = icons[icon];
-    return /*#__PURE__*/ React.createElement(Fragment, null, tooltip && /*#__PURE__*/ React.createElement(Tooltip, {
-        className: `${baseClass}__tooltip`,
-        show: showTooltip
-    }, tooltip), /*#__PURE__*/ React.createElement("span", {
-        className: `${baseClass}__content`
-    }, children && /*#__PURE__*/ React.createElement("span", {
-        className: `${baseClass}__label`
-    }, children), icon && /*#__PURE__*/ React.createElement("span", {
-        className: `${baseClass}__icon`
-    }, /*#__PURE__*/ isValidElement(icon) && icon, BuiltInIcon && /*#__PURE__*/ React.createElement(BuiltInIcon, null))));
+    return /*#__PURE__*/ _jsxs(Fragment, {
+        children: [
+            tooltip && /*#__PURE__*/ _jsx(Tooltip, {
+                className: `${baseClass}__tooltip`,
+                show: showTooltip,
+                children: tooltip
+            }),
+            /*#__PURE__*/ _jsxs("span", {
+                className: `${baseClass}__content`,
+                children: [
+                    children && /*#__PURE__*/ _jsx("span", {
+                        className: `${baseClass}__label`,
+                        children: children
+                    }),
+                    icon && /*#__PURE__*/ _jsxs("span", {
+                        className: `${baseClass}__icon`,
+                        children: [
+                            /*#__PURE__*/ isValidElement(icon) && icon,
+                            BuiltInIcon && /*#__PURE__*/ _jsx(BuiltInIcon, {})
+                        ]
+                    })
+                ]
+            })
+        ]
+    });
 };
 export const Button = /*#__PURE__*/ forwardRef((props, ref)=>{
     const { id, type = 'button', Link, 'aria-label': ariaLabel, buttonStyle = 'primary', children, className, disabled, el = 'button', icon, iconPosition = 'right', iconStyle = 'without-border', newTab, onClick, round, size = 'medium', to, tooltip, url } = props;
@@ -69,37 +86,43 @@ export const Button = /*#__PURE__*/ forwardRef((props, ref)=>{
                 console.error('Link is required when using el="link"', children);
                 return null;
             }
-            return /*#__PURE__*/ React.createElement(Link, {
+            return /*#__PURE__*/ _jsx(Link, {
                 ...buttonProps,
                 href: to || url,
-                to: to || url
-            }, /*#__PURE__*/ React.createElement(ButtonContents, {
-                icon: icon,
-                showTooltip: showTooltip,
-                tooltip: tooltip
-            }, children));
+                to: to || url,
+                children: /*#__PURE__*/ _jsx(ButtonContents, {
+                    icon: icon,
+                    showTooltip: showTooltip,
+                    tooltip: tooltip,
+                    children: children
+                })
+            });
         case 'anchor':
-            return /*#__PURE__*/ React.createElement("a", {
+            return /*#__PURE__*/ _jsx("a", {
                 ...buttonProps,
                 href: url,
-                ref: ref
-            }, /*#__PURE__*/ React.createElement(ButtonContents, {
-                icon: icon,
-                showTooltip: showTooltip,
-                tooltip: tooltip
-            }, children));
+                ref: ref,
+                children: /*#__PURE__*/ _jsx(ButtonContents, {
+                    icon: icon,
+                    showTooltip: showTooltip,
+                    tooltip: tooltip,
+                    children: children
+                })
+            });
         default:
             const Tag = el // eslint-disable-line no-case-declarations
             ;
-            return /*#__PURE__*/ React.createElement(Tag, {
+            return /*#__PURE__*/ _jsx(Tag, {
                 ref: ref,
                 type: "submit",
-                ...buttonProps
-            }, /*#__PURE__*/ React.createElement(ButtonContents, {
-                icon: icon,
-                showTooltip: showTooltip,
-                tooltip: tooltip
-            }, children));
+                ...buttonProps,
+                children: /*#__PURE__*/ _jsx(ButtonContents, {
+                    icon: icon,
+                    showTooltip: showTooltip,
+                    tooltip: tooltip,
+                    children: children
+                })
+            });
     }
 });
 

package/dist/elements/Button/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Button/index.tsx"],"sourcesContent":["'use client'\nimport React, { Fragment, forwardRef, isValidElement } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { Chevron } from '../../icons/Chevron/index.js'\nimport { Edit } from '../../icons/Edit/index.js'\nimport { LinkIcon } from '../../icons/Link/index.js'\nimport { Plus } from '../../icons/Plus/index.js'\nimport { Swap } from '../../icons/Swap/index.js'\nimport { X } from '../../icons/X/index.js'\nimport { Tooltip } from '../Tooltip/index.js'\nimport './index.scss'\n\nconst icons = {\n  chevron: Chevron,\n  edit: Edit,\n  link: LinkIcon,\n  plus: Plus,\n  swap: Swap,\n  x: X,\n}\n\nconst baseClass = 'btn'\n\nexport const ButtonContents = ({ children, icon, showTooltip, tooltip }) => {\n  const BuiltInIcon = icons[icon]\n\n  return (\n    <Fragment>\n      {tooltip && (\n        <Tooltip className={`${baseClass}__tooltip`} show={showTooltip}>\n          {tooltip}\n        </Tooltip>\n      )}\n      <span className={`${baseClass}__content`}>\n        {children && <span className={`${baseClass}__label`}>{children}</span>}\n        {icon && (\n          <span className={`${baseClass}__icon`}>\n            {isValidElement(icon) && icon}\n            {BuiltInIcon && <BuiltInIcon />}\n          </span>\n        )}\n      </span>\n    </Fragment>\n  )\n}\n\nexport const Button = forwardRef<HTMLAnchorElement | HTMLButtonElement, Props>((props, ref) => {\n  const {\n    id,\n    type = 'button',\n    Link,\n    'aria-label': ariaLabel,\n    buttonStyle = 'primary',\n    children,\n    className,\n    disabled,\n    el = 'button',\n    icon,\n    iconPosition = 'right',\n    iconStyle = 'without-border',\n    newTab,\n    onClick,\n    round,\n    size = 'medium',\n    to,\n    tooltip,\n    url,\n  } = props\n\n  const [showTooltip, setShowTooltip] = React.useState(false)\n\n  const classes = [\n    baseClass,\n    className && className,\n    buttonStyle && `${baseClass}--style-${buttonStyle}`,\n    icon && `${baseClass}--icon`,\n    iconStyle && `${baseClass}--icon-style-${iconStyle}`,\n    icon && !children && `${baseClass}--icon-only`,\n    disabled && `${baseClass}--disabled`,\n    round && `${baseClass}--round`,\n    size && `${baseClass}--size-${size}`,\n    iconPosition && `${baseClass}--icon-position-${iconPosition}`,\n    tooltip && `${baseClass}--has-tooltip`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  function handleClick(event) {\n    setShowTooltip(false)\n    if (type !== 'submit' && onClick) event.preventDefault()\n    if (onClick) onClick(event)\n  }\n\n  const buttonProps = {\n    id,\n    type,\n    'aria-disabled': disabled,\n    'aria-label': ariaLabel,\n    className: classes,\n    disabled,\n    onClick: !disabled ? handleClick : undefined,\n    onMouseEnter: tooltip ? () => setShowTooltip(true) : undefined,\n    onMouseLeave: tooltip ? () => setShowTooltip(false) : undefined,\n    rel: newTab ? 'noopener noreferrer' : undefined,\n    target: newTab ? '_blank' : undefined,\n  }\n\n  switch (el) {\n    case 'link':\n      if (!Link) {\n        console.error('Link is required when using el=\"link\"', children)\n        return null\n      }\n\n      return (\n        <Link {...buttonProps} href={to || url} to={to || url}>\n          <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n            {children}\n          </ButtonContents>\n        </Link>\n      )\n\n    case 'anchor':\n      return (\n        <a {...buttonProps} href={url} ref={ref as React.LegacyRef<HTMLAnchorElement>}>\n          <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n            {children}\n          </ButtonContents>\n        </a>\n      )\n\n    default:\n      const Tag = el // eslint-disable-line no-case-declarations\n\n      return (\n        <Tag ref={ref} type=\"submit\" {...buttonProps}>\n          <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n            {children}\n          </ButtonContents>\n        </Tag>\n      )\n  }\n})\n"],"names":["React","Fragment","forwardRef","isValidElement","Chevron","Edit","LinkIcon","Plus","Swap","X","Tooltip","icons","chevron","edit","link","plus","swap","x","baseClass","ButtonContents","children","icon","showTooltip","tooltip","BuiltInIcon","className","show","span","Button","props","ref","id","type","Link","ariaLabel","buttonStyle","disabled","el","iconPosition","iconStyle","newTab","onClick","round","size","to","url","setShowTooltip","useState","classes","filter","Boolean","join","handleClick","event","preventDefault","buttonProps","undefined","onMouseEnter","onMouseLeave","rel","target","console","error","href","a","Tag"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../src/elements/Button/index.tsx"],"sourcesContent":["'use client'\nimport React, { Fragment, forwardRef, isValidElement } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { ChevronIcon } from '../../icons/Chevron/index.js'\nimport { EditIcon } from '../../icons/Edit/index.js'\nimport { LinkIcon } from '../../icons/Link/index.js'\nimport { PlusIcon } from '../../icons/Plus/index.js'\nimport { SwapIcon } from '../../icons/Swap/index.js'\nimport { XIcon } from '../../icons/X/index.js'\nimport { Tooltip } from '../Tooltip/index.js'\nimport './index.scss'\n\nconst icons = {\n  chevron: ChevronIcon,\n  edit: EditIcon,\n  link: LinkIcon,\n  plus: PlusIcon,\n  swap: SwapIcon,\n  x: XIcon,\n}\n\nconst baseClass = 'btn'\n\nexport const ButtonContents = ({ children, icon, showTooltip, tooltip }) => {\n  const BuiltInIcon = icons[icon]\n\n  return (\n    <Fragment>\n      {tooltip && (\n        <Tooltip className={`${baseClass}__tooltip`} show={showTooltip}>\n          {tooltip}\n        </Tooltip>\n      )}\n      <span className={`${baseClass}__content`}>\n        {children && <span className={`${baseClass}__label`}>{children}</span>}\n        {icon && (\n          <span className={`${baseClass}__icon`}>\n            {isValidElement(icon) && icon}\n            {BuiltInIcon && <BuiltInIcon />}\n          </span>\n        )}\n      </span>\n    </Fragment>\n  )\n}\n\nexport const Button = forwardRef<HTMLAnchorElement | HTMLButtonElement, Props>((props, ref) => {\n  const {\n    id,\n    type = 'button',\n    Link,\n    'aria-label': ariaLabel,\n    buttonStyle = 'primary',\n    children,\n    className,\n    disabled,\n    el = 'button',\n    icon,\n    iconPosition = 'right',\n    iconStyle = 'without-border',\n    newTab,\n    onClick,\n    round,\n    size = 'medium',\n    to,\n    tooltip,\n    url,\n  } = props\n\n  const [showTooltip, setShowTooltip] = React.useState(false)\n\n  const classes = [\n    baseClass,\n    className && className,\n    buttonStyle && `${baseClass}--style-${buttonStyle}`,\n    icon && `${baseClass}--icon`,\n    iconStyle && `${baseClass}--icon-style-${iconStyle}`,\n    icon && !children && `${baseClass}--icon-only`,\n    disabled && `${baseClass}--disabled`,\n    round && `${baseClass}--round`,\n    size && `${baseClass}--size-${size}`,\n    iconPosition && `${baseClass}--icon-position-${iconPosition}`,\n    tooltip && `${baseClass}--has-tooltip`,\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  function handleClick(event) {\n    setShowTooltip(false)\n    if (type !== 'submit' && onClick) event.preventDefault()\n    if (onClick) onClick(event)\n  }\n\n  const buttonProps = {\n    id,\n    type,\n    'aria-disabled': disabled,\n    'aria-label': ariaLabel,\n    className: classes,\n    disabled,\n    onClick: !disabled ? handleClick : undefined,\n    onMouseEnter: tooltip ? () => setShowTooltip(true) : undefined,\n    onMouseLeave: tooltip ? () => setShowTooltip(false) : undefined,\n    rel: newTab ? 'noopener noreferrer' : undefined,\n    target: newTab ? '_blank' : undefined,\n  }\n\n  switch (el) {\n    case 'link':\n      if (!Link) {\n        console.error('Link is required when using el=\"link\"', children)\n        return null\n      }\n\n      return (\n        <Link {...buttonProps} href={to || url} to={to || url}>\n          <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n            {children}\n          </ButtonContents>\n        </Link>\n      )\n\n    case 'anchor':\n      return (\n        <a {...buttonProps} href={url} ref={ref as React.Ref<HTMLAnchorElement>}>\n          <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n            {children}\n          </ButtonContents>\n        </a>\n      )\n\n    default:\n      const Tag = el // eslint-disable-line no-case-declarations\n\n      return (\n        <Tag ref={ref} type=\"submit\" {...buttonProps}>\n          <ButtonContents icon={icon} showTooltip={showTooltip} tooltip={tooltip}>\n            {children}\n          </ButtonContents>\n        </Tag>\n      )\n  }\n})\n"],"names":["React","Fragment","forwardRef","isValidElement","ChevronIcon","EditIcon","LinkIcon","PlusIcon","SwapIcon","XIcon","Tooltip","icons","chevron","edit","link","plus","swap","x","baseClass","ButtonContents","children","icon","showTooltip","tooltip","BuiltInIcon","className","show","span","Button","props","ref","id","type","Link","ariaLabel","buttonStyle","disabled","el","iconPosition","iconStyle","newTab","onClick","round","size","to","url","setShowTooltip","useState","classes","filter","Boolean","join","handleClick","event","preventDefault","buttonProps","undefined","onMouseEnter","onMouseLeave","rel","target","console","error","href","a","Tag"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/dist/elements/Card/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Card/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAExC,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,cAAc,CAAA;AAErB,MAAM,MAAM,KAAK,GAAG;IAClB,IAAI,CAAC,EAAE,WAAW,CAAA;IAClB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,WAAW,CAAA;CACtB,CAAA;AAID,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA0BhC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Card/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAExC,OAAO,KAAK,MAAM,OAAO,CAAA;AAGzB,OAAO,cAAc,CAAA;AAErB,MAAM,MAAM,KAAK,GAAG;IAClB,IAAI,CAAC,EAAE,WAAW,CAAA;IAClB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,WAAW,CAAA;CACtB,CAAA;AAID,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA0BhC,CAAA"}

package/dist/elements/Card/index.js

@@ -1,5 +1,8 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { Button } from '../Button/index.js';
+import './index.scss';
 const baseClass = 'card';
 export const Card = (props)=>{
     const { id, Link, actions, buttonAriaLabel, href, onClick, title, titleAs } = props;
@@ -9,22 +12,29 @@ export const Card = (props)=>{
         (onClick || href) && `${baseClass}--has-onclick`
     ].filter(Boolean).join(' ');
     const Tag = titleAs ?? 'div';
-    return /*#__PURE__*/ React.createElement("div", {
+    return /*#__PURE__*/ _jsxs("div", {
         className: classes,
-        id: id
-    }, /*#__PURE__*/ React.createElement(Tag, {
-        className: `${baseClass}__title`
-    }, title), actions && /*#__PURE__*/ React.createElement("div", {
-        className: `${baseClass}__actions`
-    }, actions), (onClick || href) && /*#__PURE__*/ React.createElement(Button, {
-        Link: Link,
-        "aria-label": buttonAriaLabel,
-        buttonStyle: "none",
-        className: `${baseClass}__click`,
-        el: "link",
-        onClick: onClick,
-        to: href
-    }));
+        id: id,
+        children: [
+            /*#__PURE__*/ _jsx(Tag, {
+                className: `${baseClass}__title`,
+                children: title
+            }),
+            actions && /*#__PURE__*/ _jsx("div", {
+                className: `${baseClass}__actions`,
+                children: actions
+            }),
+            (onClick || href) && /*#__PURE__*/ _jsx(Button, {
+                Link: Link,
+                "aria-label": buttonAriaLabel,
+                buttonStyle: "none",
+                className: `${baseClass}__click`,
+                el: "link",
+                onClick: onClick,
+                to: href
+            })
+        ]
+    });
 };
 
 //# sourceMappingURL=index.js.map

package/dist/elements/Card/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Card/index.tsx"],"sourcesContent":["import type { ElementType } from 'react'\n\nimport React from 'react'\n\nimport { Button } from '../Button/index.js'\nimport './index.scss'\n\nexport type Props = {\n  Link?: ElementType\n  actions?: React.ReactNode\n  buttonAriaLabel?: string\n  href?: string\n  id?: string\n  onClick?: () => void\n  title: string\n  titleAs?: ElementType\n}\n\nconst baseClass = 'card'\n\nexport const Card: React.FC<Props> = (props) => {\n  const { id, Link, actions, buttonAriaLabel, href, onClick, title, titleAs } = props\n\n  const classes = [baseClass, id, (onClick || href) && `${baseClass}--has-onclick`]\n    .filter(Boolean)\n    .join(' ')\n\n  const Tag = titleAs ?? 'div'\n\n  return (\n    <div className={classes} id={id}>\n      <Tag className={`${baseClass}__title`}>{title}</Tag>\n      {actions && <div className={`${baseClass}__actions`}>{actions}</div>}\n      {(onClick || href) && (\n        <Button\n          Link={Link}\n          aria-label={buttonAriaLabel}\n          buttonStyle=\"none\"\n          className={`${baseClass}__click`}\n          el=\"link\"\n          onClick={onClick}\n          to={href}\n        />\n      )}\n    </div>\n  )\n}\n"],"names":["React","Button","baseClass","Card","props","id","Link","actions","buttonAriaLabel","href","onClick","title","titleAs","classes","filter","Boolean","join","Tag","div","className","aria-label","buttonStyle","el","to"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAEA,OAAOA,WAAW,QAAO;AAEzB,SAASC,MAAM,QAAQ,qBAAoB;AAc3C,MAAMC,YAAY;AAElB,OAAO,MAAMC,OAAwB,CAACC;IACpC,MAAM,EAAEC,EAAE,EAAEC,IAAI,EAAEC,OAAO,EAAEC,eAAe,EAAEC,IAAI,EAAEC,OAAO,EAAEC,KAAK,EAAEC,OAAO,EAAE,GAAGR;IAE9E,MAAMS,UAAU;QAACX;QAAWG;QAAKK,CAAAA,WAAWD,IAAG,KAAM,CAAC,EAAEP,UAAU,aAAa,CAAC;KAAC,CAC9EY,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,MAAMC,MAAML,WAAW;IAEvB,qBACE,oBAACM;QAAIC,WAAWN;QAASR,IAAIA;qBAC3B,oBAACY;QAAIE,WAAW,CAAC,EAAEjB,UAAU,OAAO,CAAC;OAAGS,QACvCJ,yBAAW,oBAACW;QAAIC,WAAW,CAAC,EAAEjB,UAAU,SAAS,CAAC;OAAGK,UACrD,AAACG,CAAAA,WAAWD,IAAG,mBACd,oBAACR;QACCK,MAAMA;QACNc,cAAYZ;QACZa,aAAY;QACZF,WAAW,CAAC,EAAEjB,UAAU,OAAO,CAAC;QAChCoB,IAAG;QACHZ,SAASA;QACTa,IAAId;;AAKd,EAAC"}
+{"version":3,"sources":["../../../src/elements/Card/index.tsx"],"sourcesContent":["'use client'\nimport type { ElementType } from 'react'\n\nimport React from 'react'\n\nimport { Button } from '../Button/index.js'\nimport './index.scss'\n\nexport type Props = {\n  Link?: ElementType\n  actions?: React.ReactNode\n  buttonAriaLabel?: string\n  href?: string\n  id?: string\n  onClick?: () => void\n  title: string\n  titleAs?: ElementType\n}\n\nconst baseClass = 'card'\n\nexport const Card: React.FC<Props> = (props) => {\n  const { id, Link, actions, buttonAriaLabel, href, onClick, title, titleAs } = props\n\n  const classes = [baseClass, id, (onClick || href) && `${baseClass}--has-onclick`]\n    .filter(Boolean)\n    .join(' ')\n\n  const Tag = titleAs ?? 'div'\n\n  return (\n    <div className={classes} id={id}>\n      <Tag className={`${baseClass}__title`}>{title}</Tag>\n      {actions && <div className={`${baseClass}__actions`}>{actions}</div>}\n      {(onClick || href) && (\n        <Button\n          Link={Link}\n          aria-label={buttonAriaLabel}\n          buttonStyle=\"none\"\n          className={`${baseClass}__click`}\n          el=\"link\"\n          onClick={onClick}\n          to={href}\n        />\n      )}\n    </div>\n  )\n}\n"],"names":["React","Button","baseClass","Card","props","id","Link","actions","buttonAriaLabel","href","onClick","title","titleAs","classes","filter","Boolean","join","Tag","div","className","aria-label","buttonStyle","el","to"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,OAAOA,WAAW,QAAO;AAEzB,SAASC,MAAM,QAAQ,qBAAoB;AAC3C,OAAO,eAAc;AAarB,MAAMC,YAAY;AAElB,OAAO,MAAMC,OAAwB,CAACC;IACpC,MAAM,EAAEC,EAAE,EAAEC,IAAI,EAAEC,OAAO,EAAEC,eAAe,EAAEC,IAAI,EAAEC,OAAO,EAAEC,KAAK,EAAEC,OAAO,EAAE,GAAGR;IAE9E,MAAMS,UAAU;QAACX;QAAWG;QAAKK,CAAAA,WAAWD,IAAG,KAAM,CAAC,EAAEP,UAAU,aAAa,CAAC;KAAC,CAC9EY,MAAM,CAACC,SACPC,IAAI,CAAC;IAER,MAAMC,MAAML,WAAW;IAEvB,qBACE,MAACM;QAAIC,WAAWN;QAASR,IAAIA;;0BAC3B,KAACY;gBAAIE,WAAW,CAAC,EAAEjB,UAAU,OAAO,CAAC;0BAAGS;;YACvCJ,yBAAW,KAACW;gBAAIC,WAAW,CAAC,EAAEjB,UAAU,SAAS,CAAC;0BAAGK;;YACpDG,CAAAA,WAAWD,IAAG,mBACd,KAACR;gBACCK,MAAMA;gBACNc,cAAYZ;gBACZa,aAAY;gBACZF,WAAW,CAAC,EAAEjB,UAAU,OAAO,CAAC;gBAChCoB,IAAG;gBACHZ,SAASA;gBACTa,IAAId;;;;AAKd,EAAC"}

package/dist/elements/CodeEditor/CodeEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CodeEditor.d.ts","sourceRoot":"","sources":["../../../src/elements/CodeEditor/CodeEditor.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAIvC,OAAO,cAAc,CAAA;AAMrB,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAiC/B,CAAA;AAGD,eAAe,UAAU,CAAA"}
+{"version":3,"file":"CodeEditor.d.ts","sourceRoot":"","sources":["../../../src/elements/CodeEditor/CodeEditor.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAIvC,OAAO,cAAc,CAAA;AAMrB,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAiC/B,CAAA;AAGD,eAAe,UAAU,CAAA"}