@payloadcms/ui 3.0.0-canary.f1db24e → 3.0.0-canary.f1f97ff

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentDrawer/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA2D,MAAM,OAAO,CAAA;AAE/E,OAAO,KAAK,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AAO9F,OAAO,cAAc,CAAA;AAErB,eAAO,MAAM,SAAS,eAAe,CAAA;AAcrC,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAyBhE,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAQxD,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,iBAmE/B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentDrawer/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA2D,MAAM,OAAO,CAAA;AAE/E,OAAO,KAAK,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AAO9F,OAAO,cAAc,CAAA;AAErB,eAAO,MAAM,SAAS,eAAe,CAAA;AAcrC,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAyBhE,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAQxD,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,iBAiE/B,CAAA"}

package/dist/elements/DocumentDrawer/index.js

@@ -1,7 +1,7 @@
 'use client';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { createElement as _createElement } from "react";
-import * as facelessUIImport from '@faceless-ui/modal';
+import { useModal } from '@faceless-ui/modal';
 import { getTranslation } from '@payloadcms/translations';
 import React, { useCallback, useEffect, useId, useMemo, useState } from 'react';
 import { useRelatedCollections } from '../../fields/Relationship/AddNew/useRelatedCollections.js';
@@ -9,6 +9,7 @@ import { useEditDepth } from '../../providers/EditDepth/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
 import { Drawer, DrawerToggler } from '../Drawer/index.js';
 import { DocumentDrawerContent } from './DrawerContent.js';
