lkb-fields-document 1.0.0 → 1.0.1

package/dist/layouts-6412fa2a.esm.js

@@ -1,189 +0,0 @@
-'use client';
-import { createContext, useContext, useMemo } from 'react';
-import { Transforms } from 'slate';
-import { useSlateStatic, ReactEditor } from 'slate-react';
-import { Icon } from '@keystar/ui/icon';
-import { columnsIcon } from '@keystar/ui/icon/icons/columnsIcon';
-import { trash2Icon } from '@keystar/ui/icon/icons/trash2Icon';
-import { j as isElementActive } from './utils-bc6a0b82.esm.js';
-import { j as blockElementSpacing, B as BlockPopoverTrigger, c as BlockPopover, d as useToolbarState } from './toolbar-state-bc8fe661.esm.js';
-import { i as insertLayout } from './shared-aaba5901.esm.js';
-import { css, tokenSchema } from '@keystar/ui/style';
-import { ActionGroup } from '@keystar/ui/action-group';
-import { ActionButton } from '@keystar/ui/button';
-import { Flex } from '@keystar/ui/layout';
-import { Item } from '@keystar/ui/tag';
-import { TooltipTrigger, Tooltip } from '@keystar/ui/tooltip';
-import { EditorToolbarButton } from '@keystar/ui/editor';
-import { jsx, jsxs } from 'react/jsx-runtime';
-import '@keystar/ui/typography';
-import './api-2f524611.esm.js';
-import 'lkb-core';
-import '@keystar/ui/drag-and-drop';
-import './index-67d52357.esm.js';
-import '@braintree/sanitize-url';
-import '@react-aria/i18n';
-import '@keystar/ui/number-field';
-import '@keystar/ui/picker';
-import '@keystar/ui/combobox';
-import '@keystar/ui/text-field';
-import '@keystar/ui/checkbox';
-import './form-from-preview-b3a66f37.esm.js';
-import 'lkb-core/admin-ui/context';
-import 'lkb-core/fields/types/relationship/views';
-import 'lkb-core/admin-ui/utils';
-import '@keystar/ui/dialog';
-import '@keystar/ui/field';
-import '@keystar/ui/list-view';
-import '@keystar/ui/slots';
-import '@keystar/ui/icon/icons/trashIcon';
-import '@react-aria/overlays';
-import '@react-aria/utils';
-import '@react-stately/overlays';
-import '@keystar/ui/overlays';
-import '@emotion/weak-memoize';
-import './layouts-6412fa2a.esm.js';
-
-const LayoutOptionsContext = /*#__PURE__*/createContext([]);
-const LayoutOptionsProvider = LayoutOptionsContext.Provider;
-
-// UI Components
-const LayoutContainer = ({
-  attributes,
-  children,
-  element
-}) => {
-  const editor = useSlateStatic();
-  const layout = element.layout;
-  const layoutOptions = useContext(LayoutOptionsContext);
-  const currentLayoutIndex = layoutOptions.findIndex(x => x.toString() === layout.toString());
-  return /*#__PURE__*/jsx("div", {
-    className: blockElementSpacing,
-    ...attributes,
-    children: /*#__PURE__*/jsxs(BlockPopoverTrigger, {
-      element: element,
-      children: [/*#__PURE__*/jsx("div", {
-        className: css({
-          columnGap: tokenSchema.size.space.regular,
-          display: 'grid'
-        }),
-        style: {
-          gridTemplateColumns: layout.map(x => `${x}fr`).join(' ')
-        },
-        children: children
-      }), /*#__PURE__*/jsx(BlockPopover, {
-        children: /*#__PURE__*/jsxs(Flex, {
-          padding: "regular",
-          gap: "regular",
-          children: [/*#__PURE__*/jsx(ActionGroup, {
-            selectionMode: "single",
-            prominence: "low",
-            density: "compact",
-            onAction: key => {
-              const path = ReactEditor.findPath(editor, element);
-              const layoutOption = layoutOptions[key];
-              Transforms.setNodes(editor, {
-                type: 'layout',
-                layout: layoutOption
-              }, {
-                at: path
-              });
-              ReactEditor.focus(editor);
-            },
-            selectedKeys: currentLayoutIndex !== -1 ? [currentLayoutIndex.toString()] : [],
-            children: layoutOptions.map((layoutOption, i) => /*#__PURE__*/jsx(Item, {
-              children: makeLayoutIcon(layoutOption)
-            }, i))
-          }), /*#__PURE__*/jsxs(TooltipTrigger, {
-            children: [/*#__PURE__*/jsx(ActionButton, {
-              prominence: "low",
-              onPress: () => {
-                const path = ReactEditor.findPath(editor, element);
-                Transforms.removeNodes(editor, {
-                  at: path
-                });
-              },
-              children: /*#__PURE__*/jsx(Icon, {
-                src: trash2Icon
-              })
-            }), /*#__PURE__*/jsx(Tooltip, {
-              tone: "critical",
-              children: "\u5220\u9664"
-            })]
-          })]
-        })
-      })]
-    })
-  });
-};
-const LayoutArea = ({
-  attributes,
-  children
-}) => {
-  return /*#__PURE__*/jsx("div", {
-    className: css({
-      borderColor: tokenSchema.color.border.neutral,
-      borderRadius: tokenSchema.size.radius.regular,
-      borderStyle: 'dashed',
-      borderWidth: tokenSchema.size.border.regular,
-      padding: tokenSchema.size.space.medium
-    }),
-    ...attributes,
-    children: children
-  });
-};
-function makeLayoutIcon(ratios) {
-  const size = 16;
-  const element = /*#__PURE__*/jsx("div", {
-    role: "img",
-    className: css({
-      display: 'grid',
-      gridTemplateColumns: ratios.map(r => `${r}fr`).join(' '),
-      gap: 2,
-      width: size,
-      height: size
-    }),
-    children: ratios.map((_, i) => {
-      return /*#__PURE__*/jsx("div", {
-        className: css({
-          backgroundColor: 'currentcolor',
-          borderRadius: 1
-        })
-      }, i);
-    })
-  });
-  return element;
-}
-const layoutsIcon = /*#__PURE__*/jsx(Icon, {
-  src: columnsIcon
-});
-const LayoutsButton = ({
-  layouts
-}) => {
-  const {
-    editor,
-    layouts: {
-      isSelected
-    }
-  } = useToolbarState();
-  return useMemo(() => /*#__PURE__*/jsxs(TooltipTrigger, {
-    children: [/*#__PURE__*/jsx(EditorToolbarButton, {
-      isSelected: isSelected,
-      onPress: () => {
-        if (isElementActive(editor, 'layout')) {
-          Transforms.unwrapNodes(editor, {
-            match: node => node.type === 'layout'
-          });
-        } else {
-          insertLayout(editor, layouts[0]);
-        }
-        ReactEditor.focus(editor);
-      },
-      children: layoutsIcon
-    }), /*#__PURE__*/jsx(Tooltip, {
-      children: "\u5E03\u5C40"
-    })]
-  }), [editor, isSelected, layouts]);
-};
-
-export { LayoutArea, LayoutContainer, LayoutOptionsProvider, LayoutsButton };

