@makeswift/runtime 0.6.2 → 0.6.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Box.cjs.js +1 -1
- package/dist/Box.es.js +1 -1
- package/dist/Button.cjs.js +1 -1
- package/dist/Button.es.js +1 -1
- package/dist/Carousel.cjs.js +1 -1
- package/dist/Carousel.es.js +1 -1
- package/dist/Countdown.cjs.js +1 -1
- package/dist/Countdown.es.js +1 -1
- package/dist/Divider.cjs.js +1 -1
- package/dist/Divider.es.js +1 -1
- package/dist/EditableText.cjs.js +11 -2
- package/dist/EditableText.cjs.js.map +1 -1
- package/dist/EditableText.es.js +13 -4
- package/dist/EditableText.es.js.map +1 -1
- package/dist/Embed.cjs.js +1 -1
- package/dist/Embed.es.js +1 -1
- package/dist/Form.cjs.js +1 -1
- package/dist/Form.es.js +1 -1
- package/dist/Image.cjs.js +3 -6
- package/dist/Image.cjs.js.map +1 -1
- package/dist/Image.es.js +4 -7
- package/dist/Image.es.js.map +1 -1
- package/dist/LiveProvider.cjs.js +1 -1
- package/dist/LiveProvider.es.js +1 -1
- package/dist/Navigation.cjs.js +1 -1
- package/dist/Navigation.es.js +1 -1
- package/dist/PreviewProvider.cjs.js +2 -2
- package/dist/PreviewProvider.cjs.js.map +1 -1
- package/dist/PreviewProvider.es.js +2 -2
- package/dist/ReadOnlyText.cjs.js +2 -2
- package/dist/ReadOnlyText.es.js +2 -2
- package/dist/Root.cjs.js +1 -1
- package/dist/Root.es.js +1 -1
- package/dist/SocialLinks.cjs.js +1 -1
- package/dist/SocialLinks.es.js +1 -1
- package/dist/Text.cjs.js +1 -1
- package/dist/Text.es.js +1 -1
- package/dist/Video.cjs.js +1 -1
- package/dist/Video.es.js +1 -1
- package/dist/builder.cjs.js +1 -1
- package/dist/builder.es.js +1 -1
- package/dist/components.cjs.js +1 -1
- package/dist/components.es.js +1 -1
- package/dist/constants.cjs.js +20 -20
- package/dist/constants.cjs.js.map +1 -1
- package/dist/constants.es.js +2 -2
- package/dist/control-serialization.cjs.js +37 -37
- package/dist/control-serialization.cjs.js.map +1 -1
- package/dist/control-serialization.es.js +1 -1
- package/dist/control.cjs.js +22 -22
- package/dist/control.cjs.js.map +1 -1
- package/dist/control.es.js +1 -1
- package/dist/controls.cjs.js +21 -17
- package/dist/controls.cjs.js.map +1 -1
- package/dist/controls.es.js +1 -1
- package/dist/index.cjs.js +235 -209
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.cjs2.js +1 -1
- package/dist/index.cjs5.js +36 -139
- package/dist/index.cjs5.js.map +1 -1
- package/dist/index.cjs6.js +141 -0
- package/dist/index.cjs6.js.map +1 -0
- package/dist/index.es.js +48 -25
- package/dist/index.es.js.map +1 -1
- package/dist/index.es2.js +1 -1
- package/dist/index.es5.js +34 -138
- package/dist/index.es5.js.map +1 -1
- package/dist/index.es6.js +139 -0
- package/dist/index.es6.js.map +1 -0
- package/dist/main.cjs.js +1 -1
- package/dist/main.es.js +1 -1
- package/dist/next.cjs.js +1 -1
- package/dist/next.es.js +2 -2
- package/dist/prop-controllers.cjs.js +4 -4
- package/dist/prop-controllers.es.js +1 -1
- package/dist/react.cjs.js +1 -1
- package/dist/react.es.js +1 -1
- package/dist/{slot.cjs.js → rich-text.cjs.js} +84 -8
- package/dist/rich-text.cjs.js.map +1 -0
- package/dist/{slot.es.js → rich-text.es.js} +80 -8
- package/dist/rich-text.es.js.map +1 -0
- package/dist/types/src/components/builtin/Image/Image.d.ts.map +1 -1
- package/dist/types/src/components/builtin/Text/EditableText.d.ts.map +1 -1
- package/dist/types/src/controls/index.d.ts +1 -0
- package/dist/types/src/controls/index.d.ts.map +1 -1
- package/dist/types/src/controls/rich-text.d.ts +66 -0
- package/dist/types/src/controls/rich-text.d.ts.map +1 -0
- package/dist/types/src/controls/style.d.ts +16 -4
- package/dist/types/src/controls/style.d.ts.map +1 -1
- package/dist/types/src/prop-controllers/descriptors.d.ts +4 -2
- package/dist/types/src/prop-controllers/descriptors.d.ts.map +1 -1
- package/dist/types/src/prop-controllers/instances.d.ts +13 -3
- package/dist/types/src/prop-controllers/instances.d.ts.map +1 -1
- package/dist/types/src/runtimes/react/controls/rich-text.d.ts +8 -0
- package/dist/types/src/runtimes/react/controls/rich-text.d.ts.map +1 -0
- package/dist/types/src/runtimes/react/controls/slot.d.ts.map +1 -1
- package/dist/types/src/runtimes/react/controls.d.ts.map +1 -1
- package/dist/types/src/runtimes/react/poll-box-model.d.ts +6 -0
- package/dist/types/src/runtimes/react/poll-box-model.d.ts.map +1 -0
- package/package.json +1 -1
- package/dist/slot.cjs.js.map +0 -1
- package/dist/slot.es.js.map +0 -1
package/dist/index.cjs2.js
CHANGED
|
@@ -33,7 +33,7 @@ var __objRest = (source, exclude) => {
|
|
|
33
33
|
var React = require("react");
|
|
34
34
|
var next = require("./index.cjs.js");
|
|
35
35
|
require("use-sync-external-store/shim");
|
|
36
|
-
require("./
|
|
36
|
+
require("./rich-text.cjs.js");
|
|
37
37
|
var css = require("@emotion/css");
|
|
38
38
|
var jsxRuntime = require("react/jsx-runtime");
|
|
39
39
|
var constants = require("./constants.cjs.js");
|
package/dist/index.cjs5.js
CHANGED
|
@@ -1,141 +1,38 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
|
|
3
|
-
var
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
const getDeviceId = ({ deviceId }) => deviceId;
|
|
39
|
-
const withColor = (swatches) => (_a) => {
|
|
40
|
-
var _b = _a, {
|
|
41
|
-
value: _c
|
|
42
|
-
} = _b, _d = _c, { color } = _d, restOfValue = __objRest(_d, ["color"]), rest = __objRest(_b, [
|
|
43
|
-
"value"
|
|
44
|
-
]);
|
|
45
|
-
return __spreadProps(__spreadValues({}, rest), {
|
|
46
|
-
value: __spreadValues(__spreadValues({}, restOfValue), color ? {
|
|
47
|
-
color: {
|
|
48
|
-
swatch: swatches.find((s) => s && s.id === color.swatchId),
|
|
49
|
-
alpha: color.alpha
|
|
50
|
-
}
|
|
51
|
-
} : {})
|
|
52
|
-
});
|
|
53
|
-
};
|
|
54
|
-
const overrideTypographyStyle = (source, override) => {
|
|
55
|
-
const devices = [...new Set(source.map(getDeviceId).concat(override.map(getDeviceId)))];
|
|
56
|
-
return devices.map((deviceId) => ({
|
|
57
|
-
deviceId,
|
|
58
|
-
value: __spreadValues(__spreadValues({}, (next.findDeviceOverride(source, deviceId) || { value: {} }).value), (next.findDeviceOverride(override, deviceId, (v) => v) || { value: {} }).value)
|
|
59
|
-
}));
|
|
60
|
-
};
|
|
61
|
-
function useTypographyMark(value) {
|
|
62
|
-
var _a, _b, _c;
|
|
63
|
-
const typography = next.useTypography((_a = value == null ? void 0 : value.id) != null ? _a : null);
|
|
64
|
-
const swatchIds = [
|
|
65
|
-
...constants.getTypographyStyleSwatchIds(value == null ? void 0 : value.style),
|
|
66
|
-
...constants.getTypographyStyleSwatchIds(typography == null ? void 0 : typography.style)
|
|
67
|
-
];
|
|
68
|
-
const swatches = next.useSwatches(swatchIds);
|
|
69
|
-
return overrideTypographyStyle((_b = typography == null ? void 0 : typography.style.map(withColor(swatches.filter(constants.isNonNullable)))) != null ? _b : [], (_c = value == null ? void 0 : value.style.map(withColor(swatches.filter(constants.isNonNullable)))) != null ? _c : []);
|
|
70
|
-
}
|
|
71
|
-
function Mark(_a) {
|
|
72
|
-
var _b = _a, {
|
|
73
|
-
value,
|
|
74
|
-
className
|
|
75
|
-
} = _b, restOfProps = __objRest(_b, [
|
|
76
|
-
"value",
|
|
77
|
-
"className"
|
|
78
|
-
]);
|
|
79
|
-
const typographyStyle = useTypographyMark(value);
|
|
80
|
-
const typographyClassName = next.useStyle(next.responsiveStyle([typographyStyle], ([{
|
|
81
|
-
color,
|
|
82
|
-
fontFamily,
|
|
83
|
-
fontSize,
|
|
84
|
-
fontWeight,
|
|
85
|
-
lineHeight,
|
|
86
|
-
letterSpacing,
|
|
87
|
-
uppercase,
|
|
88
|
-
underline,
|
|
89
|
-
strikethrough,
|
|
90
|
-
italic
|
|
91
|
-
} = {}]) => __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, color == null ? {} : {
|
|
92
|
-
color: next.colorToString(color)
|
|
93
|
-
}), fontFamily == null ? {} : {
|
|
94
|
-
fontFamily
|
|
95
|
-
}), fontSize == null || fontSize.value == null || fontSize.unit == null ? {} : {
|
|
96
|
-
fontSize: `${fontSize.value}${fontSize.unit}`
|
|
97
|
-
}), fontWeight == null ? {} : {
|
|
98
|
-
fontWeight
|
|
99
|
-
}), lineHeight == null ? {} : {
|
|
100
|
-
lineHeight
|
|
101
|
-
}), letterSpacing == null ? {} : {
|
|
102
|
-
letterSpacing: `${letterSpacing / 10}em`
|
|
103
|
-
}), uppercase == null ? {} : {
|
|
104
|
-
textTransform: uppercase === true ? "uppercase" : "initial"
|
|
105
|
-
}), underline == null && strikethrough == null ? {} : {
|
|
106
|
-
textDecoration: [Boolean(underline) && "underline", Boolean(strikethrough) && "line-through"].filter(Boolean).join(" ")
|
|
107
|
-
}), italic == null ? {} : {
|
|
108
|
-
fontStyle: italic === true ? "italic" : "initial"
|
|
109
|
-
}), next.shallowMergeFallbacks));
|
|
110
|
-
return /* @__PURE__ */ jsxRuntime.jsx("span", __spreadProps(__spreadValues({}, restOfProps), {
|
|
111
|
-
className: css.cx(typographyClassName, className)
|
|
112
|
-
}));
|
|
113
|
-
}
|
|
114
|
-
var DeviceOverrideBlock = React.forwardRef(function Block(_c, ref) {
|
|
115
|
-
var _d = _c, {
|
|
116
|
-
textAlign,
|
|
117
|
-
className,
|
|
118
|
-
as
|
|
119
|
-
} = _d, restOfProps = __objRest(_d, [
|
|
120
|
-
"textAlign",
|
|
121
|
-
"className",
|
|
122
|
-
"as"
|
|
123
|
-
]);
|
|
124
|
-
const Component = as != null ? as : "div";
|
|
125
|
-
return /* @__PURE__ */ jsxRuntime.jsx(Component, __spreadProps(__spreadValues({}, restOfProps), {
|
|
126
|
-
ref,
|
|
127
|
-
className: css.cx(next.useStyle({
|
|
128
|
-
margin: 0
|
|
129
|
-
}), next.useStyle(next.responsiveStyle([textAlign], ([textAlign2 = "left"]) => ({
|
|
130
|
-
textAlign: textAlign2
|
|
131
|
-
}))), next.useStyle(as === "blockquote" ? {
|
|
132
|
-
padding: "0.5em 10px",
|
|
133
|
-
fontSize: "1.25em",
|
|
134
|
-
fontWeight: "300",
|
|
135
|
-
borderLeft: "5px solid rgba(0, 0, 0, 0.1)"
|
|
136
|
-
} : {}), className)
|
|
137
|
-
}));
|
|
138
|
-
});
|
|
139
|
-
exports.DeviceOverrideBlock = DeviceOverrideBlock;
|
|
140
|
-
exports.Mark = Mark;
|
|
2
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
3
|
+
var Text = require("./Text.cjs.js");
|
|
4
|
+
require("next/dynamic");
|
|
5
|
+
require("react");
|
|
6
|
+
require("./index.cjs.js");
|
|
7
|
+
require("use-sync-external-store/shim/with-selector");
|
|
8
|
+
require("./constants.cjs.js");
|
|
9
|
+
require("redux");
|
|
10
|
+
require("redux-thunk");
|
|
11
|
+
require("./actions.cjs.js");
|
|
12
|
+
require("./rich-text.cjs.js");
|
|
13
|
+
require("./control.cjs.js");
|
|
14
|
+
require("@emotion/css");
|
|
15
|
+
require("@emotion/serialize");
|
|
16
|
+
require("@emotion/utils");
|
|
17
|
+
require("react/jsx-runtime");
|
|
18
|
+
require("./text-input.cjs.js");
|
|
19
|
+
require("./combobox.cjs.js");
|
|
20
|
+
require("use-sync-external-store/shim");
|
|
21
|
+
require("./types.cjs.js");
|
|
22
|
+
require("color");
|
|
23
|
+
require("scroll-into-view-if-needed");
|
|
24
|
+
require("./box-models.cjs.js");
|
|
25
|
+
require("css-box-model");
|
|
26
|
+
require("react-dom");
|
|
27
|
+
require("html-react-parser");
|
|
28
|
+
require("next/head");
|
|
29
|
+
require("@emotion/server/create-instance");
|
|
30
|
+
require("next/document");
|
|
31
|
+
require("cookie");
|
|
32
|
+
require("cors");
|
|
33
|
+
require("http-proxy");
|
|
34
|
+
require("set-cookie-parser");
|
|
35
|
+
require("uuid/v4");
|
|
36
|
+
require("corporate-ipsum");
|
|
37
|
+
exports["default"] = Text["default"];
|
|
141
38
|
//# sourceMappingURL=index.cjs5.js.map
|
package/dist/index.cjs5.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs5.js","sources":["../src/components/builtin/Text/components/RichTextEditor/components/Mark/hooks/useTypographyMark.ts","../src/components/builtin/Text/components/RichTextEditor/components/Mark/index.tsx","../src/components/builtin/Text/components/RichTextEditor/components/Block/index.tsx"],"sourcesContent":["import { Length as LengthValue } from '../../../../../../../../prop-controllers'\nimport { ColorValue as Color } from '../../../../../../../utils/types'\nimport { findDeviceOverride } from '../../../../../../../utils/devices'\nimport type { DeviceOverride } from '../../../../../../../../prop-controllers'\nimport {\n useSwatches,\n useTypography,\n} from '../../../../../../../../runtimes/react/hooks/makeswift-api'\nimport { Swatch, Typography } from '../../../../../../../../api'\nimport { getTypographyStyleSwatchIds } from '../../../../../../../../prop-controllers/introspection'\nimport { isNonNullable } from '../../../../../../../utils/isNonNullable'\n\nexport type TypographyMarkDataValue = {\n fontWeight?: number\n fontSize?: LengthValue\n fontFamily?: string\n color?: Color\n textAlign?: string\n lineHeight?: number\n letterSpacing?: number\n uppercase?: boolean\n italic?: boolean\n underline?: boolean\n strikethrough?: boolean\n}\n\nexport type TypographyMarkValue = {\n id: string | null | undefined\n style: Typography['style']\n}\n\nexport type TypographyMarkData = Array<DeviceOverride<TypographyMarkDataValue>>\n\nconst getDeviceId = ({ deviceId }: DeviceOverride<unknown>) => deviceId\n\nconst withColor =\n (swatches: Swatch[]) =>\n ({\n value: { color, ...restOfValue },\n ...rest\n }: Typography['style'][number]): DeviceOverride<TypographyMarkDataValue> =>\n ({\n ...rest,\n value: {\n ...restOfValue,\n ...(color\n ? {\n color: {\n swatch: swatches.find(s => s && s.id === color.swatchId),\n alpha: color.alpha,\n },\n }\n : {}),\n } as TypographyMarkDataValue,\n } as DeviceOverride<TypographyMarkDataValue>)\n\nexport const overrideTypographyStyle = <A>(\n source: Array<DeviceOverride<A>>,\n override: Array<DeviceOverride<A>>,\n): Array<DeviceOverride<A>> => {\n const devices = [...new Set(source.map(getDeviceId).concat(override.map(getDeviceId)))]\n\n return devices.map(deviceId => ({\n deviceId,\n value: {\n ...(findDeviceOverride(source, deviceId) || { value: {} }).value,\n ...(findDeviceOverride(override, deviceId, v => v) || { value: {} }).value,\n },\n })) as DeviceOverride<A>[]\n}\n\nexport default function useTypographyMark(\n value: TypographyMarkValue | null | undefined,\n): TypographyMarkData | null | undefined {\n const typography = useTypography(value?.id ?? null)\n const swatchIds = [\n ...getTypographyStyleSwatchIds(value?.style),\n ...getTypographyStyleSwatchIds(typography?.style),\n ]\n const swatches = useSwatches(swatchIds)\n\n return overrideTypographyStyle(\n typography?.style.map(withColor(swatches.filter(isNonNullable))) ?? [],\n value?.style.map(withColor(swatches.filter(isNonNullable))) ?? [],\n )\n}\n","import { ComponentPropsWithoutRef } from 'react'\n\nimport useTypographyMark, {\n TypographyMarkValue,\n overrideTypographyStyle,\n TypographyMarkDataValue,\n} from './hooks/useTypographyMark'\nimport { colorToString } from '../../../../../../utils/colorToString'\nimport { shallowMergeFallbacks } from '../../../../../../utils/devices'\nimport { cx } from '@emotion/css'\nimport { useStyle } from '../../../../../../../runtimes/react/use-style'\nimport { responsiveStyle } from '../../../../../../utils/responsive-style'\nimport { ResponsiveValue } from '../../../../../../../prop-controllers/descriptors'\n\nexport type { TypographyMarkValue }\nexport { overrideTypographyStyle }\n\ntype BaseProps = { value: TypographyMarkValue }\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'span'>, keyof BaseProps>\n\nexport default function Mark({ value, className, ...restOfProps }: Props): JSX.Element {\n const typographyStyle = useTypographyMark(value)\n const typographyClassName = useStyle(\n responsiveStyle<\n TypographyMarkDataValue,\n [ResponsiveValue<TypographyMarkDataValue> | null | undefined]\n >(\n [typographyStyle],\n ([\n {\n color,\n fontFamily,\n fontSize,\n fontWeight,\n lineHeight,\n letterSpacing,\n uppercase,\n underline,\n strikethrough,\n italic,\n } = {} as TypographyMarkDataValue,\n ]) => ({\n ...(color == null ? {} : { color: colorToString(color) }),\n ...(fontFamily == null ? {} : { fontFamily }),\n ...(fontSize == null || fontSize.value == null || fontSize.unit == null\n ? {}\n : { fontSize: `${fontSize.value}${fontSize.unit}` }),\n ...(fontWeight == null ? {} : { fontWeight }),\n ...(lineHeight == null ? {} : { lineHeight }),\n ...(letterSpacing == null ? {} : { letterSpacing: `${letterSpacing / 10}em` }),\n ...(uppercase == null\n ? {}\n : { textTransform: uppercase === true ? 'uppercase' : 'initial' }),\n ...(underline == null && strikethrough == null\n ? {}\n : {\n textDecoration: [\n Boolean(underline) && 'underline',\n Boolean(strikethrough) && 'line-through',\n ]\n .filter(Boolean)\n .join(' '),\n }),\n ...(italic == null ? {} : { fontStyle: italic === true ? 'italic' : 'initial' }),\n }),\n shallowMergeFallbacks,\n ),\n )\n\n return <span {...restOfProps} className={cx(typographyClassName, className)} />\n}\n","import { cx } from '@emotion/css'\nimport { forwardRef, ComponentPropsWithoutRef, ForwardedRef, ElementRef, ElementType } from 'react'\n\nimport type { ResponsiveValue } from '../../../../../../../prop-controllers'\nimport { useStyle } from '../../../../../../../runtimes/react/use-style'\nimport { responsiveStyle } from '../../../../../../utils/responsive-style'\n\ntype BaseProps<T extends ElementType> = {\n as?: T\n textAlign?: ResponsiveValue<'left' | 'center' | 'right' | 'justify'>\n}\n\ntype Props<T extends ElementType> = BaseProps<T> &\n Omit<ComponentPropsWithoutRef<T>, keyof BaseProps<T>>\n\nexport default forwardRef(function Block<T extends ElementType>(\n { textAlign, className, as, ...restOfProps }: Props<T>,\n ref: ForwardedRef<ElementRef<T>>,\n) {\n const Component = as ?? 'div'\n\n return (\n // @ts-ignore: `ref` types don't match.\n <Component\n {...restOfProps}\n ref={ref}\n className={cx(\n useStyle({ margin: 0 }),\n useStyle(responsiveStyle([textAlign], ([textAlign = 'left']) => ({ textAlign }))),\n useStyle(\n as === 'blockquote'\n ? {\n padding: '0.5em 10px',\n fontSize: '1.25em',\n fontWeight: '300',\n borderLeft: '5px solid rgba(0, 0, 0, 0.1)',\n }\n : {},\n ),\n className,\n )}\n />\n )\n})\n"],"names":["findDeviceOverride","useTypography","getTypographyStyleSwatchIds","useSwatches","isNonNullable","value","className","restOfProps","typographyStyle","useTypographyMark","typographyClassName","useStyle","responsiveStyle","color","fontFamily","fontSize","fontWeight","lineHeight","letterSpacing","uppercase","underline","strikethrough","italic","colorToString","unit","textTransform","textDecoration","Boolean","filter","join","fontStyle","shallowMergeFallbacks","cx","forwardRef","ref","textAlign","as","Component","margin","padding","borderLeft"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.cjs5.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -0,0 +1,141 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defProps = Object.defineProperties;
|
|
4
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
5
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
8
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
9
|
+
var __spreadValues = (a, b) => {
|
|
10
|
+
for (var prop in b || (b = {}))
|
|
11
|
+
if (__hasOwnProp.call(b, prop))
|
|
12
|
+
__defNormalProp(a, prop, b[prop]);
|
|
13
|
+
if (__getOwnPropSymbols)
|
|
14
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
15
|
+
if (__propIsEnum.call(b, prop))
|
|
16
|
+
__defNormalProp(a, prop, b[prop]);
|
|
17
|
+
}
|
|
18
|
+
return a;
|
|
19
|
+
};
|
|
20
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
21
|
+
var __objRest = (source, exclude) => {
|
|
22
|
+
var target = {};
|
|
23
|
+
for (var prop in source)
|
|
24
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
25
|
+
target[prop] = source[prop];
|
|
26
|
+
if (source != null && __getOwnPropSymbols)
|
|
27
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
28
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
29
|
+
target[prop] = source[prop];
|
|
30
|
+
}
|
|
31
|
+
return target;
|
|
32
|
+
};
|
|
33
|
+
var next = require("./index.cjs.js");
|
|
34
|
+
var constants = require("./constants.cjs.js");
|
|
35
|
+
var css = require("@emotion/css");
|
|
36
|
+
var jsxRuntime = require("react/jsx-runtime");
|
|
37
|
+
var React = require("react");
|
|
38
|
+
const getDeviceId = ({ deviceId }) => deviceId;
|
|
39
|
+
const withColor = (swatches) => (_a) => {
|
|
40
|
+
var _b = _a, {
|
|
41
|
+
value: _c
|
|
42
|
+
} = _b, _d = _c, { color } = _d, restOfValue = __objRest(_d, ["color"]), rest = __objRest(_b, [
|
|
43
|
+
"value"
|
|
44
|
+
]);
|
|
45
|
+
return __spreadProps(__spreadValues({}, rest), {
|
|
46
|
+
value: __spreadValues(__spreadValues({}, restOfValue), color ? {
|
|
47
|
+
color: {
|
|
48
|
+
swatch: swatches.find((s) => s && s.id === color.swatchId),
|
|
49
|
+
alpha: color.alpha
|
|
50
|
+
}
|
|
51
|
+
} : {})
|
|
52
|
+
});
|
|
53
|
+
};
|
|
54
|
+
const overrideTypographyStyle = (source, override) => {
|
|
55
|
+
const devices = [...new Set(source.map(getDeviceId).concat(override.map(getDeviceId)))];
|
|
56
|
+
return devices.map((deviceId) => ({
|
|
57
|
+
deviceId,
|
|
58
|
+
value: __spreadValues(__spreadValues({}, (next.findDeviceOverride(source, deviceId) || { value: {} }).value), (next.findDeviceOverride(override, deviceId, (v) => v) || { value: {} }).value)
|
|
59
|
+
}));
|
|
60
|
+
};
|
|
61
|
+
function useTypographyMark(value) {
|
|
62
|
+
var _a, _b, _c;
|
|
63
|
+
const typography = next.useTypography((_a = value == null ? void 0 : value.id) != null ? _a : null);
|
|
64
|
+
const swatchIds = [
|
|
65
|
+
...constants.getTypographyStyleSwatchIds(value == null ? void 0 : value.style),
|
|
66
|
+
...constants.getTypographyStyleSwatchIds(typography == null ? void 0 : typography.style)
|
|
67
|
+
];
|
|
68
|
+
const swatches = next.useSwatches(swatchIds);
|
|
69
|
+
return overrideTypographyStyle((_b = typography == null ? void 0 : typography.style.map(withColor(swatches.filter(constants.isNonNullable)))) != null ? _b : [], (_c = value == null ? void 0 : value.style.map(withColor(swatches.filter(constants.isNonNullable)))) != null ? _c : []);
|
|
70
|
+
}
|
|
71
|
+
function Mark(_a) {
|
|
72
|
+
var _b = _a, {
|
|
73
|
+
value,
|
|
74
|
+
className
|
|
75
|
+
} = _b, restOfProps = __objRest(_b, [
|
|
76
|
+
"value",
|
|
77
|
+
"className"
|
|
78
|
+
]);
|
|
79
|
+
const typographyStyle = useTypographyMark(value);
|
|
80
|
+
const typographyClassName = next.useStyle(next.responsiveStyle([typographyStyle], ([{
|
|
81
|
+
color,
|
|
82
|
+
fontFamily,
|
|
83
|
+
fontSize,
|
|
84
|
+
fontWeight,
|
|
85
|
+
lineHeight,
|
|
86
|
+
letterSpacing,
|
|
87
|
+
uppercase,
|
|
88
|
+
underline,
|
|
89
|
+
strikethrough,
|
|
90
|
+
italic
|
|
91
|
+
} = {}]) => __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, color == null ? {} : {
|
|
92
|
+
color: next.colorToString(color)
|
|
93
|
+
}), fontFamily == null ? {} : {
|
|
94
|
+
fontFamily
|
|
95
|
+
}), fontSize == null || fontSize.value == null || fontSize.unit == null ? {} : {
|
|
96
|
+
fontSize: `${fontSize.value}${fontSize.unit}`
|
|
97
|
+
}), fontWeight == null ? {} : {
|
|
98
|
+
fontWeight
|
|
99
|
+
}), lineHeight == null ? {} : {
|
|
100
|
+
lineHeight
|
|
101
|
+
}), letterSpacing == null ? {} : {
|
|
102
|
+
letterSpacing: `${letterSpacing / 10}em`
|
|
103
|
+
}), uppercase == null ? {} : {
|
|
104
|
+
textTransform: uppercase === true ? "uppercase" : "initial"
|
|
105
|
+
}), underline == null && strikethrough == null ? {} : {
|
|
106
|
+
textDecoration: [Boolean(underline) && "underline", Boolean(strikethrough) && "line-through"].filter(Boolean).join(" ")
|
|
107
|
+
}), italic == null ? {} : {
|
|
108
|
+
fontStyle: italic === true ? "italic" : "initial"
|
|
109
|
+
}), next.shallowMergeFallbacks));
|
|
110
|
+
return /* @__PURE__ */ jsxRuntime.jsx("span", __spreadProps(__spreadValues({}, restOfProps), {
|
|
111
|
+
className: css.cx(typographyClassName, className)
|
|
112
|
+
}));
|
|
113
|
+
}
|
|
114
|
+
var DeviceOverrideBlock = React.forwardRef(function Block(_c, ref) {
|
|
115
|
+
var _d = _c, {
|
|
116
|
+
textAlign,
|
|
117
|
+
className,
|
|
118
|
+
as
|
|
119
|
+
} = _d, restOfProps = __objRest(_d, [
|
|
120
|
+
"textAlign",
|
|
121
|
+
"className",
|
|
122
|
+
"as"
|
|
123
|
+
]);
|
|
124
|
+
const Component = as != null ? as : "div";
|
|
125
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Component, __spreadProps(__spreadValues({}, restOfProps), {
|
|
126
|
+
ref,
|
|
127
|
+
className: css.cx(next.useStyle({
|
|
128
|
+
margin: 0
|
|
129
|
+
}), next.useStyle(next.responsiveStyle([textAlign], ([textAlign2 = "left"]) => ({
|
|
130
|
+
textAlign: textAlign2
|
|
131
|
+
}))), next.useStyle(as === "blockquote" ? {
|
|
132
|
+
padding: "0.5em 10px",
|
|
133
|
+
fontSize: "1.25em",
|
|
134
|
+
fontWeight: "300",
|
|
135
|
+
borderLeft: "5px solid rgba(0, 0, 0, 0.1)"
|
|
136
|
+
} : {}), className)
|
|
137
|
+
}));
|
|
138
|
+
});
|
|
139
|
+
exports.DeviceOverrideBlock = DeviceOverrideBlock;
|
|
140
|
+
exports.Mark = Mark;
|
|
141
|
+
//# sourceMappingURL=index.cjs6.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.cjs6.js","sources":["../src/components/builtin/Text/components/RichTextEditor/components/Mark/hooks/useTypographyMark.ts","../src/components/builtin/Text/components/RichTextEditor/components/Mark/index.tsx","../src/components/builtin/Text/components/RichTextEditor/components/Block/index.tsx"],"sourcesContent":["import { Length as LengthValue } from '../../../../../../../../prop-controllers'\nimport { ColorValue as Color } from '../../../../../../../utils/types'\nimport { findDeviceOverride } from '../../../../../../../utils/devices'\nimport type { DeviceOverride } from '../../../../../../../../prop-controllers'\nimport {\n useSwatches,\n useTypography,\n} from '../../../../../../../../runtimes/react/hooks/makeswift-api'\nimport { Swatch, Typography } from '../../../../../../../../api'\nimport { getTypographyStyleSwatchIds } from '../../../../../../../../prop-controllers/introspection'\nimport { isNonNullable } from '../../../../../../../utils/isNonNullable'\n\nexport type TypographyMarkDataValue = {\n fontWeight?: number\n fontSize?: LengthValue\n fontFamily?: string\n color?: Color\n textAlign?: string\n lineHeight?: number\n letterSpacing?: number\n uppercase?: boolean\n italic?: boolean\n underline?: boolean\n strikethrough?: boolean\n}\n\nexport type TypographyMarkValue = {\n id: string | null | undefined\n style: Typography['style']\n}\n\nexport type TypographyMarkData = Array<DeviceOverride<TypographyMarkDataValue>>\n\nconst getDeviceId = ({ deviceId }: DeviceOverride<unknown>) => deviceId\n\nconst withColor =\n (swatches: Swatch[]) =>\n ({\n value: { color, ...restOfValue },\n ...rest\n }: Typography['style'][number]): DeviceOverride<TypographyMarkDataValue> =>\n ({\n ...rest,\n value: {\n ...restOfValue,\n ...(color\n ? {\n color: {\n swatch: swatches.find(s => s && s.id === color.swatchId),\n alpha: color.alpha,\n },\n }\n : {}),\n } as TypographyMarkDataValue,\n } as DeviceOverride<TypographyMarkDataValue>)\n\nexport const overrideTypographyStyle = <A>(\n source: Array<DeviceOverride<A>>,\n override: Array<DeviceOverride<A>>,\n): Array<DeviceOverride<A>> => {\n const devices = [...new Set(source.map(getDeviceId).concat(override.map(getDeviceId)))]\n\n return devices.map(deviceId => ({\n deviceId,\n value: {\n ...(findDeviceOverride(source, deviceId) || { value: {} }).value,\n ...(findDeviceOverride(override, deviceId, v => v) || { value: {} }).value,\n },\n })) as DeviceOverride<A>[]\n}\n\nexport default function useTypographyMark(\n value: TypographyMarkValue | null | undefined,\n): TypographyMarkData | null | undefined {\n const typography = useTypography(value?.id ?? null)\n const swatchIds = [\n ...getTypographyStyleSwatchIds(value?.style),\n ...getTypographyStyleSwatchIds(typography?.style),\n ]\n const swatches = useSwatches(swatchIds)\n\n return overrideTypographyStyle(\n typography?.style.map(withColor(swatches.filter(isNonNullable))) ?? [],\n value?.style.map(withColor(swatches.filter(isNonNullable))) ?? [],\n )\n}\n","import { ComponentPropsWithoutRef } from 'react'\n\nimport useTypographyMark, {\n TypographyMarkValue,\n overrideTypographyStyle,\n TypographyMarkDataValue,\n} from './hooks/useTypographyMark'\nimport { colorToString } from '../../../../../../utils/colorToString'\nimport { shallowMergeFallbacks } from '../../../../../../utils/devices'\nimport { cx } from '@emotion/css'\nimport { useStyle } from '../../../../../../../runtimes/react/use-style'\nimport { responsiveStyle } from '../../../../../../utils/responsive-style'\nimport { ResponsiveValue } from '../../../../../../../prop-controllers/descriptors'\n\nexport type { TypographyMarkValue }\nexport { overrideTypographyStyle }\n\ntype BaseProps = { value: TypographyMarkValue }\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'span'>, keyof BaseProps>\n\nexport default function Mark({ value, className, ...restOfProps }: Props): JSX.Element {\n const typographyStyle = useTypographyMark(value)\n const typographyClassName = useStyle(\n responsiveStyle<\n TypographyMarkDataValue,\n [ResponsiveValue<TypographyMarkDataValue> | null | undefined]\n >(\n [typographyStyle],\n ([\n {\n color,\n fontFamily,\n fontSize,\n fontWeight,\n lineHeight,\n letterSpacing,\n uppercase,\n underline,\n strikethrough,\n italic,\n } = {} as TypographyMarkDataValue,\n ]) => ({\n ...(color == null ? {} : { color: colorToString(color) }),\n ...(fontFamily == null ? {} : { fontFamily }),\n ...(fontSize == null || fontSize.value == null || fontSize.unit == null\n ? {}\n : { fontSize: `${fontSize.value}${fontSize.unit}` }),\n ...(fontWeight == null ? {} : { fontWeight }),\n ...(lineHeight == null ? {} : { lineHeight }),\n ...(letterSpacing == null ? {} : { letterSpacing: `${letterSpacing / 10}em` }),\n ...(uppercase == null\n ? {}\n : { textTransform: uppercase === true ? 'uppercase' : 'initial' }),\n ...(underline == null && strikethrough == null\n ? {}\n : {\n textDecoration: [\n Boolean(underline) && 'underline',\n Boolean(strikethrough) && 'line-through',\n ]\n .filter(Boolean)\n .join(' '),\n }),\n ...(italic == null ? {} : { fontStyle: italic === true ? 'italic' : 'initial' }),\n }),\n shallowMergeFallbacks,\n ),\n )\n\n return <span {...restOfProps} className={cx(typographyClassName, className)} />\n}\n","import { cx } from '@emotion/css'\nimport { forwardRef, ComponentPropsWithoutRef, ForwardedRef, ElementRef, ElementType } from 'react'\n\nimport type { ResponsiveValue } from '../../../../../../../prop-controllers'\nimport { useStyle } from '../../../../../../../runtimes/react/use-style'\nimport { responsiveStyle } from '../../../../../../utils/responsive-style'\n\ntype BaseProps<T extends ElementType> = {\n as?: T\n textAlign?: ResponsiveValue<'left' | 'center' | 'right' | 'justify'>\n}\n\ntype Props<T extends ElementType> = BaseProps<T> &\n Omit<ComponentPropsWithoutRef<T>, keyof BaseProps<T>>\n\nexport default forwardRef(function Block<T extends ElementType>(\n { textAlign, className, as, ...restOfProps }: Props<T>,\n ref: ForwardedRef<ElementRef<T>>,\n) {\n const Component = as ?? 'div'\n\n return (\n // @ts-ignore: `ref` types don't match.\n <Component\n {...restOfProps}\n ref={ref}\n className={cx(\n useStyle({ margin: 0 }),\n useStyle(responsiveStyle([textAlign], ([textAlign = 'left']) => ({ textAlign }))),\n useStyle(\n as === 'blockquote'\n ? {\n padding: '0.5em 10px',\n fontSize: '1.25em',\n fontWeight: '300',\n borderLeft: '5px solid rgba(0, 0, 0, 0.1)',\n }\n : {},\n ),\n className,\n )}\n />\n )\n})\n"],"names":["findDeviceOverride","useTypography","getTypographyStyleSwatchIds","useSwatches","isNonNullable","value","className","restOfProps","typographyStyle","useTypographyMark","typographyClassName","useStyle","responsiveStyle","color","fontFamily","fontSize","fontWeight","lineHeight","letterSpacing","uppercase","underline","strikethrough","italic","colorToString","unit","textTransform","textDecoration","Boolean","filter","join","fontStyle","shallowMergeFallbacks","cx","forwardRef","ref","textAlign","as","Component","margin","padding","borderLeft"],"mappings":"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"}
|
package/dist/index.es.js
CHANGED
|
@@ -39,13 +39,13 @@ import * as React from "react";
|
|
|
39
39
|
import { useEffect, createContext, useContext, useState, useMemo, useRef, Children, createElement, forwardRef, memo, useCallback, useImperativeHandle, Component, Suspense } from "react";
|
|
40
40
|
import { useSyncExternalStoreWithSelector } from "use-sync-external-store/shim/with-selector";
|
|
41
41
|
import dynamic from "next/dynamic";
|
|
42
|
-
import { g as getPropControllerDescriptors, i as isElementReference, a as getElementSwatchIds, b as getFileIds, d as getTypographyIds, e as getTableIds, f as getPageIds, h as getElementChildren, j as createDocumentReference, M as MakeswiftComponentType, k as getBorderSwatchIds, l as isNonNullable, m as getBoxShadowsSwatchIds, n as getResponsiveColorSwatchIds, o as
|
|
42
|
+
import { g as getPropControllerDescriptors, i as isElementReference, a as getElementSwatchIds, b as getFileIds, d as getTypographyIds, e as getTableIds, f as getPageIds, h as getElementChildren, j as createDocumentReference, M as MakeswiftComponentType, k as getBorderSwatchIds, l as isNonNullable, m as getBoxShadowsSwatchIds, n as getResponsiveColorSwatchIds, o as isPropControllersHandle, p as getComponentPropControllerDescriptors, q as getPropControllers, r as configureStore$1, s as getDocument, t as getElementId, u as getIsPreview, v as getIsInBuilder, w as copyElementTree, x as getReactComponent } from "./constants.es.js";
|
|
43
43
|
import { A as ActionTypes, f as introspectedResourcesFulfilled, g as apiResourceFulfilled, t as typographiesFulfilled, h as registerComponentHandleEffect, j as mountComponentEffect, k as registerComponentEffect, l as registerReactComponentEffect } from "./actions.es.js";
|
|
44
44
|
import { cache, cx } from "@emotion/css";
|
|
45
45
|
import { serializeStyles } from "@emotion/serialize";
|
|
46
46
|
import { registerStyles, insertStyles } from "@emotion/utils";
|
|
47
47
|
import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
48
|
-
import { T as Types, E as ElementID, B as Backgrounds, W as Width, h as ResponsiveIconRadioGroup, M as Margin, P as Padding, i as Border, j as BorderRadius, k as Shadows, G as GapY, l as GapX, m as ResponsiveSelect, n as ResponsiveNumber, o as Checkbox, p as Grid, q as TextInput, L as Link, r as ResponsiveColor, s as TextStyle, t as Images, N as Number$1, D as Date$1, F as Font, u as ResponsiveLength, v as TextArea, w as Table, x as TableFormFields, y as Image, z as ResponsiveOpacity, A as NavigationLinks, H as SocialLinks, J as RichText, V as Video, K as StyleControlProperty, O as ImageControlValueFormat, I as ImageControlType, C as ColorControlType, Q as BorderPropControllerFormat, U as ShadowsPropControllerFormat, X as BorderRadiusPropControllerFormat, Y as MarginPropControllerFormat, Z as PaddingPropControllerFormat, _ as WidthPropControllerFormat, S as SlotControlType, a as StyleControlType } from "./
|
|
48
|
+
import { T as Types, E as ElementID, B as Backgrounds, W as Width, h as ResponsiveIconRadioGroup, M as Margin, P as Padding, i as Border, j as BorderRadius, k as Shadows, G as GapY, l as GapX, m as ResponsiveSelect, n as ResponsiveNumber, o as Checkbox, p as Grid, q as TextInput, L as Link, r as ResponsiveColor, s as TextStyle, t as Images, N as Number$1, D as Date$1, F as Font, u as ResponsiveLength, v as TextArea, w as Table, x as TableFormFields, y as Image, z as ResponsiveOpacity, A as NavigationLinks, H as SocialLinks, J as RichText, V as Video, K as StyleControlProperty, O as ImageControlValueFormat, I as ImageControlType, C as ColorControlType, Q as BorderPropControllerFormat, U as ShadowsPropControllerFormat, X as BorderRadiusPropControllerFormat, Y as MarginPropControllerFormat, Z as PaddingPropControllerFormat, _ as WidthPropControllerFormat, S as SlotControlType, $ as RichTextControlType, a as StyleControlType } from "./rich-text.es.js";
|
|
49
49
|
import { S as SelectControlType, T as TextAreaControlType, a as TextInputControlType, N as NumberControlType, C as CheckboxControlType } from "./text-input.es.js";
|
|
50
50
|
import { C as ComboboxControlType } from "./combobox.es.js";
|
|
51
51
|
import { S as ShapeControlType, L as ListControlType, b as LinkControlType } from "./control.es.js";
|
|
@@ -1048,7 +1048,7 @@ class Document$1 extends NextDocument {
|
|
|
1048
1048
|
});
|
|
1049
1049
|
}
|
|
1050
1050
|
}
|
|
1051
|
-
const version = "0.6.
|
|
1051
|
+
const version = "0.6.3";
|
|
1052
1052
|
function isErrorWithMessage(error) {
|
|
1053
1053
|
return typeof error === "object" && error !== null && "message" in error && typeof error.message === "string";
|
|
1054
1054
|
}
|
|
@@ -3070,6 +3070,25 @@ function ControlValue({
|
|
|
3070
3070
|
return children(data);
|
|
3071
3071
|
}
|
|
3072
3072
|
}
|
|
3073
|
+
function pollBoxModel({
|
|
3074
|
+
element,
|
|
3075
|
+
onBoxModelChange
|
|
3076
|
+
}) {
|
|
3077
|
+
let currentBoxModel = null;
|
|
3078
|
+
const handleAnimationFrameRequest = () => {
|
|
3079
|
+
const measuredBoxModel = getBox(element);
|
|
3080
|
+
if (!deepEqual(currentBoxModel, measuredBoxModel)) {
|
|
3081
|
+
currentBoxModel = measuredBoxModel;
|
|
3082
|
+
onBoxModelChange(currentBoxModel);
|
|
3083
|
+
}
|
|
3084
|
+
animationFrameHandle = requestAnimationFrame(handleAnimationFrameRequest);
|
|
3085
|
+
};
|
|
3086
|
+
let animationFrameHandle = requestAnimationFrame(handleAnimationFrameRequest);
|
|
3087
|
+
return () => {
|
|
3088
|
+
cancelAnimationFrame(animationFrameHandle);
|
|
3089
|
+
onBoxModelChange(null);
|
|
3090
|
+
};
|
|
3091
|
+
}
|
|
3073
3092
|
function useSlot(data, control) {
|
|
3074
3093
|
if (data == null || data.elements.length === 0) {
|
|
3075
3094
|
return /* @__PURE__ */ jsx(Slot.Placeholder, {
|
|
@@ -3213,24 +3232,19 @@ function SlotPlaceholder({
|
|
|
3213
3232
|
})
|
|
3214
3233
|
});
|
|
3215
3234
|
}
|
|
3216
|
-
|
|
3217
|
-
|
|
3218
|
-
|
|
3219
|
-
|
|
3220
|
-
|
|
3221
|
-
|
|
3222
|
-
|
|
3223
|
-
|
|
3224
|
-
|
|
3225
|
-
|
|
3226
|
-
|
|
3227
|
-
|
|
3228
|
-
};
|
|
3229
|
-
let animationFrameHandle = requestAnimationFrame(handleAnimationFrameRequest);
|
|
3230
|
-
return () => {
|
|
3231
|
-
cancelAnimationFrame(animationFrameHandle);
|
|
3232
|
-
onBoxModelChange(null);
|
|
3233
|
-
};
|
|
3235
|
+
const Text = forwardNextDynamicRef((patch) => dynamic(() => patch(import("./index.es5.js"))));
|
|
3236
|
+
function useRichText(data, control) {
|
|
3237
|
+
const textCallbackRef = useCallback((handle) => {
|
|
3238
|
+
var _a;
|
|
3239
|
+
if (isPropControllersHandle(handle))
|
|
3240
|
+
(_a = handle == null ? void 0 : handle.setPropControllers) == null ? void 0 : _a.call(handle, control == null ? null : {
|
|
3241
|
+
text: control
|
|
3242
|
+
});
|
|
3243
|
+
}, [control]);
|
|
3244
|
+
return /* @__PURE__ */ jsx(Text, {
|
|
3245
|
+
text: data,
|
|
3246
|
+
ref: textCallbackRef
|
|
3247
|
+
});
|
|
3234
3248
|
}
|
|
3235
3249
|
function useWidthStyle(value, descriptor) {
|
|
3236
3250
|
return useStyle(responsiveWidth(value, descriptor.options.defaultValue));
|
|
@@ -3267,7 +3281,7 @@ function PropsValue({
|
|
|
3267
3281
|
return getPropControllers(state, documentKey, element.key);
|
|
3268
3282
|
});
|
|
3269
3283
|
return Object.entries(propControllerDescriptorsRef.current).reduceRight((renderFn, [propName, descriptor]) => (propsValue) => {
|
|
3270
|
-
var _a2;
|
|
3284
|
+
var _a2, _b;
|
|
3271
3285
|
switch (descriptor.type) {
|
|
3272
3286
|
case CheckboxControlType:
|
|
3273
3287
|
case NumberControlType:
|
|
@@ -3295,15 +3309,24 @@ function PropsValue({
|
|
|
3295
3309
|
[propName]: value
|
|
3296
3310
|
}))
|
|
3297
3311
|
}, descriptor.type);
|
|
3298
|
-
case
|
|
3312
|
+
case RichTextControlType:
|
|
3299
3313
|
const control = (_a2 = propControllers == null ? void 0 : propControllers[propName]) != null ? _a2 : null;
|
|
3300
3314
|
return /* @__PURE__ */ jsx(RenderHook, {
|
|
3301
|
-
hook:
|
|
3315
|
+
hook: useRichText,
|
|
3302
3316
|
parameters: [props[propName], control],
|
|
3303
3317
|
children: (value) => renderFn(__spreadProps(__spreadValues({}, propsValue), {
|
|
3304
3318
|
[propName]: value
|
|
3305
3319
|
}))
|
|
3306
3320
|
}, descriptor.type);
|
|
3321
|
+
case SlotControlType: {
|
|
3322
|
+
const control2 = (_b = propControllers == null ? void 0 : propControllers[propName]) != null ? _b : null;
|
|
3323
|
+
return /* @__PURE__ */ jsx(RenderHook, {
|
|
3324
|
+
hook: useSlot,
|
|
3325
|
+
parameters: [props[propName], control2],
|
|
3326
|
+
children: (value) => renderFn(__spreadProps(__spreadValues({}, propsValue), {
|
|
3327
|
+
[propName]: value
|
|
3328
|
+
}))
|
|
3329
|
+
}, descriptor.type);
|
|
3307
3330
|
}
|
|
3308
3331
|
case Types.Width:
|
|
3309
3332
|
switch (descriptor.options.format) {
|
|
@@ -3682,5 +3705,5 @@ const DocumentReference = memo(forwardRef(function DocumentReference2({
|
|
|
3682
3705
|
document: document2
|
|
3683
3706
|
});
|
|
3684
3707
|
}));
|
|
3685
|
-
export {
|
|
3708
|
+
export { Page as $, Alignments as A, useFile as B, Contrasts as C, DocumentReference as D, Element as E, DEVICES as F, findDeviceOverride as G, forwardNextDynamicRef as H, useIsPreview as I, useFiles as J, useSwatches as K, usePagePathnameSlice as L, useElementId as M, deepEqual as N, storeContextDefaultValue as O, PageProvider as P, StoreContext as Q, RuntimeProvider as R, Shapes as S, MakeswiftProvider as T, pollBoxModel as U, useTypography as V, shallowMergeFallbacks as W, MakeswiftClient as X, getStaticPaths as Y, getStaticProps as Z, getServerSideProps as _, ReactRuntime as a, Makeswift as a0, PreviewModeScript as a1, Document$1 as a2, MakeswiftApiHandler as a3, usePageId as b, DEFAULT_BOX_ANIMATE_TYPE as c, DEFAULT_BOX_ANIMATE_DELAY as d, DEFAULT_BOX_ANIMATE_DURATION as e, DEFAULT_ITEM_ANIMATE_TYPE as f, DEFAULT_ITEM_ANIMATE_DELAY as g, DEFAULT_ITEM_ANIMATE_DURATION as h, DEFAULT_ITEM_STAGGER_DURATION as i, useBorder as j, useBoxShadow as k, useResponsiveColor as l, useMediaQuery as m, Page$1 as n, useStyle as o, responsiveWidth as p, responsiveTextStyle as q, responsiveStyle as r, colorToString as s, Sizes as t, useIsInBuilder as u, useFormContext as v, responsiveGridItem as w, useTable as x, useMakeswiftClient as y, Provider as z };
|
|
3686
3709
|
//# sourceMappingURL=index.es.js.map
|