@frontify/guideline-blocks-settings 0.28.2 → 0.28.3

package/dist/utilities/react/getBackgroundColorStyles.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"getBackgroundColorStyles.es.js","sources":["../../../src/utilities/react/getBackgroundColorStyles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { CSSProperties } from 'react';\n\nimport { Color } from '@frontify/fondue';\n\nimport { toRgbaString } from '../color';\n\nexport const getBackgroundColorStyles = (backgroundColor: Color): CSSProperties => ({\n    backgroundColor: toRgbaString(backgroundColor),\n});\n"],"names":["getBackgroundColorStyles","backgroundColor","toRgbaString"],"mappings":";AAQa,MAAAA,IAA2B,CAACC,OAA2C;AAAA,EAChF,iBAAiBC,EAAaD,CAAe;AACjD;"}
+{"version":3,"file":"getBackgroundColorStyles.es.js","sources":["../../../src/utilities/react/getBackgroundColorStyles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport type { CSSProperties } from 'react';\nimport type { Color } from '@frontify/fondue';\n\nimport { toRgbaString } from '../color';\n\nexport const getBackgroundColorStyles = (backgroundColor: Color): CSSProperties => ({\n    backgroundColor: toRgbaString(backgroundColor),\n});\n"],"names":["getBackgroundColorStyles","backgroundColor","toRgbaString"],"mappings":";AAOa,MAAAA,IAA2B,CAACC,OAA2C;AAAA,EAChF,iBAAiBC,EAAaD,CAAe;AACjD;"}

package/dist/utilities/react/getBorderStyles.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"getBorderStyles.es.js","sources":["../../../src/utilities/react/getBorderStyles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { CSSProperties } from 'react';\n\nimport { Color } from '@frontify/fondue';\n\nimport { BorderStyle, borderStyleMap } from '../../settings/types';\nimport { BORDER_COLOR_DEFAULT_VALUE } from '../../settings/defaultValues';\nimport { toRgbaString } from '../color';\n\nexport const getBorderStyles = (\n    style = BorderStyle.Solid,\n    borderWidth = '1px',\n    color = BORDER_COLOR_DEFAULT_VALUE as Color,\n): CSSProperties => {\n    return {\n        borderStyle: borderStyleMap[style],\n        borderWidth,\n        borderColor: toRgbaString(color),\n    };\n};\n"],"names":["getBorderStyles","style","BorderStyle","borderWidth","color","BORDER_COLOR_DEFAULT_VALUE","borderStyleMap","toRgbaString"],"mappings":";;;AAUa,MAAAA,IAAkB,CAC3BC,IAAQC,EAAY,OACpBC,IAAc,OACdC,IAAQC,OAED;AAAA,EACH,aAAaC,EAAeL,CAAK;AAAA,EACjC,aAAAE;AAAA,EACA,aAAaI,EAAaH,CAAK;AAAA;"}
+{"version":3,"file":"getBorderStyles.es.js","sources":["../../../src/utilities/react/getBorderStyles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport type { CSSProperties } from 'react';\nimport type { Color } from '@frontify/fondue';\n\nimport { BorderStyle, borderStyleMap } from '../../settings/types';\nimport { BORDER_COLOR_DEFAULT_VALUE } from '../../settings/defaultValues';\nimport { toRgbaString } from '../color';\n\nexport const getBorderStyles = (\n    style = BorderStyle.Solid,\n    borderWidth = '1px',\n    color = BORDER_COLOR_DEFAULT_VALUE as Color,\n): CSSProperties => {\n    return {\n        borderStyle: borderStyleMap[style],\n        borderWidth,\n        borderColor: toRgbaString(color),\n    };\n};\n"],"names":["getBorderStyles","style","BorderStyle","borderWidth","color","BORDER_COLOR_DEFAULT_VALUE","borderStyleMap","toRgbaString"],"mappings":";;;AASa,MAAAA,IAAkB,CAC3BC,IAAQC,EAAY,OACpBC,IAAc,OACdC,IAAQC,OAED;AAAA,EACH,aAAaC,EAAeL,CAAK;AAAA,EACjC,aAAAE;AAAA,EACA,aAAaI,EAAaH,CAAK;AAAA;"}