package/dist/layouts-a4a3cf0b.node.cjs.js

@@ -1,196 +0,0 @@
-'use client';
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-var slate = require('slate');
-var slateReact = require('slate-react');
-var icon = require('@keystar/ui/icon');
-var columnsIcon = require('@keystar/ui/icon/icons/columnsIcon');
-var trash2Icon = require('@keystar/ui/icon/icons/trash2Icon');
-var utils = require('./utils-06bcddc4.node.cjs.js');
-var toolbarState = require('./toolbar-state-9611743f.node.cjs.js');
-var shared = require('./shared-4684cc24.node.cjs.js');
-var style = require('@keystar/ui/style');
-var actionGroup = require('@keystar/ui/action-group');
-var button = require('@keystar/ui/button');
-var layout = require('@keystar/ui/layout');
-var tag = require('@keystar/ui/tag');
-var tooltip = require('@keystar/ui/tooltip');
-var editor = require('@keystar/ui/editor');
-var jsxRuntime = require('react/jsx-runtime');
-require('@keystar/ui/typography');
-require('./api-8e2b20b8.node.cjs.js');
-require('lkb-core');
-require('@keystar/ui/drag-and-drop');
-require('./index-c3223fdc.node.cjs.js');
-require('@braintree/sanitize-url');
-require('@react-aria/i18n');
-require('@keystar/ui/number-field');
-require('@keystar/ui/picker');
-require('@keystar/ui/combobox');
-require('@keystar/ui/text-field');
-require('@keystar/ui/checkbox');
-require('./form-from-preview-9e501058.node.cjs.js');
-require('lkb-core/admin-ui/context');
-require('lkb-core/fields/types/relationship/views');
-require('lkb-core/admin-ui/utils');
-require('@keystar/ui/dialog');
-require('@keystar/ui/field');
-require('@keystar/ui/list-view');
-require('@keystar/ui/slots');
-require('@keystar/ui/icon/icons/trashIcon');
-require('@react-aria/overlays');
-require('@react-aria/utils');
-require('@react-stately/overlays');
-require('@keystar/ui/overlays');
-require('@emotion/weak-memoize');
-require('./layouts-a4a3cf0b.node.cjs.js');
-
-const LayoutOptionsContext = /*#__PURE__*/React.createContext([]);
-const LayoutOptionsProvider = LayoutOptionsContext.Provider;
-
-// UI Components
-const LayoutContainer = ({
-  attributes,
-  children,
-  element
-}) => {
-  const editor = slateReact.useSlateStatic();
-  const layout$1 = element.layout;
-  const layoutOptions = React.useContext(LayoutOptionsContext);
-  const currentLayoutIndex = layoutOptions.findIndex(x => x.toString() === layout$1.toString());
-  return /*#__PURE__*/jsxRuntime.jsx("div", {
-    className: toolbarState.blockElementSpacing,
-    ...attributes,
-    children: /*#__PURE__*/jsxRuntime.jsxs(toolbarState.BlockPopoverTrigger, {
-      element: element,
-      children: [/*#__PURE__*/jsxRuntime.jsx("div", {
-        className: style.css({
-          columnGap: style.tokenSchema.size.space.regular,
-          display: 'grid'
-        }),
-        style: {
-          gridTemplateColumns: layout$1.map(x => `${x}fr`).join(' ')
-        },
-        children: children
-      }), /*#__PURE__*/jsxRuntime.jsx(toolbarState.BlockPopover, {
-        children: /*#__PURE__*/jsxRuntime.jsxs(layout.Flex, {
-          padding: "regular",
-          gap: "regular",
-          children: [/*#__PURE__*/jsxRuntime.jsx(actionGroup.ActionGroup, {
-            selectionMode: "single",
-            prominence: "low",
-            density: "compact",
-            onAction: key => {
-              const path = slateReact.ReactEditor.findPath(editor, element);
-              const layoutOption = layoutOptions[key];
-              slate.Transforms.setNodes(editor, {
-                type: 'layout',
-                layout: layoutOption
-              }, {
-                at: path
-              });
-              slateReact.ReactEditor.focus(editor);
-            },
-            selectedKeys: currentLayoutIndex !== -1 ? [currentLayoutIndex.toString()] : [],
-            children: layoutOptions.map((layoutOption, i) => /*#__PURE__*/jsxRuntime.jsx(tag.Item, {
-              children: makeLayoutIcon(layoutOption)
-            }, i))
-          }), /*#__PURE__*/jsxRuntime.jsxs(tooltip.TooltipTrigger, {
-            children: [/*#__PURE__*/jsxRuntime.jsx(button.ActionButton, {
-              prominence: "low",
-              onPress: () => {
-                const path = slateReact.ReactEditor.findPath(editor, element);
-                slate.Transforms.removeNodes(editor, {
-                  at: path
-                });
-              },
-              children: /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-                src: trash2Icon.trash2Icon
-              })
-            }), /*#__PURE__*/jsxRuntime.jsx(tooltip.Tooltip, {
-              tone: "critical",
-              children: "\u5220\u9664"
-            })]
-          })]
-        })
-      })]
-    })
-  });
-};
-const LayoutArea = ({
-  attributes,
-  children
-}) => {
-  return /*#__PURE__*/jsxRuntime.jsx("div", {
-    className: style.css({
-      borderColor: style.tokenSchema.color.border.neutral,
-      borderRadius: style.tokenSchema.size.radius.regular,
-      borderStyle: 'dashed',
-      borderWidth: style.tokenSchema.size.border.regular,
-      padding: style.tokenSchema.size.space.medium
-    }),
-    ...attributes,
-    children: children
-  });
-};
-function makeLayoutIcon(ratios) {
-  const size = 16;
-  const element = /*#__PURE__*/jsxRuntime.jsx("div", {
-    role: "img",
-    className: style.css({
-      display: 'grid',
-      gridTemplateColumns: ratios.map(r => `${r}fr`).join(' '),
-      gap: 2,
-      width: size,
-      height: size
-    }),
-    children: ratios.map((_, i) => {
-      return /*#__PURE__*/jsxRuntime.jsx("div", {
-        className: style.css({
-          backgroundColor: 'currentcolor',
-          borderRadius: 1
-        })
-      }, i);
-    })
-  });
-  return element;
-}
-const layoutsIcon = /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-  src: columnsIcon.columnsIcon
-});
-const LayoutsButton = ({
-  layouts
-}) => {
-  const {
-    editor: editor$1,
-    layouts: {
-      isSelected
-    }
-  } = toolbarState.useToolbarState();
-  return React.useMemo(() => /*#__PURE__*/jsxRuntime.jsxs(tooltip.TooltipTrigger, {
-    children: [/*#__PURE__*/jsxRuntime.jsx(editor.EditorToolbarButton, {
-      isSelected: isSelected,
-      onPress: () => {
-        if (utils.isElementActive(editor$1, 'layout')) {
-          slate.Transforms.unwrapNodes(editor$1, {
-            match: node => node.type === 'layout'
-          });
-        } else {
-          shared.insertLayout(editor$1, layouts[0]);
-        }
-        slateReact.ReactEditor.focus(editor$1);
-      },
-      children: layoutsIcon
-    }), /*#__PURE__*/jsxRuntime.jsx(tooltip.Tooltip, {
-      children: "\u5E03\u5C40"
-    })]
-  }), [editor$1, isSelected, layouts]);
-};
-
-exports.LayoutArea = LayoutArea;
-exports.LayoutContainer = LayoutContainer;
-exports.LayoutOptionsProvider = LayoutOptionsProvider;
-exports.LayoutsButton = LayoutsButton;