+import './index.scss';
 export const baseClass = 'doc-drawer';
 const formatDocumentDrawerSlug = ({ id, collectionSlug, depth, uuid })=>`doc-drawer_${collectionSlug}_${depth}${id ? `_${id}` : ''}_${uuid}`;
 export const DocumentDrawerToggler = ({ id, children, className, collectionSlug, disabled, drawerSlug, ...rest })=>{
@@ -41,7 +42,6 @@ export const DocumentDrawer = (props)=>{
     });
 };
 export const useDocumentDrawer = ({ id, collectionSlug })=>{
-    const { useModal } = facelessUIImport;
     const drawerDepth = useEditDepth();
     const uuid = useId();
     const { closeModal, modalState, openModal, toggleModal } = useModal();

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/DocumentDrawer/index.tsx"],"sourcesContent":["'use client'\nimport * as facelessUIImport from '@faceless-ui/modal'\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useCallback, useEffect, useId, useMemo, useState } from 'react'\n\nimport type { DocumentDrawerProps, DocumentTogglerProps, UseDocumentDrawer } from './types.js'\n\nimport { useRelatedCollections } from '../../fields/Relationship/AddNew/useRelatedCollections.js'\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Drawer, DrawerToggler } from '../Drawer/index.js'\nimport { DocumentDrawerContent } from './DrawerContent.js'\nimport './index.scss'\n\nexport const baseClass = 'doc-drawer'\n\nconst formatDocumentDrawerSlug = ({\n  id,\n  collectionSlug,\n  depth,\n  uuid,\n}: {\n  collectionSlug: string\n  depth: number\n  id: number | string\n  uuid: string // supply when creating a new document and no id is available\n}) => `doc-drawer_${collectionSlug}_${depth}${id ? `_${id}` : ''}_${uuid}`\n\nexport const DocumentDrawerToggler: React.FC<DocumentTogglerProps> = ({\n  id,\n  children,\n  className,\n  collectionSlug,\n  disabled,\n  drawerSlug,\n  ...rest\n}) => {\n  const { i18n, t } = useTranslation()\n  const [collectionConfig] = useRelatedCollections(collectionSlug)\n\n  return (\n    <DrawerToggler\n      aria-label={t(!id ? 'fields:addNewLabel' : 'general:editLabel', {\n        label: getTranslation(collectionConfig.labels.singular, i18n),\n      })}\n      className={[className, `${baseClass}__toggler`].filter(Boolean).join(' ')}\n      disabled={disabled}\n      slug={drawerSlug}\n      {...rest}\n    >\n      {children}\n    </DrawerToggler>\n  )\n}\n\nexport const DocumentDrawer: React.FC<DocumentDrawerProps> = (props) => {\n  const { drawerSlug } = props\n\n  return (\n    <Drawer Header={null} className={baseClass} gutter={false} slug={drawerSlug}>\n      <DocumentDrawerContent {...props} />\n    </Drawer>\n  )\n}\n\nexport const useDocumentDrawer: UseDocumentDrawer = ({ id, collectionSlug }) => {\n  const { useModal } = facelessUIImport\n\n  const drawerDepth = useEditDepth()\n  const uuid = useId()\n  const { closeModal, modalState, openModal, toggleModal } = useModal()\n  const [isOpen, setIsOpen] = useState(false)\n\n  const drawerSlug = formatDocumentDrawerSlug({\n    id,\n    collectionSlug,\n    depth: drawerDepth,\n    uuid,\n  })\n\n  useEffect(() => {\n    setIsOpen(Boolean(modalState[drawerSlug]?.isOpen))\n  }, [modalState, drawerSlug])\n\n  const toggleDrawer = useCallback(() => {\n    toggleModal(drawerSlug)\n  }, [toggleModal, drawerSlug])\n\n  const closeDrawer = useCallback(() => {\n    closeModal(drawerSlug)\n  }, [closeModal, drawerSlug])\n\n  const openDrawer = useCallback(() => {\n    openModal(drawerSlug)\n  }, [openModal, drawerSlug])\n\n  const MemoizedDrawer = useMemo(() => {\n    return (props) => (\n      <DocumentDrawer\n        {...props}\n        collectionSlug={collectionSlug}\n        drawerSlug={drawerSlug}\n        id={id}\n        key={drawerSlug}\n      />\n    )\n  }, [id, drawerSlug, collectionSlug])\n\n  const MemoizedDrawerToggler = useMemo(() => {\n    return (props) => (\n      <DocumentDrawerToggler\n        {...props}\n        collectionSlug={collectionSlug}\n        drawerSlug={drawerSlug}\n        id={id}\n      />\n    )\n  }, [id, drawerSlug, collectionSlug])\n\n  const MemoizedDrawerState = useMemo(\n    () => ({\n      closeDrawer,\n      drawerDepth,\n      drawerSlug,\n      isDrawerOpen: isOpen,\n      openDrawer,\n      toggleDrawer,\n    }),\n    [drawerDepth, drawerSlug, isOpen, toggleDrawer, closeDrawer, openDrawer],\n  )\n\n  return [MemoizedDrawer, MemoizedDrawerToggler, MemoizedDrawerState]\n}\n"],"names":["facelessUIImport","getTranslation","React","useCallback","useEffect","useId","useMemo","useState","useRelatedCollections","useEditDepth","useTranslation","Drawer","DrawerToggler","DocumentDrawerContent","baseClass","formatDocumentDrawerSlug","id","collectionSlug","depth","uuid","DocumentDrawerToggler","children","className","disabled","drawerSlug","rest","i18n","t","collectionConfig","aria-label","label","labels","singular","filter","Boolean","join","slug","DocumentDrawer","props","Header","gutter","useDocumentDrawer","useModal","drawerDepth","closeModal","modalState","openModal","toggleModal","isOpen","setIsOpen","toggleDrawer","closeDrawer","openDrawer","MemoizedDrawer","key","MemoizedDrawerToggler","MemoizedDrawerState","isDrawerOpen"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../src/elements/DocumentDrawer/index.tsx"],"sourcesContent":["'use client'\nimport { useModal } from '@faceless-ui/modal'\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useCallback, useEffect, useId, useMemo, useState } from 'react'\n\nimport type { DocumentDrawerProps, DocumentTogglerProps, UseDocumentDrawer } from './types.js'\n\nimport { useRelatedCollections } from '../../fields/Relationship/AddNew/useRelatedCollections.js'\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Drawer, DrawerToggler } from '../Drawer/index.js'\nimport { DocumentDrawerContent } from './DrawerContent.js'\nimport './index.scss'\n\nexport const baseClass = 'doc-drawer'\n\nconst formatDocumentDrawerSlug = ({\n  id,\n  collectionSlug,\n  depth,\n  uuid,\n}: {\n  collectionSlug: string\n  depth: number\n  id: number | string\n  uuid: string // supply when creating a new document and no id is available\n}) => `doc-drawer_${collectionSlug}_${depth}${id ? `_${id}` : ''}_${uuid}`\n\nexport const DocumentDrawerToggler: React.FC<DocumentTogglerProps> = ({\n  id,\n  children,\n  className,\n  collectionSlug,\n  disabled,\n  drawerSlug,\n  ...rest\n}) => {\n  const { i18n, t } = useTranslation()\n  const [collectionConfig] = useRelatedCollections(collectionSlug)\n\n  return (\n    <DrawerToggler\n      aria-label={t(!id ? 'fields:addNewLabel' : 'general:editLabel', {\n        label: getTranslation(collectionConfig.labels.singular, i18n),\n      })}\n      className={[className, `${baseClass}__toggler`].filter(Boolean).join(' ')}\n      disabled={disabled}\n      slug={drawerSlug}\n      {...rest}\n    >\n      {children}\n    </DrawerToggler>\n  )\n}\n\nexport const DocumentDrawer: React.FC<DocumentDrawerProps> = (props) => {\n  const { drawerSlug } = props\n\n  return (\n    <Drawer Header={null} className={baseClass} gutter={false} slug={drawerSlug}>\n      <DocumentDrawerContent {...props} />\n    </Drawer>\n  )\n}\n\nexport const useDocumentDrawer: UseDocumentDrawer = ({ id, collectionSlug }) => {\n  const drawerDepth = useEditDepth()\n  const uuid = useId()\n  const { closeModal, modalState, openModal, toggleModal } = useModal()\n  const [isOpen, setIsOpen] = useState(false)\n\n  const drawerSlug = formatDocumentDrawerSlug({\n    id,\n    collectionSlug,\n    depth: drawerDepth,\n    uuid,\n  })\n\n  useEffect(() => {\n    setIsOpen(Boolean(modalState[drawerSlug]?.isOpen))\n  }, [modalState, drawerSlug])\n\n  const toggleDrawer = useCallback(() => {\n    toggleModal(drawerSlug)\n  }, [toggleModal, drawerSlug])\n\n  const closeDrawer = useCallback(() => {\n    closeModal(drawerSlug)\n  }, [closeModal, drawerSlug])\n\n  const openDrawer = useCallback(() => {\n    openModal(drawerSlug)\n  }, [openModal, drawerSlug])\n\n  const MemoizedDrawer = useMemo(() => {\n    return (props) => (\n      <DocumentDrawer\n        {...props}\n        collectionSlug={collectionSlug}\n        drawerSlug={drawerSlug}\n        id={id}\n        key={drawerSlug}\n      />\n    )\n  }, [id, drawerSlug, collectionSlug])\n\n  const MemoizedDrawerToggler = useMemo(() => {\n    return (props) => (\n      <DocumentDrawerToggler\n        {...props}\n        collectionSlug={collectionSlug}\n        drawerSlug={drawerSlug}\n        id={id}\n      />\n    )\n  }, [id, drawerSlug, collectionSlug])\n\n  const MemoizedDrawerState = useMemo(\n    () => ({\n      closeDrawer,\n      drawerDepth,\n      drawerSlug,\n      isDrawerOpen: isOpen,\n      openDrawer,\n      toggleDrawer,\n    }),\n    [drawerDepth, drawerSlug, isOpen, toggleDrawer, closeDrawer, openDrawer],\n  )\n\n  return [MemoizedDrawer, MemoizedDrawerToggler, MemoizedDrawerState]\n}\n"],"names":["useModal","getTranslation","React","useCallback","useEffect","useId","useMemo","useState","useRelatedCollections","useEditDepth","useTranslation","Drawer","DrawerToggler","DocumentDrawerContent","baseClass","formatDocumentDrawerSlug","id","collectionSlug","depth","uuid","DocumentDrawerToggler","children","className","disabled","drawerSlug","rest","i18n","t","collectionConfig","aria-label","label","labels","singular","filter","Boolean","join","slug","DocumentDrawer","props","Header","gutter","useDocumentDrawer","drawerDepth","closeModal","modalState","openModal","toggleModal","isOpen","setIsOpen","toggleDrawer","closeDrawer","openDrawer","MemoizedDrawer","key","MemoizedDrawerToggler","MemoizedDrawerState","isDrawerOpen"],"mappings":"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"}

package/dist/elements/DocumentDrawer/types.d.ts

@@ -2,20 +2,20 @@ import type React from 'react';
 import type { HTMLAttributes } from 'react';
 import type { DocumentInfoContext } from '../../providers/DocumentInfo/types.js';
 import type { Props as DrawerProps } from '../Drawer/types.js';
-export type DocumentDrawerProps = Pick<DrawerProps, 'Header'> & {
+export type DocumentDrawerProps = {
     collectionSlug: string;
     drawerSlug?: string;
     id?: null | number | string;
     onSave?: DocumentInfoContext['onSave'];
-};
-export type DocumentTogglerProps = HTMLAttributes<HTMLButtonElement> & {
+} & Pick<DrawerProps, 'Header'>;
+export type DocumentTogglerProps = {
     children?: React.ReactNode;
     className?: string;
     collectionSlug: string;
     disabled?: boolean;
     drawerSlug?: string;
     id?: string;
-};
+} & HTMLAttributes<HTMLButtonElement>;
 export type UseDocumentDrawer = (args: {
     collectionSlug: string;
     id?: number | string;

package/dist/elements/DocumentDrawer/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentDrawer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uCAAuC,CAAA;AAChF,OAAO,KAAK,EAAE,KAAK,IAAI,WAAW,EAAE,MAAM,oBAAoB,CAAA;AAE9D,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,GAAG;IAC9D,cAAc,EAAE,MAAM,CAAA;IACtB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,EAAE,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,CAAA;IAC3B,MAAM,CAAC,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAA;CACvC,CAAA;AAED,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,iBAAiB,CAAC,GAAG;IACrE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,EAAE,CAAC,EAAE,MAAM,CAAA;CACZ,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG,CAAC,IAAI,EAAE;IAAE,cAAc,EAAE,MAAM,CAAC;IAAC,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,KAAK;IAC1F,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,mBAAmB,EAAE,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC5D,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,oBAAoB,EAAE,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC7D;QACE,WAAW,EAAE,MAAM,IAAI,CAAA;QACvB,WAAW,EAAE,MAAM,CAAA;QACnB,UAAU,EAAE,MAAM,CAAA;QAClB,YAAY,EAAE,OAAO,CAAA;QACrB,UAAU,EAAE,MAAM,IAAI,CAAA;QACtB,YAAY,EAAE,MAAM,IAAI,CAAA;KACzB;CACF,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentDrawer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uCAAuC,CAAA;AAChF,OAAO,KAAK,EAAE,KAAK,IAAI,WAAW,EAAE,MAAM,oBAAoB,CAAA;AAE9D,MAAM,MAAM,mBAAmB,GAAG;IAChC,cAAc,EAAE,MAAM,CAAA;IACtB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,EAAE,CAAC,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,CAAA;IAC3B,MAAM,CAAC,EAAE,mBAAmB,CAAC,QAAQ,CAAC,CAAA;CACvC,GAAG,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAA;AAE/B,MAAM,MAAM,oBAAoB,GAAG;IACjC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,EAAE,CAAC,EAAE,MAAM,CAAA;CACZ,GAAG,cAAc,CAAC,iBAAiB,CAAC,CAAA;AAErC,MAAM,MAAM,iBAAiB,GAAG,CAAC,IAAI,EAAE;IAAE,cAAc,EAAE,MAAM,CAAC;IAAC,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAAE,KAAK;IAC1F,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,mBAAmB,EAAE,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC5D,KAAK,CAAC,EAAE,CAAC,IAAI,CAAC,oBAAoB,EAAE,gBAAgB,GAAG,IAAI,CAAC,CAAC;IAC7D;QACE,WAAW,EAAE,MAAM,IAAI,CAAA;QACvB,WAAW,EAAE,MAAM,CAAA;QACnB,UAAU,EAAE,MAAM,CAAA;QAClB,YAAY,EAAE,OAAO,CAAA;QACrB,UAAU,EAAE,MAAM,IAAI,CAAA;QACtB,YAAY,EAAE,MAAM,IAAI,CAAA;KACzB;CACF,CAAA"}

package/dist/elements/DocumentDrawer/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/DocumentDrawer/types.ts"],"sourcesContent":["import type React from 'react'\nimport type { HTMLAttributes } from 'react'\n\nimport type { DocumentInfoContext } from '../../providers/DocumentInfo/types.js'\nimport type { Props as DrawerProps } from '../Drawer/types.js'\n\nexport type DocumentDrawerProps = Pick<DrawerProps, 'Header'> & {\n  collectionSlug: string\n  drawerSlug?: string\n  id?: null | number | string\n  onSave?: DocumentInfoContext['onSave']\n}\n\nexport type DocumentTogglerProps = HTMLAttributes<HTMLButtonElement> & {\n  children?: React.ReactNode\n  className?: string\n  collectionSlug: string\n  disabled?: boolean\n  drawerSlug?: string\n  id?: string\n}\n\nexport type UseDocumentDrawer = (args: { collectionSlug: string; id?: number | string }) => [\n  React.FC<Omit<DocumentDrawerProps, 'collectionSlug' | 'id'>>, // drawer\n  React.FC<Omit<DocumentTogglerProps, 'collectionSlug' | 'id'>>, // toggler\n  {\n    closeDrawer: () => void\n    drawerDepth: number\n    drawerSlug: string\n    isDrawerOpen: boolean\n    openDrawer: () => void\n    toggleDrawer: () => void\n  },\n]\n"],"names":[],"rangeMappings":"","mappings":"AAsBA,WAWC"}
+{"version":3,"sources":["../../../src/elements/DocumentDrawer/types.ts"],"sourcesContent":["import type React from 'react'\nimport type { HTMLAttributes } from 'react'\n\nimport type { DocumentInfoContext } from '../../providers/DocumentInfo/types.js'\nimport type { Props as DrawerProps } from '../Drawer/types.js'\n\nexport type DocumentDrawerProps = {\n  collectionSlug: string\n  drawerSlug?: string\n  id?: null | number | string\n  onSave?: DocumentInfoContext['onSave']\n} & Pick<DrawerProps, 'Header'>\n\nexport type DocumentTogglerProps = {\n  children?: React.ReactNode\n  className?: string\n  collectionSlug: string\n  disabled?: boolean\n  drawerSlug?: string\n  id?: string\n} & HTMLAttributes<HTMLButtonElement>\n\nexport type UseDocumentDrawer = (args: { collectionSlug: string; id?: number | string }) => [\n  React.FC<Omit<DocumentDrawerProps, 'collectionSlug' | 'id'>>, // drawer\n  React.FC<Omit<DocumentTogglerProps, 'collectionSlug' | 'id'>>, // toggler\n  {\n    closeDrawer: () => void\n    drawerDepth: number\n    drawerSlug: string\n    isDrawerOpen: boolean\n    openDrawer: () => void\n    toggleDrawer: () => void\n  },\n]\n"],"names":[],"mappings":"AAsBA,WAWC"}

package/dist/elements/DocumentFields/index.d.ts

@@ -1,6 +1,5 @@
-import type { Description, DocumentPermissions } from 'payload/types';
+import type { Description, DocumentPermissions, FieldMap } from 'payload';
 import React from 'react';
-import type { FieldMap } from '../../providers/ComponentMap/buildComponentMap/types.js';
 import './index.scss';
 type Args = {
     AfterFields?: React.ReactNode;

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentFields/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,mBAAmB,EAAE,MAAM,eAAe,CAAA;AAErE,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,yDAAyD,CAAA;AAIvF,OAAO,cAAc,CAAA;AAIrB,KAAK,IAAI,GAAG;IACV,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B,WAAW,CAAC,EAAE,WAAW,CAAA;IACzB,cAAc,EAAE,mBAAmB,CAAA;IACnC,QAAQ,EAAE,QAAQ,CAAA;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,QAAQ,EAAE,OAAO,CAAA;IACjB,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAoEzC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/DocumentFields/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,mBAAmB,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAEzE,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,cAAc,CAAA;AAIrB,KAAK,IAAI,GAAG;IACV,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B,WAAW,CAAC,EAAE,WAAW,CAAA;IACzB,cAAc,EAAE,mBAAmB,CAAA;IACnC,QAAQ,EAAE,QAAQ,CAAA;IAClB,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,QAAQ,EAAE,OAAO,CAAA;IACjB,UAAU,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,IAAI,CAkEzC,CAAA"}

package/dist/elements/DocumentFields/index.js

@@ -3,63 +3,62 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { RenderFields } from '../../forms/RenderFields/index.js';
 import { Gutter } from '../Gutter/index.js';
+import './index.scss';
 const baseClass = 'document-fields';
 export const DocumentFields = ({ AfterFields, BeforeFields, description, docPermissions, fieldMap, forceSidebarWrap, readOnly, schemaPath })=>{
     const mainFields = fieldMap.filter(({ isSidebar })=>!isSidebar);
     const sidebarFields = fieldMap.filter(({ isSidebar })=>isSidebar);
     const hasSidebarFields = sidebarFields && sidebarFields.length > 0;
-    return /*#__PURE__*/ _jsx(React.Fragment, {
-        children: /*#__PURE__*/ _jsxs("div", {
-            className: [
-                baseClass,
-                hasSidebarFields ? `${baseClass}--has-sidebar` : `${baseClass}--no-sidebar`,
-                forceSidebarWrap && `${baseClass}--force-sidebar-wrap`
-            ].filter(Boolean).join(' '),
-            children: [
-                /*#__PURE__*/ _jsx("div", {
-                    className: `${baseClass}__main`,
-                    children: /*#__PURE__*/ _jsxs(Gutter, {
-                        className: `${baseClass}__edit`,
-                        children: [
-                            /*#__PURE__*/ _jsx("header", {
-                                className: `${baseClass}__header`,
-                                children: description && /*#__PURE__*/ _jsx("div", {
-                                    className: `${baseClass}__sub-header`
-                                })
-                            }),
-                            BeforeFields,
-                            /*#__PURE__*/ _jsx(RenderFields, {
-                                className: `${baseClass}__fields`,
-                                fieldMap: mainFields,
-                                forceRender: 10,
-                                path: "",
-                                permissions: docPermissions?.fields,
-                                readOnly: readOnly,
-                                schemaPath: schemaPath
-                            }),
-                            AfterFields
-                        ]
-                    })
-                }),
-                hasSidebarFields && /*#__PURE__*/ _jsx("div", {
-                    className: `${baseClass}__sidebar-wrap`,
-                    children: /*#__PURE__*/ _jsx("div", {
-                        className: `${baseClass}__sidebar`,
-                        children: /*#__PURE__*/ _jsx("div", {
-                            className: `${baseClass}__sidebar-fields`,
-                            children: /*#__PURE__*/ _jsx(RenderFields, {
-                                fieldMap: sidebarFields,
-                                forceRender: 10,
-                                path: "",
-                                permissions: docPermissions?.fields,
-                                readOnly: readOnly,
-                                schemaPath: schemaPath
+    return /*#__PURE__*/ _jsxs("div", {
+        className: [
+            baseClass,
+            hasSidebarFields ? `${baseClass}--has-sidebar` : `${baseClass}--no-sidebar`,
+            forceSidebarWrap && `${baseClass}--force-sidebar-wrap`
+        ].filter(Boolean).join(' '),
+        children: [
+            /*#__PURE__*/ _jsx("div", {
+                className: `${baseClass}__main`,
+                children: /*#__PURE__*/ _jsxs(Gutter, {
+                    className: `${baseClass}__edit`,
+                    children: [
+                        /*#__PURE__*/ _jsx("header", {
+                            className: `${baseClass}__header`,
+                            children: description && /*#__PURE__*/ _jsx("div", {
+                                className: `${baseClass}__sub-header`
                             })
+                        }),
+                        BeforeFields,
+                        /*#__PURE__*/ _jsx(RenderFields, {
+                            className: `${baseClass}__fields`,
+                            fieldMap: mainFields,
+                            forceRender: 10,
+                            path: "",
+                            permissions: docPermissions?.fields,
+                            readOnly: readOnly,
+                            schemaPath: schemaPath
+                        }),
+                        AfterFields
+                    ]
+                })
+            }),
+            hasSidebarFields && /*#__PURE__*/ _jsx("div", {
+                className: `${baseClass}__sidebar-wrap`,
+                children: /*#__PURE__*/ _jsx("div", {
+                    className: `${baseClass}__sidebar`,
+                    children: /*#__PURE__*/ _jsx("div", {
+                        className: `${baseClass}__sidebar-fields`,
+                        children: /*#__PURE__*/ _jsx(RenderFields, {
+                            fieldMap: sidebarFields,
+                            forceRender: 10,
+                            path: "",
+                            permissions: docPermissions?.fields,
+                            readOnly: readOnly,
+                            schemaPath: schemaPath
                         })
                     })
                 })
-            ]
-        })
+            })
+        ]
     });
 };
 

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/DocumentFields/index.tsx"],"sourcesContent":["'use client'\nimport type { Description, DocumentPermissions } from 'payload/types'\n\nimport React from 'react'\n\nimport type { FieldMap } from '../../providers/ComponentMap/buildComponentMap/types.js'\n\nimport { RenderFields } from '../../forms/RenderFields/index.js'\nimport { Gutter } from '../Gutter/index.js'\nimport './index.scss'\n\nconst baseClass = 'document-fields'\n\ntype Args = {\n  AfterFields?: React.ReactNode\n  BeforeFields?: React.ReactNode\n  description?: Description\n  docPermissions: DocumentPermissions\n  fieldMap: FieldMap\n  forceSidebarWrap?: boolean\n  readOnly: boolean\n  schemaPath: string\n}\n\nexport const DocumentFields: React.FC<Args> = ({\n  AfterFields,\n  BeforeFields,\n  description,\n  docPermissions,\n  fieldMap,\n  forceSidebarWrap,\n  readOnly,\n  schemaPath,\n}) => {\n  const mainFields = fieldMap.filter(({ isSidebar }) => !isSidebar)\n\n  const sidebarFields = fieldMap.filter(({ isSidebar }) => isSidebar)\n\n  const hasSidebarFields = sidebarFields && sidebarFields.length > 0\n\n  return (\n    <React.Fragment>\n      <div\n        className={[\n          baseClass,\n          hasSidebarFields ? `${baseClass}--has-sidebar` : `${baseClass}--no-sidebar`,\n          forceSidebarWrap && `${baseClass}--force-sidebar-wrap`,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n      >\n        <div className={`${baseClass}__main`}>\n          <Gutter className={`${baseClass}__edit`}>\n            <header className={`${baseClass}__header`}>\n              {description && (\n                <div className={`${baseClass}__sub-header`}>\n                  {/* <ViewDescription description={description} /> */}\n                </div>\n              )}\n            </header>\n            {BeforeFields}\n            <RenderFields\n              className={`${baseClass}__fields`}\n              fieldMap={mainFields}\n              forceRender={10}\n              path=\"\"\n              permissions={docPermissions?.fields}\n              readOnly={readOnly}\n              schemaPath={schemaPath}\n            />\n            {AfterFields}\n          </Gutter>\n        </div>\n        {hasSidebarFields && (\n          <div className={`${baseClass}__sidebar-wrap`}>\n            <div className={`${baseClass}__sidebar`}>\n              <div className={`${baseClass}__sidebar-fields`}>\n                <RenderFields\n                  fieldMap={sidebarFields}\n                  forceRender={10}\n                  path=\"\"\n                  permissions={docPermissions?.fields}\n                  readOnly={readOnly}\n                  schemaPath={schemaPath}\n                />\n              </div>\n            </div>\n          </div>\n        )}\n      </div>\n    </React.Fragment>\n  )\n}\n"],"names":["React","RenderFields","Gutter","baseClass","DocumentFields","AfterFields","BeforeFields","description","docPermissions","fieldMap","forceSidebarWrap","readOnly","schemaPath","mainFields","filter","isSidebar","sidebarFields","hasSidebarFields","length","Fragment","div","className","Boolean","join","header","forceRender","path","permissions","fields"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,OAAOA,WAAW,QAAO;AAIzB,SAASC,YAAY,QAAQ,oCAAmC;AAChE,SAASC,MAAM,QAAQ,qBAAoB;AAG3C,MAAMC,YAAY;AAalB,OAAO,MAAMC,iBAAiC,CAAC,EAC7CC,WAAW,EACXC,YAAY,EACZC,WAAW,EACXC,cAAc,EACdC,QAAQ,EACRC,gBAAgB,EAChBC,QAAQ,EACRC,UAAU,EACX;IACC,MAAMC,aAAaJ,SAASK,MAAM,CAAC,CAAC,EAAEC,SAAS,EAAE,GAAK,CAACA;IAEvD,MAAMC,gBAAgBP,SAASK,MAAM,CAAC,CAAC,EAAEC,SAAS,EAAE,GAAKA;IAEzD,MAAME,mBAAmBD,iBAAiBA,cAAcE,MAAM,GAAG;IAEjE,qBACE,KAAClB,MAAMmB,QAAQ;kBACb,cAAA,MAACC;YACCC,WAAW;gBACTlB;gBACAc,mBAAmB,CAAC,EAAEd,UAAU,aAAa,CAAC,GAAG,CAAC,EAAEA,UAAU,YAAY,CAAC;gBAC3EO,oBAAoB,CAAC,EAAEP,UAAU,oBAAoB,CAAC;aACvD,CACEW,MAAM,CAACQ,SACPC,IAAI,CAAC;;8BAER,KAACH;oBAAIC,WAAW,CAAC,EAAElB,UAAU,MAAM,CAAC;8BAClC,cAAA,MAACD;wBAAOmB,WAAW,CAAC,EAAElB,UAAU,MAAM,CAAC;;0CACrC,KAACqB;gCAAOH,WAAW,CAAC,EAAElB,UAAU,QAAQ,CAAC;0CACtCI,6BACC,KAACa;oCAAIC,WAAW,CAAC,EAAElB,UAAU,YAAY,CAAC;;;4BAK7CG;0CACD,KAACL;gCACCoB,WAAW,CAAC,EAAElB,UAAU,QAAQ,CAAC;gCACjCM,UAAUI;gCACVY,aAAa;gCACbC,MAAK;gCACLC,aAAanB,gBAAgBoB;gCAC7BjB,UAAUA;gCACVC,YAAYA;;4BAEbP;;;;gBAGJY,kCACC,KAACG;oBAAIC,WAAW,CAAC,EAAElB,UAAU,cAAc,CAAC;8BAC1C,cAAA,KAACiB;wBAAIC,WAAW,CAAC,EAAElB,UAAU,SAAS,CAAC;kCACrC,cAAA,KAACiB;4BAAIC,WAAW,CAAC,EAAElB,UAAU,gBAAgB,CAAC;sCAC5C,cAAA,KAACF;gCACCQ,UAAUO;gCACVS,aAAa;gCACbC,MAAK;gCACLC,aAAanB,gBAAgBoB;gCAC7BjB,UAAUA;gCACVC,YAAYA;;;;;;;;AAS9B,EAAC"}
+{"version":3,"sources":["../../../src/elements/DocumentFields/index.tsx"],"sourcesContent":["'use client'\nimport type { Description, DocumentPermissions, FieldMap } from 'payload'\n\nimport React from 'react'\n\nimport { RenderFields } from '../../forms/RenderFields/index.js'\nimport { Gutter } from '../Gutter/index.js'\nimport './index.scss'\n\nconst baseClass = 'document-fields'\n\ntype Args = {\n  AfterFields?: React.ReactNode\n  BeforeFields?: React.ReactNode\n  description?: Description\n  docPermissions: DocumentPermissions\n  fieldMap: FieldMap\n  forceSidebarWrap?: boolean\n  readOnly: boolean\n  schemaPath: string\n}\n\nexport const DocumentFields: React.FC<Args> = ({\n  AfterFields,\n  BeforeFields,\n  description,\n  docPermissions,\n  fieldMap,\n  forceSidebarWrap,\n  readOnly,\n  schemaPath,\n}) => {\n  const mainFields = fieldMap.filter(({ isSidebar }) => !isSidebar)\n\n  const sidebarFields = fieldMap.filter(({ isSidebar }) => isSidebar)\n\n  const hasSidebarFields = sidebarFields && sidebarFields.length > 0\n\n  return (\n    <div\n      className={[\n        baseClass,\n        hasSidebarFields ? `${baseClass}--has-sidebar` : `${baseClass}--no-sidebar`,\n        forceSidebarWrap && `${baseClass}--force-sidebar-wrap`,\n      ]\n        .filter(Boolean)\n        .join(' ')}\n    >\n      <div className={`${baseClass}__main`}>\n        <Gutter className={`${baseClass}__edit`}>\n          <header className={`${baseClass}__header`}>\n            {description && (\n              <div className={`${baseClass}__sub-header`}>\n                {/* <ViewDescription description={description} /> */}\n              </div>\n            )}\n          </header>\n          {BeforeFields}\n          <RenderFields\n            className={`${baseClass}__fields`}\n            fieldMap={mainFields}\n            forceRender={10}\n            path=\"\"\n            permissions={docPermissions?.fields}\n            readOnly={readOnly}\n            schemaPath={schemaPath}\n          />\n          {AfterFields}\n        </Gutter>\n      </div>\n      {hasSidebarFields && (\n        <div className={`${baseClass}__sidebar-wrap`}>\n          <div className={`${baseClass}__sidebar`}>\n            <div className={`${baseClass}__sidebar-fields`}>\n              <RenderFields\n                fieldMap={sidebarFields}\n                forceRender={10}\n                path=\"\"\n                permissions={docPermissions?.fields}\n                readOnly={readOnly}\n                schemaPath={schemaPath}\n              />\n            </div>\n          </div>\n        </div>\n      )}\n    </div>\n  )\n}\n"],"names":["React","RenderFields","Gutter","baseClass","DocumentFields","AfterFields","BeforeFields","description","docPermissions","fieldMap","forceSidebarWrap","readOnly","schemaPath","mainFields","filter","isSidebar","sidebarFields","hasSidebarFields","length","div","className","Boolean","join","header","forceRender","path","permissions","fields"],"mappings":"AAAA;;AAGA,OAAOA,WAAW,QAAO;AAEzB,SAASC,YAAY,QAAQ,oCAAmC;AAChE,SAASC,MAAM,QAAQ,qBAAoB;AAC3C,OAAO,eAAc;AAErB,MAAMC,YAAY;AAalB,OAAO,MAAMC,iBAAiC,CAAC,EAC7CC,WAAW,EACXC,YAAY,EACZC,WAAW,EACXC,cAAc,EACdC,QAAQ,EACRC,gBAAgB,EAChBC,QAAQ,EACRC,UAAU,EACX;IACC,MAAMC,aAAaJ,SAASK,MAAM,CAAC,CAAC,EAAEC,SAAS,EAAE,GAAK,CAACA;IAEvD,MAAMC,gBAAgBP,SAASK,MAAM,CAAC,CAAC,EAAEC,SAAS,EAAE,GAAKA;IAEzD,MAAME,mBAAmBD,iBAAiBA,cAAcE,MAAM,GAAG;IAEjE,qBACE,MAACC;QACCC,WAAW;YACTjB;YACAc,mBAAmB,CAAC,EAAEd,UAAU,aAAa,CAAC,GAAG,CAAC,EAAEA,UAAU,YAAY,CAAC;YAC3EO,oBAAoB,CAAC,EAAEP,UAAU,oBAAoB,CAAC;SACvD,CACEW,MAAM,CAACO,SACPC,IAAI,CAAC;;0BAER,KAACH;gBAAIC,WAAW,CAAC,EAAEjB,UAAU,MAAM,CAAC;0BAClC,cAAA,MAACD;oBAAOkB,WAAW,CAAC,EAAEjB,UAAU,MAAM,CAAC;;sCACrC,KAACoB;4BAAOH,WAAW,CAAC,EAAEjB,UAAU,QAAQ,CAAC;sCACtCI,6BACC,KAACY;gCAAIC,WAAW,CAAC,EAAEjB,UAAU,YAAY,CAAC;;;wBAK7CG;sCACD,KAACL;4BACCmB,WAAW,CAAC,EAAEjB,UAAU,QAAQ,CAAC;4BACjCM,UAAUI;4BACVW,aAAa;4BACbC,MAAK;4BACLC,aAAalB,gBAAgBmB;4BAC7BhB,UAAUA;4BACVC,YAAYA;;wBAEbP;;;;YAGJY,kCACC,KAACE;gBAAIC,WAAW,CAAC,EAAEjB,UAAU,cAAc,CAAC;0BAC1C,cAAA,KAACgB;oBAAIC,WAAW,CAAC,EAAEjB,UAAU,SAAS,CAAC;8BACrC,cAAA,KAACgB;wBAAIC,WAAW,CAAC,EAAEjB,UAAU,gBAAgB,CAAC;kCAC5C,cAAA,KAACF;4BACCQ,UAAUO;4BACVQ,aAAa;4BACbC,MAAK;4BACLC,aAAalB,gBAAgBmB;4BAC7BhB,UAAUA;4BACVC,YAAYA;;;;;;;AAQ5B,EAAC"}

package/dist/elements/DraggableSortable/DraggableSortableItem/index.d.ts

@@ -1,7 +1,7 @@
 import type { UseDraggableArguments } from '@dnd-kit/core';
 import React from 'react';
 import type { ChildFunction } from './types.js';
-export declare const DraggableSortableItem: React.FC<UseDraggableArguments & {
+export declare const DraggableSortableItem: React.FC<{
     children: ChildFunction;
-}>;
+} & UseDraggableArguments>;
 //# sourceMappingURL=index.d.ts.map

package/dist/elements/DraggableSortable/DraggableSortableItem/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/DraggableSortable/DraggableSortableItem/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAA;AAE1D,OAAO,KAAmB,MAAM,OAAO,CAAA;AAEvC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAI/C,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAC1C,qBAAqB,GAAG;IACtB,QAAQ,EAAE,aAAa,CAAA;CACxB,CAwBF,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/DraggableSortable/DraggableSortableItem/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAA;AAE1D,OAAO,KAAmB,MAAM,OAAO,CAAA;AAEvC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAI/C,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAC1C;IACE,QAAQ,EAAE,aAAa,CAAA;CACxB,GAAG,qBAAqB,CAwB1B,CAAA"}

package/dist/elements/DraggableSortable/DraggableSortableItem/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/DraggableSortable/DraggableSortableItem/index.tsx"],"sourcesContent":["'use client'\nimport type { UseDraggableArguments } from '@dnd-kit/core'\n\nimport React, { Fragment } from 'react'\n\nimport type { ChildFunction } from './types.js'\n\nimport { useDraggableSortable } from '../useDraggableSortable/index.js'\n\nexport const DraggableSortableItem: React.FC<\n  UseDraggableArguments & {\n    children: ChildFunction\n  }\n> = (props) => {\n  const { id, children, disabled } = props\n\n  const { attributes, isDragging, listeners, setNodeRef, transform } = useDraggableSortable({\n    id,\n    disabled,\n  })\n\n  return (\n    <Fragment>\n      {children({\n        attributes: {\n          ...attributes,\n          style: {\n            cursor: isDragging ? 'grabbing' : 'grab',\n          },\n        },\n        listeners,\n        setNodeRef,\n        transform,\n      })}\n    </Fragment>\n  )\n}\n"],"names":["React","Fragment","useDraggableSortable","DraggableSortableItem","props","id","children","disabled","attributes","isDragging","listeners","setNodeRef","transform","style","cursor"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,OAAOA,SAASC,QAAQ,QAAQ,QAAO;AAIvC,SAASC,oBAAoB,QAAQ,mCAAkC;AAEvE,OAAO,MAAMC,wBAIT,CAACC;IACH,MAAM,EAAEC,EAAE,EAAEC,QAAQ,EAAEC,QAAQ,EAAE,GAAGH;IAEnC,MAAM,EAAEI,UAAU,EAAEC,UAAU,EAAEC,SAAS,EAAEC,UAAU,EAAEC,SAAS,EAAE,GAAGV,qBAAqB;QACxFG;QACAE;IACF;IAEA,qBACE,KAACN;kBACEK,SAAS;YACRE,YAAY;gBACV,GAAGA,UAAU;gBACbK,OAAO;oBACLC,QAAQL,aAAa,aAAa;gBACpC;YACF;YACAC;YACAC;YACAC;QACF;;AAGN,EAAC"}
+{"version":3,"sources":["../../../../src/elements/DraggableSortable/DraggableSortableItem/index.tsx"],"sourcesContent":["'use client'\nimport type { UseDraggableArguments } from '@dnd-kit/core'\n\nimport React, { Fragment } from 'react'\n\nimport type { ChildFunction } from './types.js'\n\nimport { useDraggableSortable } from '../useDraggableSortable/index.js'\n\nexport const DraggableSortableItem: React.FC<\n  {\n    children: ChildFunction\n  } & UseDraggableArguments\n> = (props) => {\n  const { id, children, disabled } = props\n\n  const { attributes, isDragging, listeners, setNodeRef, transform } = useDraggableSortable({\n    id,\n    disabled,\n  })\n\n  return (\n    <Fragment>\n      {children({\n        attributes: {\n          ...attributes,\n          style: {\n            cursor: isDragging ? 'grabbing' : 'grab',\n          },\n        },\n        listeners,\n        setNodeRef,\n        transform,\n      })}\n    </Fragment>\n  )\n}\n"],"names":["React","Fragment","useDraggableSortable","DraggableSortableItem","props","id","children","disabled","attributes","isDragging","listeners","setNodeRef","transform","style","cursor"],"mappings":"AAAA;;AAGA,OAAOA,SAASC,QAAQ,QAAQ,QAAO;AAIvC,SAASC,oBAAoB,QAAQ,mCAAkC;AAEvE,OAAO,MAAMC,wBAIT,CAACC;IACH,MAAM,EAAEC,EAAE,EAAEC,QAAQ,EAAEC,QAAQ,EAAE,GAAGH;IAEnC,MAAM,EAAEI,UAAU,EAAEC,UAAU,EAAEC,SAAS,EAAEC,UAAU,EAAEC,SAAS,EAAE,GAAGV,qBAAqB;QACxFG;QACAE;IACF;IAEA,qBACE,KAACN;kBACEK,SAAS;YACRE,YAAY;gBACV,GAAGA,UAAU;gBACbK,OAAO;oBACLC,QAAQL,aAAa,aAAa;gBACpC;YACF;YACAC;YACAC;YACAC;QACF;;AAGN,EAAC"}

package/dist/elements/DraggableSortable/DraggableSortableItem/types.d.ts

@@ -2,12 +2,12 @@ import type { UseDraggableArguments } from '@dnd-kit/core';
 import type { SyntheticListenerMap } from '@dnd-kit/core/dist/hooks/utilities';
 import type React from 'react';
 import type { UseDraggableSortableReturn } from '../useDraggableSortable/types.js';
-export type DragHandleProps = UseDraggableArguments & {
+export type DragHandleProps = {
     attributes: UseDraggableArguments['attributes'];
     listeners: SyntheticListenerMap;
-};
+} & UseDraggableArguments;
 export type ChildFunction = (args: UseDraggableSortableReturn) => React.ReactNode;
-export type Props = UseDraggableArguments & {
+export type Props = {
     children: ChildFunction;
-};
+} & UseDraggableArguments;
 //# sourceMappingURL=types.d.ts.map

package/dist/elements/DraggableSortable/DraggableSortableItem/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/elements/DraggableSortable/DraggableSortableItem/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAA;AAC1D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,oCAAoC,CAAA;AAC9E,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,kCAAkC,CAAA;AAElF,MAAM,MAAM,eAAe,GAAG,qBAAqB,GAAG;IACpD,UAAU,EAAE,qBAAqB,CAAC,YAAY,CAAC,CAAA;IAC/C,SAAS,EAAE,oBAAoB,CAAA;CAChC,CAAA;AAED,MAAM,MAAM,aAAa,GAAG,CAAC,IAAI,EAAE,0BAA0B,KAAK,KAAK,CAAC,SAAS,CAAA;AAEjF,MAAM,MAAM,KAAK,GAAG,qBAAqB,GAAG;IAC1C,QAAQ,EAAE,aAAa,CAAA;CACxB,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/elements/DraggableSortable/DraggableSortableItem/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAA;AAC1D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,oCAAoC,CAAA;AAC9E,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,kCAAkC,CAAA;AAElF,MAAM,MAAM,eAAe,GAAG;IAC5B,UAAU,EAAE,qBAAqB,CAAC,YAAY,CAAC,CAAA;IAC/C,SAAS,EAAE,oBAAoB,CAAA;CAChC,GAAG,qBAAqB,CAAA;AAEzB,MAAM,MAAM,aAAa,GAAG,CAAC,IAAI,EAAE,0BAA0B,KAAK,KAAK,CAAC,SAAS,CAAA;AAEjF,MAAM,MAAM,KAAK,GAAG;IAClB,QAAQ,EAAE,aAAa,CAAA;CACxB,GAAG,qBAAqB,CAAA"}

package/dist/elements/DraggableSortable/DraggableSortableItem/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/DraggableSortable/DraggableSortableItem/types.ts"],"sourcesContent":["import type { UseDraggableArguments } from '@dnd-kit/core'\nimport type { SyntheticListenerMap } from '@dnd-kit/core/dist/hooks/utilities'\nimport type React from 'react'\n\nimport type { UseDraggableSortableReturn } from '../useDraggableSortable/types.js'\n\nexport type DragHandleProps = UseDraggableArguments & {\n  attributes: UseDraggableArguments['attributes']\n  listeners: SyntheticListenerMap\n}\n\nexport type ChildFunction = (args: UseDraggableSortableReturn) => React.ReactNode\n\nexport type Props = UseDraggableArguments & {\n  children: ChildFunction\n}\n"],"names":[],"rangeMappings":"","mappings":"AAaA,WAEC"}
+{"version":3,"sources":["../../../../src/elements/DraggableSortable/DraggableSortableItem/types.ts"],"sourcesContent":["import type { UseDraggableArguments } from '@dnd-kit/core'\nimport type { SyntheticListenerMap } from '@dnd-kit/core/dist/hooks/utilities'\nimport type React from 'react'\n\nimport type { UseDraggableSortableReturn } from '../useDraggableSortable/types.js'\n\nexport type DragHandleProps = {\n  attributes: UseDraggableArguments['attributes']\n  listeners: SyntheticListenerMap\n} & UseDraggableArguments\n\nexport type ChildFunction = (args: UseDraggableSortableReturn) => React.ReactNode\n\nexport type Props = {\n  children: ChildFunction\n} & UseDraggableArguments\n"],"names":[],"mappings":"AAaA,WAEyB"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/DraggableSortable/index.tsx"],"sourcesContent":["'use client'\nimport type { DragEndEvent } from '@dnd-kit/core'\n\nimport {\n  DndContext,\n  KeyboardSensor,\n  PointerSensor,\n  closestCenter,\n  useDroppable,\n  useSensor,\n  useSensors,\n} from '@dnd-kit/core'\nimport { SortableContext, sortableKeyboardCoordinates } from '@dnd-kit/sortable'\nimport React, { useCallback, useId } from 'react'\n\nimport type { Props } from './types.js'\n\nexport { Props }\n\nexport const DraggableSortable: React.FC<Props> = (props) => {\n  const { children, className, ids, onDragEnd } = props\n\n  const id = useId()\n\n  const { setNodeRef } = useDroppable({\n    id,\n  })\n\n  const sensors = useSensors(\n    useSensor(PointerSensor, {\n      activationConstraint: {\n        distance: 5,\n      },\n    }),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates,\n    }),\n  )\n\n  const handleDragEnd = useCallback(\n    (event: DragEndEvent) => {\n      const { active, over } = event\n\n      if (!active || !over) return\n\n      if (typeof onDragEnd === 'function') {\n        onDragEnd({\n          event,\n          moveFromIndex: ids.findIndex((_id) => _id === active.id),\n          moveToIndex: ids.findIndex((_id) => _id === over.id),\n        })\n      }\n    },\n    [onDragEnd, ids],\n  )\n\n  return (\n    <DndContext\n      collisionDetection={closestCenter}\n      id={id}\n      onDragEnd={handleDragEnd}\n      sensors={sensors}\n    >\n      <SortableContext items={ids}>\n        <div className={className} ref={setNodeRef}>\n          {children}\n        </div>\n      </SortableContext>\n    </DndContext>\n  )\n}\n"],"names":["DndContext","KeyboardSensor","PointerSensor","closestCenter","useDroppable","useSensor","useSensors","SortableContext","sortableKeyboardCoordinates","React","useCallback","useId","DraggableSortable","props","children","className","ids","onDragEnd","id","setNodeRef","sensors","activationConstraint","distance","coordinateGetter","handleDragEnd","event","active","over","moveFromIndex","findIndex","_id","moveToIndex","collisionDetection","items","div","ref"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;;AAGA,SACEA,UAAU,EACVC,cAAc,EACdC,aAAa,EACbC,aAAa,EACbC,YAAY,EACZC,SAAS,EACTC,UAAU,QACL,gBAAe;AACtB,SAASC,eAAe,EAAEC,2BAA2B,QAAQ,oBAAmB;AAChF,OAAOC,SAASC,WAAW,EAAEC,KAAK,QAAQ,QAAO;AAMjD,OAAO,MAAMC,oBAAqC,CAACC;IACjD,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,GAAG,EAAEC,SAAS,EAAE,GAAGJ;IAEhD,MAAMK,KAAKP;IAEX,MAAM,EAAEQ,UAAU,EAAE,GAAGf,aAAa;QAClCc;IACF;IAEA,MAAME,UAAUd,WACdD,UAAUH,eAAe;QACvBmB,sBAAsB;YACpBC,UAAU;QACZ;IACF,IACAjB,UAAUJ,gBAAgB;QACxBsB,kBAAkBf;IACpB;IAGF,MAAMgB,gBAAgBd,YACpB,CAACe;QACC,MAAM,EAAEC,MAAM,EAAEC,IAAI,EAAE,GAAGF;QAEzB,IAAI,CAACC,UAAU,CAACC,MAAM;QAEtB,IAAI,OAAOV,cAAc,YAAY;YACnCA,UAAU;gBACRQ;gBACAG,eAAeZ,IAAIa,SAAS,CAAC,CAACC,MAAQA,QAAQJ,OAAOR,EAAE;gBACvDa,aAAaf,IAAIa,SAAS,CAAC,CAACC,MAAQA,QAAQH,KAAKT,EAAE;YACrD;QACF;IACF,GACA;QAACD;QAAWD;KAAI;IAGlB,qBACE,KAAChB;QACCgC,oBAAoB7B;QACpBe,IAAIA;QACJD,WAAWO;QACXJ,SAASA;kBAET,cAAA,KAACb;YAAgB0B,OAAOjB;sBACtB,cAAA,KAACkB;gBAAInB,WAAWA;gBAAWoB,KAAKhB;0BAC7BL;;;;AAKX,EAAC"}
+{"version":3,"sources":["../../../src/elements/DraggableSortable/index.tsx"],"sourcesContent":["'use client'\nimport type { DragEndEvent } from '@dnd-kit/core'\n\nimport {\n  DndContext,\n  KeyboardSensor,\n  PointerSensor,\n  closestCenter,\n  useDroppable,\n  useSensor,\n  useSensors,\n} from '@dnd-kit/core'\nimport { SortableContext, sortableKeyboardCoordinates } from '@dnd-kit/sortable'\nimport React, { useCallback, useId } from 'react'\n\nimport type { Props } from './types.js'\n\nexport { Props }\n\nexport const DraggableSortable: React.FC<Props> = (props) => {\n  const { children, className, ids, onDragEnd } = props\n\n  const id = useId()\n\n  const { setNodeRef } = useDroppable({\n    id,\n  })\n\n  const sensors = useSensors(\n    useSensor(PointerSensor, {\n      activationConstraint: {\n        distance: 5,\n      },\n    }),\n    useSensor(KeyboardSensor, {\n      coordinateGetter: sortableKeyboardCoordinates,\n    }),\n  )\n\n  const handleDragEnd = useCallback(\n    (event: DragEndEvent) => {\n      const { active, over } = event\n\n      if (!active || !over) return\n\n      if (typeof onDragEnd === 'function') {\n        onDragEnd({\n          event,\n          moveFromIndex: ids.findIndex((_id) => _id === active.id),\n          moveToIndex: ids.findIndex((_id) => _id === over.id),\n        })\n      }\n    },\n    [onDragEnd, ids],\n  )\n\n  return (\n    <DndContext\n      collisionDetection={closestCenter}\n      id={id}\n      onDragEnd={handleDragEnd}\n      sensors={sensors}\n    >\n      <SortableContext items={ids}>\n        <div className={className} ref={setNodeRef}>\n          {children}\n        </div>\n      </SortableContext>\n    </DndContext>\n  )\n}\n"],"names":["DndContext","KeyboardSensor","PointerSensor","closestCenter","useDroppable","useSensor","useSensors","SortableContext","sortableKeyboardCoordinates","React","useCallback","useId","DraggableSortable","props","children","className","ids","onDragEnd","id","setNodeRef","sensors","activationConstraint","distance","coordinateGetter","handleDragEnd","event","active","over","moveFromIndex","findIndex","_id","moveToIndex","collisionDetection","items","div","ref"],"mappings":"AAAA;;AAGA,SACEA,UAAU,EACVC,cAAc,EACdC,aAAa,EACbC,aAAa,EACbC,YAAY,EACZC,SAAS,EACTC,UAAU,QACL,gBAAe;AACtB,SAASC,eAAe,EAAEC,2BAA2B,QAAQ,oBAAmB;AAChF,OAAOC,SAASC,WAAW,EAAEC,KAAK,QAAQ,QAAO;AAMjD,OAAO,MAAMC,oBAAqC,CAACC;IACjD,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,GAAG,EAAEC,SAAS,EAAE,GAAGJ;IAEhD,MAAMK,KAAKP;IAEX,MAAM,EAAEQ,UAAU,EAAE,GAAGf,aAAa;QAClCc;IACF;IAEA,MAAME,UAAUd,WACdD,UAAUH,eAAe;QACvBmB,sBAAsB;YACpBC,UAAU;QACZ;IACF,IACAjB,UAAUJ,gBAAgB;QACxBsB,kBAAkBf;IACpB;IAGF,MAAMgB,gBAAgBd,YACpB,CAACe;QACC,MAAM,EAAEC,MAAM,EAAEC,IAAI,EAAE,GAAGF;QAEzB,IAAI,CAACC,UAAU,CAACC,MAAM;QAEtB,IAAI,OAAOV,cAAc,YAAY;YACnCA,UAAU;gBACRQ;gBACAG,eAAeZ,IAAIa,SAAS,CAAC,CAACC,MAAQA,QAAQJ,OAAOR,EAAE;gBACvDa,aAAaf,IAAIa,SAAS,CAAC,CAACC,MAAQA,QAAQH,KAAKT,EAAE;YACrD;QACF;IACF,GACA;QAACD;QAAWD;KAAI;IAGlB,qBACE,KAAChB;QACCgC,oBAAoB7B;QACpBe,IAAIA;QACJD,WAAWO;QACXJ,SAASA;kBAET,cAAA,KAACb;YAAgB0B,OAAOjB;sBACtB,cAAA,KAACkB;gBAAInB,WAAWA;gBAAWoB,KAAKhB;0BAC7BL;;;;AAKX,EAAC"}

package/dist/elements/DraggableSortable/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/DraggableSortable/types.ts"],"sourcesContent":["import type { DragEndEvent } from '@dnd-kit/core'\nimport type { Ref } from 'react'\n\nexport type Props = {\n  children: React.ReactNode\n  className?: string\n  droppableRef?: Ref<HTMLElement>\n  ids: string[]\n  onDragEnd: (e: { event: DragEndEvent; moveFromIndex: number; moveToIndex: number }) => void\n}\n"],"names":[],"rangeMappings":"","mappings":"AAGA,WAMC"}
+{"version":3,"sources":["../../../src/elements/DraggableSortable/types.ts"],"sourcesContent":["import type { DragEndEvent } from '@dnd-kit/core'\nimport type { Ref } from 'react'\n\nexport type Props = {\n  children: React.ReactNode\n  className?: string\n  droppableRef?: Ref<HTMLElement>\n  ids: string[]\n  onDragEnd: (e: { event: DragEndEvent; moveFromIndex: number; moveToIndex: number }) => void\n}\n"],"names":[],"mappings":"AAGA,WAMC"}

package/dist/elements/DraggableSortable/useDraggableSortable/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/DraggableSortable/useDraggableSortable/index.tsx"],"sourcesContent":["'use client'\nimport type { UseDraggableArguments } from '@dnd-kit/core'\n\nimport { useSortable } from '@dnd-kit/sortable'\n\nimport type { UseDraggableSortableReturn } from './types.js'\n\nexport const useDraggableSortable = (props: UseDraggableArguments): UseDraggableSortableReturn => {\n  const { id, disabled } = props\n\n  const { attributes, isDragging, listeners, setNodeRef, transform } = useSortable({\n    id,\n    disabled,\n  })\n\n  return {\n    attributes: {\n      ...attributes,\n      style: {\n        cursor: isDragging ? 'grabbing' : 'grab',\n      },\n    },\n    isDragging,\n    listeners,\n    setNodeRef,\n    transform: transform && `translate3d(${transform.x}px, ${transform.y}px, 0)`, // translate3d is faster than translate in most browsers\n  }\n}\n"],"names":["useSortable","useDraggableSortable","props","id","disabled","attributes","isDragging","listeners","setNodeRef","transform","style","cursor","x","y"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":"AAAA;AAGA,SAASA,WAAW,QAAQ,oBAAmB;AAI/C,OAAO,MAAMC,uBAAuB,CAACC;IACnC,MAAM,EAAEC,EAAE,EAAEC,QAAQ,EAAE,GAAGF;IAEzB,MAAM,EAAEG,UAAU,EAAEC,UAAU,EAAEC,SAAS,EAAEC,UAAU,EAAEC,SAAS,EAAE,GAAGT,YAAY;QAC/EG;QACAC;IACF;IAEA,OAAO;QACLC,YAAY;YACV,GAAGA,UAAU;YACbK,OAAO;gBACLC,QAAQL,aAAa,aAAa;YACpC;QACF;QACAA;QACAC;QACAC;QACAC,WAAWA,aAAa,CAAC,YAAY,EAAEA,UAAUG,CAAC,CAAC,IAAI,EAAEH,UAAUI,CAAC,CAAC,MAAM,CAAC;IAC9E;AACF,EAAC"}
+{"version":3,"sources":["../../../../src/elements/DraggableSortable/useDraggableSortable/index.tsx"],"sourcesContent":["'use client'\nimport type { UseDraggableArguments } from '@dnd-kit/core'\n\nimport { useSortable } from '@dnd-kit/sortable'\n\nimport type { UseDraggableSortableReturn } from './types.js'\n\nexport const useDraggableSortable = (props: UseDraggableArguments): UseDraggableSortableReturn => {\n  const { id, disabled } = props\n\n  const { attributes, isDragging, listeners, setNodeRef, transform } = useSortable({\n    id,\n    disabled,\n  })\n\n  return {\n    attributes: {\n      ...attributes,\n      style: {\n        cursor: isDragging ? 'grabbing' : 'grab',\n      },\n    },\n    isDragging,\n    listeners,\n    setNodeRef,\n    transform: transform && `translate3d(${transform.x}px, ${transform.y}px, 0)`, // translate3d is faster than translate in most browsers\n  }\n}\n"],"names":["useSortable","useDraggableSortable","props","id","disabled","attributes","isDragging","listeners","setNodeRef","transform","style","cursor","x","y"],"mappings":"AAAA;AAGA,SAASA,WAAW,QAAQ,oBAAmB;AAI/C,OAAO,MAAMC,uBAAuB,CAACC;IACnC,MAAM,EAAEC,EAAE,EAAEC,QAAQ,EAAE,GAAGF;IAEzB,MAAM,EAAEG,UAAU,EAAEC,UAAU,EAAEC,SAAS,EAAEC,UAAU,EAAEC,SAAS,EAAE,GAAGT,YAAY;QAC/EG;QACAC;IACF;IAEA,OAAO;QACLC,YAAY;YACV,GAAGA,UAAU;YACbK,OAAO;gBACLC,QAAQL,aAAa,aAAa;YACpC;QACF;QACAA;QACAC;QACAC;QACAC,WAAWA,aAAa,CAAC,YAAY,EAAEA,UAAUG,CAAC,CAAC,IAAI,EAAEH,UAAUI,CAAC,CAAC,MAAM,CAAC;IAC9E;AACF,EAAC"}

package/dist/elements/DraggableSortable/useDraggableSortable/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/elements/DraggableSortable/useDraggableSortable/types.ts"],"sourcesContent":["import type { SyntheticListenerMap } from '@dnd-kit/core/dist/hooks/utilities'\nimport type { HTMLAttributes } from 'react'\n\nexport type UseDraggableSortableReturn = {\n  attributes: HTMLAttributes<unknown>\n  isDragging?: boolean\n  listeners: SyntheticListenerMap\n  setNodeRef: (node: HTMLElement | null) => void\n  transform: string\n}\n"],"names":[],"rangeMappings":"","mappings":"AAGA,WAMC"}
+{"version":3,"sources":["../../../../src/elements/DraggableSortable/useDraggableSortable/types.ts"],"sourcesContent":["import type { SyntheticListenerMap } from '@dnd-kit/core/dist/hooks/utilities'\nimport type { HTMLAttributes } from 'react'\n\nexport type UseDraggableSortableReturn = {\n  attributes: HTMLAttributes<unknown>\n  isDragging?: boolean\n  listeners: SyntheticListenerMap\n  setNodeRef: (node: HTMLElement | null) => void\n  transform: string\n}\n"],"names":[],"mappings":"AAGA,WAMC"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Drawer/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2C,MAAM,OAAO,CAAA;AAE/D,OAAO,KAAK,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAMrD,OAAO,cAAc,CAAA;AAKrB,eAAO,MAAM,gBAAgB,oBAAqB;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,KAAG,MACzD,CAAA;AAE3B,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAElD,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAyBhD,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAmFlC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Drawer/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2C,MAAM,OAAO,CAAA;AAE/D,OAAO,KAAK,EAAE,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAMrD,OAAO,cAAc,CAAA;AAKrB,eAAO,MAAM,gBAAgB,oBAAqB;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,KAAG,MACzD,CAAA;AAE3B,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAElD,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAuBhD,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAuFlC,CAAA"}

package/dist/elements/Drawer/index.js

@@ -1,17 +1,17 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as facelessUIImport from '@faceless-ui/modal';
+import { Modal, useModal } from '@faceless-ui/modal';
 import React, { useCallback, useEffect, useState } from 'react';
-import { X } from '../../icons/X/index.js';
+import { XIcon } from '../../icons/X/index.js';
 import { EditDepthContext, useEditDepth } from '../../providers/EditDepth/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
 import { Gutter } from '../Gutter/index.js';
+import './index.scss';
 const baseClass = 'drawer';
 const zBase = 100;
 export const formatDrawerSlug = ({ slug, depth })=>`drawer_${depth}_${slug}`;
 export { useDrawerSlug } from './useDrawerSlug.js';
 export const DrawerToggler = ({ slug, children, className, disabled, onClick, ...rest })=>{
-    const { Modal, useModal } = facelessUIImport;
     const { openModal } = useModal();
     const handleClick = useCallback((e)=>{
         openModal(slug);
@@ -31,7 +31,6 @@ export const DrawerToggler = ({ slug, children, className, disabled, onClick, ..
     });
 };
 export const Drawer = ({ slug, Header, children, className, gutter = true, hoverTitle, title })=>{
-    const { Modal, useModal } = facelessUIImport;
     const { t } = useTranslation();
     const { closeModal, modalState } = useModal();
     const drawerDepth = useEditDepth();
@@ -74,6 +73,9 @@ export const Drawer = ({ slug, Header, children, className, gutter = true, hover
                 }),
                 /*#__PURE__*/ _jsxs("div", {
                     className: `${baseClass}__content`,
+                    style: {
+                        width: `calc(100% - (${drawerDepth} * var(--gutter-h))`
+                    },
                     children: [
                         /*#__PURE__*/ _jsx("div", {
                             className: `${baseClass}__blur-bg-content`
@@ -100,7 +102,7 @@ export const Drawer = ({ slug, Header, children, className, gutter = true, hover
                                                 id: `close-drawer__${slug}`,
                                                 onClick: ()=>closeModal(slug),
                                                 type: "button",
-                                                children: /*#__PURE__*/ _jsx(X, {})
+                                                children: /*#__PURE__*/ _jsx(XIcon, {})
                                             })
                                         ]
                                     }),

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Drawer/index.tsx"],"sourcesContent":["'use client'\nimport * as facelessUIImport from '@faceless-ui/modal'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport type { Props, TogglerProps } from './types.js'\n\nimport { X } from '../../icons/X/index.js'\nimport { EditDepthContext, useEditDepth } from '../../providers/EditDepth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Gutter } from '../Gutter/index.js'\nimport './index.scss'\n\nconst baseClass = 'drawer'\nconst zBase = 100\n\nexport const formatDrawerSlug = ({ slug, depth }: { depth: number; slug: string }): string =>\n  `drawer_${depth}_${slug}`\n\nexport { useDrawerSlug } from './useDrawerSlug.js'\n\nexport const DrawerToggler: React.FC<TogglerProps> = ({\n  slug,\n  children,\n  className,\n  disabled,\n  onClick,\n  ...rest\n}) => {\n  const { Modal, useModal } = facelessUIImport\n\n  const { openModal } = useModal()\n\n  const handleClick = useCallback(\n    (e) => {\n      openModal(slug)\n      if (typeof onClick === 'function') onClick(e)\n    },\n    [openModal, slug, onClick],\n  )\n\n  return (\n    <button className={className} disabled={disabled} onClick={handleClick} type=\"button\" {...rest}>\n      {children}\n    </button>\n  )\n}\n\nexport const Drawer: React.FC<Props> = ({\n  slug,\n  Header,\n  children,\n  className,\n  gutter = true,\n  hoverTitle,\n  title,\n}) => {\n  const { Modal, useModal } = facelessUIImport\n\n  const { t } = useTranslation()\n  const { closeModal, modalState } = useModal()\n  const drawerDepth = useEditDepth()\n  const [isOpen, setIsOpen] = useState(false)\n  const [animateIn, setAnimateIn] = useState(false)\n\n  useEffect(() => {\n    setIsOpen(modalState[slug]?.isOpen)\n  }, [slug, modalState])\n\n  useEffect(() => {\n    setAnimateIn(isOpen)\n  }, [isOpen])\n\n  if (isOpen) {\n    // IMPORTANT: do not render the drawer until it is explicitly open, this is to avoid large html trees especially when nesting drawers\n    return (\n      <Modal\n        className={[\n          className,\n          baseClass,\n          animateIn && `${baseClass}--is-open`,\n          drawerDepth > 1 && `${baseClass}--nested`,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n        slug={slug}\n        style={{\n          zIndex: zBase + drawerDepth,\n        }}\n      >\n        {(!drawerDepth || drawerDepth === 1) && <div className={`${baseClass}__blur-bg`} />}\n        <button\n          aria-label={t('general:close')}\n          className={`${baseClass}__close`}\n          id={`close-drawer__${slug}`}\n          onClick={() => closeModal(slug)}\n          type=\"button\"\n        />\n        <div className={`${baseClass}__content`}>\n          <div className={`${baseClass}__blur-bg-content`} />\n          <Gutter className={`${baseClass}__content-children`} left={gutter} right={gutter}>\n            <EditDepthContext.Provider value={drawerDepth + 1}>\n              {Header}\n              {Header === undefined && (\n                <div className={`${baseClass}__header`}>\n                  <h2 className={`${baseClass}__header__title`} title={hoverTitle ? title : null}>\n                    {title}\n                  </h2>\n                  {/* TODO: the `button` HTML element breaks CSS transitions on the drawer for some reason...\n                    i.e. changing to a `div` element will fix the animation issue but will break accessibility\n                  */}\n                  <button\n                    aria-label={t('general:close')}\n                    className={`${baseClass}__header__close`}\n                    id={`close-drawer__${slug}`}\n                    onClick={() => closeModal(slug)}\n                    type=\"button\"\n                  >\n                    <X />\n                  </button>\n                </div>\n              )}\n              {children}\n            </EditDepthContext.Provider>\n          </Gutter>\n        </div>\n      </Modal>\n    )\n  }\n\n  return null\n}\n"],"names":["facelessUIImport","React","useCallback","useEffect","useState","X","EditDepthContext","useEditDepth","useTranslation","Gutter","baseClass","zBase","formatDrawerSlug","slug","depth","useDrawerSlug","DrawerToggler","children","className","disabled","onClick","rest","Modal","useModal","openModal","handleClick","e","button","type","Drawer","Header","gutter","hoverTitle","title","t","closeModal","modalState","drawerDepth","isOpen","setIsOpen","animateIn","setAnimateIn","filter","Boolean","join","style","zIndex","div","aria-label","id","left","right","Provider","value","undefined","h2"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["../../../src/elements/Drawer/index.tsx"],"sourcesContent":["'use client'\nimport { Modal, useModal } from '@faceless-ui/modal'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport type { Props, TogglerProps } from './types.js'\n\nimport { XIcon } from '../../icons/X/index.js'\nimport { EditDepthContext, useEditDepth } from '../../providers/EditDepth/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Gutter } from '../Gutter/index.js'\nimport './index.scss'\n\nconst baseClass = 'drawer'\nconst zBase = 100\n\nexport const formatDrawerSlug = ({ slug, depth }: { depth: number; slug: string }): string =>\n  `drawer_${depth}_${slug}`\n\nexport { useDrawerSlug } from './useDrawerSlug.js'\n\nexport const DrawerToggler: React.FC<TogglerProps> = ({\n  slug,\n  children,\n  className,\n  disabled,\n  onClick,\n  ...rest\n}) => {\n  const { openModal } = useModal()\n\n  const handleClick = useCallback(\n    (e) => {\n      openModal(slug)\n      if (typeof onClick === 'function') onClick(e)\n    },\n    [openModal, slug, onClick],\n  )\n\n  return (\n    <button className={className} disabled={disabled} onClick={handleClick} type=\"button\" {...rest}>\n      {children}\n    </button>\n  )\n}\n\nexport const Drawer: React.FC<Props> = ({\n  slug,\n  Header,\n  children,\n  className,\n  gutter = true,\n  hoverTitle,\n  title,\n}) => {\n  const { t } = useTranslation()\n  const { closeModal, modalState } = useModal()\n  const drawerDepth = useEditDepth()\n\n  const [isOpen, setIsOpen] = useState(false)\n  const [animateIn, setAnimateIn] = useState(false)\n\n  useEffect(() => {\n    setIsOpen(modalState[slug]?.isOpen)\n  }, [slug, modalState])\n\n  useEffect(() => {\n    setAnimateIn(isOpen)\n  }, [isOpen])\n\n  if (isOpen) {\n    // IMPORTANT: do not render the drawer until it is explicitly open, this is to avoid large html trees especially when nesting drawers\n    return (\n      <Modal\n        className={[\n          className,\n          baseClass,\n          animateIn && `${baseClass}--is-open`,\n          drawerDepth > 1 && `${baseClass}--nested`,\n        ]\n          .filter(Boolean)\n          .join(' ')}\n        slug={slug}\n        style={{\n          zIndex: zBase + drawerDepth,\n        }}\n      >\n        {(!drawerDepth || drawerDepth === 1) && <div className={`${baseClass}__blur-bg`} />}\n        <button\n          aria-label={t('general:close')}\n          className={`${baseClass}__close`}\n          id={`close-drawer__${slug}`}\n          onClick={() => closeModal(slug)}\n          type=\"button\"\n        />\n        <div\n          className={`${baseClass}__content`}\n          style={{\n            width: `calc(100% - (${drawerDepth} * var(--gutter-h))`,\n          }}\n        >\n          <div className={`${baseClass}__blur-bg-content`} />\n          <Gutter className={`${baseClass}__content-children`} left={gutter} right={gutter}>\n            <EditDepthContext.Provider value={drawerDepth + 1}>\n              {Header}\n              {Header === undefined && (\n                <div className={`${baseClass}__header`}>\n                  <h2 className={`${baseClass}__header__title`} title={hoverTitle ? title : null}>\n                    {title}\n                  </h2>\n                  {/* TODO: the `button` HTML element breaks CSS transitions on the drawer for some reason...\n                    i.e. changing to a `div` element will fix the animation issue but will break accessibility\n                  */}\n                  <button\n                    aria-label={t('general:close')}\n                    className={`${baseClass}__header__close`}\n                    id={`close-drawer__${slug}`}\n                    onClick={() => closeModal(slug)}\n                    type=\"button\"\n                  >\n                    <XIcon />\n                  </button>\n                </div>\n              )}\n              {children}\n            </EditDepthContext.Provider>\n          </Gutter>\n        </div>\n      </Modal>\n    )\n  }\n\n  return null\n}\n"],"names":["Modal","useModal","React","useCallback","useEffect","useState","XIcon","EditDepthContext","useEditDepth","useTranslation","Gutter","baseClass","zBase","formatDrawerSlug","slug","depth","useDrawerSlug","DrawerToggler","children","className","disabled","onClick","rest","openModal","handleClick","e","button","type","Drawer","Header","gutter","hoverTitle","title","t","closeModal","modalState","drawerDepth","isOpen","setIsOpen","animateIn","setAnimateIn","filter","Boolean","join","style","zIndex","div","aria-label","id","width","left","right","Provider","value","undefined","h2"],"mappings":"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"}

package/dist/elements/Drawer/index.scss

@@ -25,7 +25,8 @@ $transTime: 200;
     transform: translateX(calc(var(--base) * 4));
     position: relative;
     z-index: 2;
-    width: calc(100% - var(--gutter-h));
+    // NOTE: width is controlled by js
+    // width: calc(100% - var(--gutter-h));
     overflow: hidden;
     transition: all #{$transTime}ms linear;
     background-color: var(--theme-bg);

package/dist/elements/Drawer/types.d.ts

@@ -8,10 +8,10 @@ export type Props = {
     slug: string;
     title?: string;
 };
-export type TogglerProps = HTMLAttributes<HTMLButtonElement> & {
+export type TogglerProps = {
     children: React.ReactNode;
     className?: string;
     disabled?: boolean;
     slug: string;
-};
+} & HTMLAttributes<HTMLButtonElement>;
 //# sourceMappingURL=types.d.ts.map

package/dist/elements/Drawer/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/Drawer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,MAAM,MAAM,KAAK,GAAG;IAClB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED,MAAM,MAAM,YAAY,GAAG,cAAc,CAAC,iBAAiB,CAAC,GAAG;IAC7D,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,EAAE,MAAM,CAAA;CACb,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/elements/Drawer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAE3C,MAAM,MAAM,KAAK,GAAG;IAClB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACxB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,CAAC,EAAE,MAAM,CAAA;CACf,CAAA;AAED,MAAM,MAAM,YAAY,GAAG;IACzB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,EAAE,MAAM,CAAA;CACb,GAAG,cAAc,CAAC,iBAAiB,CAAC,CAAA"}

package/dist/elements/Drawer/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Drawer/types.ts"],"sourcesContent":["import type { HTMLAttributes } from 'react'\n\nexport type Props = {\n  Header?: React.ReactNode\n  children: React.ReactNode\n  className?: string\n  gutter?: boolean\n  hoverTitle?: boolean\n  slug: string\n  title?: string\n}\n\nexport type TogglerProps = HTMLAttributes<HTMLButtonElement> & {\n  children: React.ReactNode\n  className?: string\n  disabled?: boolean\n  slug: string\n}\n"],"names":[],"rangeMappings":"","mappings":"AAYA,WAKC"}
+{"version":3,"sources":["../../../src/elements/Drawer/types.ts"],"sourcesContent":["import type { HTMLAttributes } from 'react'\n\nexport type Props = {\n  Header?: React.ReactNode\n  children: React.ReactNode\n  className?: string\n  gutter?: boolean\n  hoverTitle?: boolean\n  slug: string\n  title?: string\n}\n\nexport type TogglerProps = {\n  children: React.ReactNode\n  className?: string\n  disabled?: boolean\n  slug: string\n} & HTMLAttributes<HTMLButtonElement>\n"],"names":[],"mappings":"AAYA,WAKqC"}

package/dist/elements/Drawer/useDrawerSlug.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/Drawer/useDrawerSlug.tsx"],"sourcesContent":["'use client'\nimport { useId } from 'react'\n\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { formatDrawerSlug } from './index.js'\n\nexport const useDrawerSlug = (slug: string): string => {\n  const uuid = useId()\n  const editDepth = useEditDepth()\n  return formatDrawerSlug({\n    slug: `${slug}-${uuid}`,\n    depth: editDepth,\n  })\n}\n"],"names":["useId","useEditDepth","formatDrawerSlug","useDrawerSlug","slug","uuid","editDepth","depth"],"rangeMappings":";;;;;;;;;;;","mappings":"AAAA;AACA,SAASA,KAAK,QAAQ,QAAO;AAE7B,SAASC,YAAY,QAAQ,qCAAoC;AACjE,SAASC,gBAAgB,QAAQ,aAAY;AAE7C,OAAO,MAAMC,gBAAgB,CAACC;IAC5B,MAAMC,OAAOL;IACb,MAAMM,YAAYL;IAClB,OAAOC,iBAAiB;QACtBE,MAAM,CAAC,EAAEA,KAAK,CAAC,EAAEC,KAAK,CAAC;QACvBE,OAAOD;IACT;AACF,EAAC"}
+{"version":3,"sources":["../../../src/elements/Drawer/useDrawerSlug.tsx"],"sourcesContent":["'use client'\nimport { useId } from 'react'\n\nimport { useEditDepth } from '../../providers/EditDepth/index.js'\nimport { formatDrawerSlug } from './index.js'\n\nexport const useDrawerSlug = (slug: string): string => {\n  const uuid = useId()\n  const editDepth = useEditDepth()\n  return formatDrawerSlug({\n    slug: `${slug}-${uuid}`,\n    depth: editDepth,\n  })\n}\n"],"names":["useId","useEditDepth","formatDrawerSlug","useDrawerSlug","slug","uuid","editDepth","depth"],"mappings":"AAAA;AACA,SAASA,KAAK,QAAQ,QAAO;AAE7B,SAASC,YAAY,QAAQ,qCAAoC;AACjE,SAASC,gBAAgB,QAAQ,aAAY;AAE7C,OAAO,MAAMC,gBAAgB,CAACC;IAC5B,MAAMC,OAAOL;IACb,MAAMM,YAAYL;IAClB,OAAOC,iBAAiB;QACtBE,MAAM,CAAC,EAAEA,KAAK,CAAC,EAAEC,KAAK,CAAC;QACvBE,OAAOD;IACT;AACF,EAAC"}

package/dist/elements/Dropzone/index.d.ts

@@ -4,6 +4,7 @@ export type Props = {
     className?: string;
     mimeTypes?: string[];
     onChange: (e: FileList) => void;
+    onPasteUrlClick?: () => void;
 };
 export declare const Dropzone: React.FC<Props>;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Dropzone/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,cAAc,CAAA;AASrB,MAAM,MAAM,KAAK,GAAG;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,EAAE,CAAA;IACpB,QAAQ,EAAE,CAAC,CAAC,EAAE,QAAQ,KAAK,IAAI,CAAA;CAChC,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA0GpC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Dropzone/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AAIzB,OAAO,cAAc,CAAA;AASrB,MAAM,MAAM,KAAK,GAAG;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,EAAE,CAAA;IACpB,QAAQ,EAAE,CAAC,CAAC,EAAE,QAAQ,KAAK,IAAI,CAAA;IAC/B,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;CAC7B,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAiHpC,CAAA"}

package/dist/elements/Dropzone/index.js

@@ -3,12 +3,13 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React from 'react';
 import { useTranslation } from '../../providers/Translation/index.js';
 import { Button } from '../Button/index.js';
+import './index.scss';
 const handleDragOver = (e)=>{
     e.preventDefault();
     e.stopPropagation();
 };
 const baseClass = 'dropzone';
-export const Dropzone = ({ className, mimeTypes, onChange })=>{
+export const Dropzone = ({ className, mimeTypes, onChange, onPasteUrlClick })=>{
     const dropRef = React.useRef(null);
     const [dragging, setDragging] = React.useState(false);
     const inputRef = React.useRef(null);
@@ -92,6 +93,13 @@ export const Dropzone = ({ className, mimeTypes, onChange })=>{
                 size: "small",
                 children: t('upload:selectFile')
             }),
+            /*#__PURE__*/ _jsx(Button, {
+                buttonStyle: "secondary",
+                className: `${baseClass}__file-button`,
+                onClick: onPasteUrlClick,
+                size: "small",
+                children: t('upload:pasteURL')
+            }),
             /*#__PURE__*/ _jsx("input", {
                 accept: mimeTypes?.join(','),
                 className: `${baseClass}__hidden-input`,