package/dist/utilities/react/getRadiusStyles.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"getRadiusStyles.es.js","sources":["../../../src/utilities/react/getRadiusStyles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { CSSProperties } from 'react';\nimport { Radius, radiusStyleMap } from '../../settings/types';\n\nexport const getRadiusStyles = (radiusChoice: Radius, hasRadius = false, radiusValue?: number): CSSProperties => ({\n    borderRadius: hasRadius ? radiusValue : radiusStyleMap[radiusChoice],\n});\n"],"names":["getRadiusStyles","radiusChoice","hasRadius","radiusValue","radiusStyleMap"],"mappings":";AAKO,MAAMA,IAAkB,CAACC,GAAsBC,IAAY,IAAOC,OAAyC;AAAA,EAC9G,cAAcD,IAAYC,IAAcC,EAAeH,CAAY;AACvE;"}
+{"version":3,"file":"getRadiusStyles.es.js","sources":["../../../src/utilities/react/getRadiusStyles.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport type { CSSProperties } from 'react';\nimport { Radius, radiusStyleMap } from '../../settings/types';\n\nexport const getRadiusStyles = (radiusChoice: Radius, hasRadius = false, radiusValue?: number): CSSProperties => ({\n    borderRadius: hasRadius ? radiusValue : radiusStyleMap[radiusChoice],\n});\n"],"names":["getRadiusStyles","radiusChoice","hasRadius","radiusValue","radiusStyleMap"],"mappings":";AAKO,MAAMA,IAAkB,CAACC,GAAsBC,IAAY,IAAOC,OAAyC;AAAA,EAC9G,cAAcD,IAAYC,IAAcC,EAAeH,CAAY;AACvE;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@frontify/guideline-blocks-settings",
-  "version": "0.28.2",
+  "version": "0.28.3",
   "description": "Provides types and helpers for the guideline block development",
   "sideEffects": false,
   "main": "dist/index.umd.js",
@@ -49,6 +49,7 @@
     "typescript": "^5.1.6",
     "vite": "^4.4.8",
     "vite-plugin-dts": "^3.5.0",
+    "vite-plugin-externals": "^0.6.2",
     "vitest": "^0.34.1"
   },
   "dependencies": {
@@ -56,7 +57,7 @@
     "@dnd-kit/core": "^6.0.8",
     "@dnd-kit/modifiers": "^6.0.1",
     "@dnd-kit/sortable": "^7.0.2",
-    "@frontify/fondue": "^12.0.0-beta.296",
+    "@frontify/fondue": "12.0.0-beta.296",
     "@react-aria/focus": "^3.13.0",
     "@react-stately/overlays": "^3.6.0",
     "@udecode/plate": "^21",

package/src/components/RichTextEditor/plugins/ButtonPlugin/createButtonPlugin.ts

@@ -3,7 +3,7 @@
 import { AppBridgeBlock } from '@frontify/app-bridge';
 import { Plugin, PluginProps } from '@frontify/fondue';
 import { RangeBeforeOptions, createPluginFactory } from '@udecode/plate';
-import { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
 import { isValidUrl } from '../LinkPlugin/utils/url';
 import { ButtonMarkupElement } from './ButtonMarkupElement';
 import { ButtonButton } from './components/ButtonButton';

package/src/components/RichTextEditor/plugins/LinkPlugin/FloatingLink/InsertLinkModal/InsertModal.tsx

@@ -15,7 +15,7 @@ import { FC, ReactNode } from 'react';
 import { LinkSelector } from '../../../shared/LinkSelector';
 import { InsertModalStateProps } from './types';
 
-type Props = {
+type InsertModalProps = {
     state: InsertModalStateProps;
     onTextChange: (value: string) => void;
     onUrlChange: (value: string) => void;
@@ -29,7 +29,7 @@ type Props = {
     appBridge: AppBridgeBlock;
 };
 
-export const InsertModal: FC<Props> = ({
+export const InsertModal: FC<InsertModalProps> = ({
     state,
     onTextChange,
     onUrlChange,

package/src/components/RichTextEditor/plugins/LinkPlugin/LinkMarkupElement/LinkMarkupElementNode.tsx

@@ -1,7 +1,7 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
 import { HTMLPropsAs, LinkRootProps, useElementProps } from '@udecode/plate';
-import { MouseEvent } from 'react';
+import type { MouseEvent } from 'react';
 import { TLinkElement } from '../types';
 import { BlockStyles } from '../../styles';
 import { LINK_PLUGIN } from '../id';

package/src/components/RichTextEditor/plugins/LinkPlugin/index.ts

@@ -1,14 +1,15 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
+import type { CSSProperties } from 'react';
 import { AppBridgeBlock } from '@frontify/app-bridge';
 import { Plugin, PluginProps } from '@frontify/fondue';
 import { createLinkPlugin as createPlateLinkPlugin, createPluginFactory } from '@udecode/plate';
+
 import { CustomFloatingLink } from './FloatingLink/CustomFloatingLink';
 import { LINK_PLUGIN } from './id';
 import { LinkButton } from './LinkButton';
 import { LinkMarkupElement } from './LinkMarkupElement';
 import { isValidUrl } from './utils/url';
-import { CSSProperties } from 'react';
 import { BlockStyles } from '../styles';
 
 export const createLinkPlugin = (appBridge: AppBridgeBlock) =>

package/src/components/RichTextEditor/plugins/TextStylePlugins/custom1Plugin.tsx

@@ -1,7 +1,7 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
 import { createPluginFactory } from '@udecode/plate';
-import { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
 import {
     MarkupElement,
     Plugin,

package/src/components/RichTextEditor/plugins/TextStylePlugins/custom2Plugin.tsx

@@ -1,7 +1,7 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
 import { createPluginFactory } from '@udecode/plate';
-import { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
 import {
     MarkupElement,
     Plugin,

package/src/components/RichTextEditor/plugins/TextStylePlugins/custom3Plugin.tsx

@@ -1,7 +1,7 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
 import { PlateRenderElementProps, createPluginFactory } from '@udecode/plate';
-import { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
 import {
     MarkupElement,
     Plugin,

package/src/components/RichTextEditor/plugins/TextStylePlugins/heading1Plugin.tsx

@@ -1,7 +1,7 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
 import { PlateRenderElementProps, createPluginFactory } from '@udecode/plate';
-import { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
 import {
     MarkupElement,
     Plugin,

package/src/components/RichTextEditor/plugins/TextStylePlugins/heading2Plugin.tsx

@@ -1,7 +1,7 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
 import { createPluginFactory } from '@udecode/plate';
-import { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
 import {
     MarkupElement,
     Plugin,

package/src/components/RichTextEditor/plugins/TextStylePlugins/heading3Plugin.tsx

@@ -1,7 +1,7 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
 import { createPluginFactory } from '@udecode/plate';
-import { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
 import {
     MarkupElement,
     Plugin,

package/src/components/RichTextEditor/plugins/TextStylePlugins/heading4Plugin.tsx

@@ -1,7 +1,7 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
 import { createPluginFactory } from '@udecode/plate';
-import { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
 import {
     MarkupElement,
     Plugin,

package/src/components/RichTextEditor/plugins/TextStylePlugins/imageCaptionPlugin.tsx

@@ -1,7 +1,7 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
 import { createPluginFactory } from '@udecode/plate';
-import { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
 import {
     MarkupElement,
     Plugin,

package/src/components/RichTextEditor/plugins/TextStylePlugins/imageTitlePlugin.tsx

@@ -1,7 +1,7 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
 import { createPluginFactory } from '@udecode/plate';
-import { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
 import {
     MarkupElement,
     Plugin,

package/src/components/RichTextEditor/plugins/TextStylePlugins/paragraphPlugin.tsx

@@ -1,7 +1,7 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
 import { createParagraphPlugin as createPlateParagraphPlugin, createPluginFactory } from '@udecode/plate';
-import { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
 import {
     MarkupElement,
     Plugin,

package/src/components/RichTextEditor/plugins/TextStylePlugins/quotePlugin.tsx

@@ -1,7 +1,7 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
 import { createPluginFactory } from '@udecode/plate';
-import { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
 import {
     MarkupElement,
     Plugin,

package/src/components/RichTextEditor/plugins/styles.ts

@@ -1,6 +1,6 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
-import { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
 import { LINK_PLUGIN } from './LinkPlugin/id';
 import { BlockButtonStyles } from './ButtonPlugin';
 

package/src/components/RichTextEditor/serializer/nodes/button.ts

@@ -1,8 +1,9 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
+import type { CSSProperties } from 'react';
 import { TElement } from '@udecode/plate';
+
 import { reactCssPropsToCss } from '../utlis/reactCssPropsToCss';
-import { CSSProperties } from 'react';
 import { BUTTON_PLUGIN } from '../../plugins';
 
 export type ButtonStylesType = Record<string, Record<string, CSSProperties & { hover?: CSSProperties }>>;

package/src/components/RichTextEditor/serializer/nodes/checkItemNode.ts

@@ -1,8 +1,9 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
+import type { CSSProperties } from 'react';
 import { merge } from '@frontify/fondue';
 import { TElement } from '@udecode/plate';
-import { CSSProperties } from 'react';
+
 import { reactCssPropsToCss } from '../utlis/reactCssPropsToCss';
 
 export const checkItemNode = (

package/src/components/RichTextEditor/serializer/nodes/default.ts

@@ -1,10 +1,11 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
+import type { CSSProperties } from 'react';
+import { merge } from '@frontify/fondue';
 import { TElement } from '@udecode/plate';
-import { CSSProperties } from 'react';
+
 import { TextStyles } from '../../plugins';
 import { reactCssPropsToCss } from '../utlis/reactCssPropsToCss';
-import { merge } from '@frontify/fondue';
 
 export const defaultNode = (node: TElement, children: string, styles: CSSProperties, defaultClassNames: string) => {
     const defaultStyles = reactCssPropsToCss(styles);

package/src/components/RichTextEditor/serializer/nodes/link.ts

@@ -1,11 +1,12 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
+import type { CSSProperties } from 'react';
+import escapeHtml from 'escape-html';
 import { TElement } from '@udecode/plate';
+
 import { LINK_PLUGIN } from '../../plugins/LinkPlugin/id';
 import { TLinkElement } from '../../plugins/LinkPlugin/types';
 import { reactCssPropsToCss } from '../utlis/reactCssPropsToCss';
-import escapeHtml from 'escape-html';
-import { CSSProperties } from 'react';
 
 export const linkNode = (
     node: TElement,

package/src/components/RichTextEditor/serializer/serializeNodesToHtmlRecursive.ts

@@ -25,7 +25,7 @@ import {
 } from '@udecode/plate';
 import { serializeLeafToHtml } from './utlis/serializeLeafToHtml';
 import { reactCssPropsToCss } from './utlis/reactCssPropsToCss';
-import { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
 import { ButtonStylesType, buttonNode } from './nodes/button';
 import { linkNode } from './nodes/link';
 import { defaultNode } from './nodes/default';

package/src/components/RichTextEditor/serializer/utlis/reactCssPropsToCss.ts

@@ -1,6 +1,6 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
-import { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
 
 export const reactCssPropsToCss = (props?: CSSProperties): string => {
     if (!props) {

package/src/utilities/react/getBackgroundColorStyles.ts

@@ -1,8 +1,7 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
-import { CSSProperties } from 'react';
-
-import { Color } from '@frontify/fondue';
+import type { CSSProperties } from 'react';
+import type { Color } from '@frontify/fondue';
 
 import { toRgbaString } from '../color';
 

package/src/utilities/react/getBorderStyles.ts

@@ -1,8 +1,7 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
-import { CSSProperties } from 'react';
-
-import { Color } from '@frontify/fondue';
+import type { CSSProperties } from 'react';
+import type { Color } from '@frontify/fondue';
 
 import { BorderStyle, borderStyleMap } from '../../settings/types';
 import { BORDER_COLOR_DEFAULT_VALUE } from '../../settings/defaultValues';

package/src/utilities/react/getRadiusStyles.ts

@@ -1,6 +1,6 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
-import { CSSProperties } from 'react';
+import type { CSSProperties } from 'react';
 import { Radius, radiusStyleMap } from '../../settings/types';
 
 export const getRadiusStyles = (radiusChoice: Radius, hasRadius = false, radiusValue?: number): CSSProperties => ({

package/vite.config.ts

@@ -1,6 +1,7 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
 import { defineConfig } from 'vitest/config';
+import react from '@vitejs/plugin-react';
 import { PreRenderedAsset } from 'rollup';
 import { dependencies as dependenciesMap, peerDependencies as peerDependenciesMap } from './package.json';
 import { resolve } from 'path';
@@ -12,6 +13,7 @@ const peerDependencies = Object.keys(peerDependenciesMap);
 export const globals = {
     react: 'React',
     'react-dom': 'ReactDOM',
+    'react-dom/client': 'ReactDOM',
 };
 
 const assetFileNames = (chunkInfo: PreRenderedAsset): string => {
@@ -22,7 +24,7 @@ const assetFileNames = (chunkInfo: PreRenderedAsset): string => {
 };
 
 export default defineConfig({
-    plugins: [dts({ insertTypesEntry: true, rollupTypes: true })],
+    plugins: [dts({ insertTypesEntry: true, rollupTypes: true }), react()],
     resolve: {
         mainFields: ['module', 'main'],
     },
@@ -41,7 +43,7 @@ export default defineConfig({
         sourcemap: true,
         minify: true,
         rollupOptions: {
-            external: [...dependencies, ...peerDependencies],
+            external: [...dependencies, ...peerDependencies, 'react-dom/client', 'react/jsx-runtime'],
             output: [
                 {
                     name: 'GuidelineBlocksSettings',

package/dist/_virtual/jsx-runtime.es.js

@@ -1,5 +0,0 @@
-var e = { exports: {} };
-export {
-  e as __module
-};
-//# sourceMappingURL=jsx-runtime.es.js.map

package/dist/_virtual/jsx-runtime.es.js.map

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

package/dist/_virtual/react-jsx-runtime.development.es.js

@@ -1,5 +0,0 @@
-var e = {};
-export {
-  e as __exports
-};
-//# sourceMappingURL=react-jsx-runtime.development.es.js.map

package/dist/_virtual/react-jsx-runtime.development.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"react-jsx-runtime.development.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/_virtual/react-jsx-runtime.production.min.es.js

@@ -1,5 +0,0 @@
-var r = {};
-export {
-  r as __exports
-};
-//# sourceMappingURL=react-jsx-runtime.production.min.es.js.map

package/dist/_virtual/react-jsx-runtime.production.min.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"react-jsx-runtime.production.min.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}