package/dist/layouts-ba9a558b.cjs.js

@@ -1,196 +0,0 @@
-'use client';
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-var slate = require('slate');
-var slateReact = require('slate-react');
-var icon = require('@keystar/ui/icon');
-var columnsIcon = require('@keystar/ui/icon/icons/columnsIcon');
-var trash2Icon = require('@keystar/ui/icon/icons/trash2Icon');
-var utils = require('./utils-6409f730.cjs.js');
-var toolbarState = require('./toolbar-state-3359e2f3.cjs.js');
-var shared = require('./shared-0533009e.cjs.js');
-var style = require('@keystar/ui/style');
-var actionGroup = require('@keystar/ui/action-group');
-var button = require('@keystar/ui/button');
-var layout = require('@keystar/ui/layout');
-var tag = require('@keystar/ui/tag');
-var tooltip = require('@keystar/ui/tooltip');
-var editor = require('@keystar/ui/editor');
-var jsxRuntime = require('react/jsx-runtime');
-require('@keystar/ui/typography');
-require('./api-73636987.cjs.js');
-require('lkb-core');
-require('@keystar/ui/drag-and-drop');
-require('./index-06c36775.cjs.js');
-require('@braintree/sanitize-url');
-require('@react-aria/i18n');
-require('@keystar/ui/number-field');
-require('@keystar/ui/picker');
-require('@keystar/ui/combobox');
-require('@keystar/ui/text-field');
-require('@keystar/ui/checkbox');
-require('./form-from-preview-2042b9ef.cjs.js');
-require('lkb-core/admin-ui/context');
-require('lkb-core/fields/types/relationship/views');
-require('lkb-core/admin-ui/utils');
-require('@keystar/ui/dialog');
-require('@keystar/ui/field');
-require('@keystar/ui/list-view');
-require('@keystar/ui/slots');
-require('@keystar/ui/icon/icons/trashIcon');
-require('@react-aria/overlays');
-require('@react-aria/utils');
-require('@react-stately/overlays');
-require('@keystar/ui/overlays');
-require('@emotion/weak-memoize');
-require('./layouts-ba9a558b.cjs.js');
-
-const LayoutOptionsContext = /*#__PURE__*/React.createContext([]);
-const LayoutOptionsProvider = LayoutOptionsContext.Provider;
-
-// UI Components
-const LayoutContainer = ({
-  attributes,
-  children,
-  element
-}) => {
-  const editor = slateReact.useSlateStatic();
-  const layout$1 = element.layout;
-  const layoutOptions = React.useContext(LayoutOptionsContext);
-  const currentLayoutIndex = layoutOptions.findIndex(x => x.toString() === layout$1.toString());
-  return /*#__PURE__*/jsxRuntime.jsx("div", {
-    className: toolbarState.blockElementSpacing,
-    ...attributes,
-    children: /*#__PURE__*/jsxRuntime.jsxs(toolbarState.BlockPopoverTrigger, {
-      element: element,
-      children: [/*#__PURE__*/jsxRuntime.jsx("div", {
-        className: style.css({
-          columnGap: style.tokenSchema.size.space.regular,
-          display: 'grid'
-        }),
-        style: {
-          gridTemplateColumns: layout$1.map(x => `${x}fr`).join(' ')
-        },
-        children: children
-      }), /*#__PURE__*/jsxRuntime.jsx(toolbarState.BlockPopover, {
-        children: /*#__PURE__*/jsxRuntime.jsxs(layout.Flex, {
-          padding: "regular",
-          gap: "regular",
-          children: [/*#__PURE__*/jsxRuntime.jsx(actionGroup.ActionGroup, {
-            selectionMode: "single",
-            prominence: "low",
-            density: "compact",
-            onAction: key => {
-              const path = slateReact.ReactEditor.findPath(editor, element);
-              const layoutOption = layoutOptions[key];
-              slate.Transforms.setNodes(editor, {
-                type: 'layout',
-                layout: layoutOption
-              }, {
-                at: path
-              });
-              slateReact.ReactEditor.focus(editor);
-            },
-            selectedKeys: currentLayoutIndex !== -1 ? [currentLayoutIndex.toString()] : [],
-            children: layoutOptions.map((layoutOption, i) => /*#__PURE__*/jsxRuntime.jsx(tag.Item, {
-              children: makeLayoutIcon(layoutOption)
-            }, i))
-          }), /*#__PURE__*/jsxRuntime.jsxs(tooltip.TooltipTrigger, {
-            children: [/*#__PURE__*/jsxRuntime.jsx(button.ActionButton, {
-              prominence: "low",
-              onPress: () => {
-                const path = slateReact.ReactEditor.findPath(editor, element);
-                slate.Transforms.removeNodes(editor, {
-                  at: path
-                });
-              },
-              children: /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-                src: trash2Icon.trash2Icon
-              })
-            }), /*#__PURE__*/jsxRuntime.jsx(tooltip.Tooltip, {
-              tone: "critical",
-              children: "\u5220\u9664"
-            })]
-          })]
-        })
-      })]
-    })
-  });
-};
-const LayoutArea = ({
-  attributes,
-  children
-}) => {
-  return /*#__PURE__*/jsxRuntime.jsx("div", {
-    className: style.css({
-      borderColor: style.tokenSchema.color.border.neutral,
-      borderRadius: style.tokenSchema.size.radius.regular,
-      borderStyle: 'dashed',
-      borderWidth: style.tokenSchema.size.border.regular,
-      padding: style.tokenSchema.size.space.medium
-    }),
-    ...attributes,
-    children: children
-  });
-};
-function makeLayoutIcon(ratios) {
-  const size = 16;
-  const element = /*#__PURE__*/jsxRuntime.jsx("div", {
-    role: "img",
-    className: style.css({
-      display: 'grid',
-      gridTemplateColumns: ratios.map(r => `${r}fr`).join(' '),
-      gap: 2,
-      width: size,
-      height: size
-    }),
-    children: ratios.map((_, i) => {
-      return /*#__PURE__*/jsxRuntime.jsx("div", {
-        className: style.css({
-          backgroundColor: 'currentcolor',
-          borderRadius: 1
-        })
-      }, i);
-    })
-  });
-  return element;
-}
-const layoutsIcon = /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-  src: columnsIcon.columnsIcon
-});
-const LayoutsButton = ({
-  layouts
-}) => {
-  const {
-    editor: editor$1,
-    layouts: {
-      isSelected
-    }
-  } = toolbarState.useToolbarState();
-  return React.useMemo(() => /*#__PURE__*/jsxRuntime.jsxs(tooltip.TooltipTrigger, {
-    children: [/*#__PURE__*/jsxRuntime.jsx(editor.EditorToolbarButton, {
-      isSelected: isSelected,
-      onPress: () => {
-        if (utils.isElementActive(editor$1, 'layout')) {
-          slate.Transforms.unwrapNodes(editor$1, {
-            match: node => node.type === 'layout'
-          });
-        } else {
-          shared.insertLayout(editor$1, layouts[0]);
-        }
-        slateReact.ReactEditor.focus(editor$1);
-      },
-      children: layoutsIcon
-    }), /*#__PURE__*/jsxRuntime.jsx(tooltip.Tooltip, {
-      children: "\u5E03\u5C40"
-    })]
-  }), [editor$1, isSelected, layouts]);
-};
-
-exports.LayoutArea = LayoutArea;
-exports.LayoutContainer = LayoutContainer;
-exports.LayoutOptionsProvider = LayoutOptionsProvider;
-exports.LayoutsButton = LayoutsButton;