@makeswift/runtime 0.21.3 → 0.21.4-canary.0
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/cjs/api/react.js +45 -0
- package/dist/cjs/api/react.js.map +1 -1
- package/dist/cjs/components/shared/Link/index.js +14 -69
- package/dist/cjs/components/shared/Link/index.js.map +1 -1
- package/dist/cjs/components/utils/responsive-style.js +2 -1
- package/dist/cjs/components/utils/responsive-style.js.map +1 -1
- package/dist/cjs/controls/link.js +46 -2
- package/dist/cjs/controls/link.js.map +1 -1
- package/dist/cjs/controls/rich-text/rich-text.js +12 -0
- package/dist/cjs/controls/rich-text/rich-text.js.map +1 -1
- package/dist/cjs/controls/rich-text-v2/rich-text-v2.js +12 -0
- package/dist/cjs/controls/rich-text-v2/rich-text-v2.js.map +1 -1
- package/dist/cjs/controls/slot.js +12 -0
- package/dist/cjs/controls/slot.js.map +1 -1
- package/dist/cjs/next/api-handler/handlers/manifest.js +1 -1
- package/dist/cjs/next/components/tests/controls/fixtures/rich-text-v2.js +203 -0
- package/dist/cjs/next/components/tests/controls/fixtures/rich-text-v2.js.map +1 -0
- package/dist/cjs/runtimes/react/components/ElementData.js +1 -1
- package/dist/cjs/runtimes/react/components/ElementData.js.map +1 -1
- package/dist/cjs/runtimes/react/controls/control.js +11 -156
- package/dist/cjs/runtimes/react/controls/control.js.map +1 -1
- package/dist/cjs/runtimes/react/controls/rich-text/EditableText/editable-text.js +1 -0
- package/dist/cjs/runtimes/react/controls/rich-text/EditableText/editable-text.js.map +1 -1
- package/dist/cjs/runtimes/react/controls/rich-text/rich-text.js +9 -3
- package/dist/cjs/runtimes/react/controls/rich-text/rich-text.js.map +1 -1
- package/dist/cjs/runtimes/react/controls/rich-text-v2/EditableTextV2/editable-text-v2.js +1 -0
- package/dist/cjs/runtimes/react/controls/rich-text-v2/EditableTextV2/editable-text-v2.js.map +1 -1
- package/dist/cjs/runtimes/react/controls/rich-text-v2/ReadOnlyTextV2.js +2 -2
- package/dist/cjs/runtimes/react/controls/rich-text-v2/ReadOnlyTextV2.js.map +1 -1
- package/dist/cjs/runtimes/react/controls/rich-text-v2/rich-text-v2.js +12 -9
- package/dist/cjs/runtimes/react/controls/rich-text-v2/rich-text-v2.js.map +1 -1
- package/dist/cjs/runtimes/react/controls/slot.js +5 -4
- package/dist/cjs/runtimes/react/controls/slot.js.map +1 -1
- package/dist/cjs/runtimes/react/controls/style.js +6 -47
- package/dist/cjs/runtimes/react/controls/style.js.map +1 -1
- package/dist/cjs/runtimes/react/controls/typography.js +49 -51
- package/dist/cjs/runtimes/react/controls/typography.js.map +1 -1
- package/dist/cjs/runtimes/react/controls.js +15 -111
- package/dist/cjs/runtimes/react/controls.js.map +1 -1
- package/dist/cjs/{utils/coalesce.js → runtimes/react/hooks/use-css-id.js} +13 -14
- package/dist/cjs/runtimes/react/hooks/use-css-id.js.map +1 -0
- package/dist/cjs/runtimes/react/hooks/use-resolved-props.js +85 -0
- package/dist/cjs/runtimes/react/hooks/use-resolved-props.js.map +1 -0
- package/dist/cjs/runtimes/react/hooks/use-resolved-value.js +9 -2
- package/dist/cjs/runtimes/react/hooks/use-resolved-value.js.map +1 -1
- package/dist/cjs/runtimes/react/hooks/use-resource-resolver.js +68 -0
- package/dist/cjs/runtimes/react/hooks/use-resource-resolver.js.map +1 -0
- package/dist/cjs/runtimes/react/hooks/use-stylesheet-factory.js +115 -0
- package/dist/cjs/runtimes/react/hooks/use-stylesheet-factory.js.map +1 -0
- package/dist/cjs/runtimes/react/resolvable-record.js +67 -0
- package/dist/cjs/runtimes/react/resolvable-record.js.map +1 -0
- package/dist/cjs/runtimes/react/use-style.js +20 -4
- package/dist/cjs/runtimes/react/use-style.js.map +1 -1
- package/dist/cjs/slate/TypographyPlugin/index.js +2 -1
- package/dist/cjs/slate/TypographyPlugin/index.js.map +1 -1
- package/dist/cjs/slate/TypographyPlugin/normalizeTypographyDown.js +2 -12
- package/dist/cjs/slate/TypographyPlugin/normalizeTypographyDown.js.map +1 -1
- package/dist/cjs/slate/index.js.map +1 -1
- package/dist/cjs/state/modules/breakpoints.js +7 -87
- package/dist/cjs/state/modules/breakpoints.js.map +1 -1
- package/dist/esm/api/react.js +45 -0
- package/dist/esm/api/react.js.map +1 -1
- package/dist/esm/components/shared/Link/index.js +14 -69
- package/dist/esm/components/shared/Link/index.js.map +1 -1
- package/dist/esm/components/utils/responsive-style.js +2 -3
- package/dist/esm/components/utils/responsive-style.js.map +1 -1
- package/dist/esm/controls/link.js +37 -2
- package/dist/esm/controls/link.js.map +1 -1
- package/dist/esm/controls/rich-text/rich-text.js +16 -1
- package/dist/esm/controls/rich-text/rich-text.js.map +1 -1
- package/dist/esm/controls/rich-text-v2/rich-text-v2.js +14 -1
- package/dist/esm/controls/rich-text-v2/rich-text-v2.js.map +1 -1
- package/dist/esm/controls/slot.js +14 -1
- package/dist/esm/controls/slot.js.map +1 -1
- package/dist/esm/next/api-handler/handlers/manifest.js +1 -1
- package/dist/esm/next/components/tests/controls/fixtures/rich-text-v2.js +179 -0
- package/dist/esm/next/components/tests/controls/fixtures/rich-text-v2.js.map +1 -0
- package/dist/esm/runtimes/react/components/ElementData.js +2 -2
- package/dist/esm/runtimes/react/components/ElementData.js.map +1 -1
- package/dist/esm/runtimes/react/controls/control.js +11 -175
- package/dist/esm/runtimes/react/controls/control.js.map +1 -1
- package/dist/esm/runtimes/react/controls/rich-text/EditableText/editable-text.js +1 -0
- package/dist/esm/runtimes/react/controls/rich-text/EditableText/editable-text.js.map +1 -1
- package/dist/esm/runtimes/react/controls/rich-text/rich-text.js +8 -2
- package/dist/esm/runtimes/react/controls/rich-text/rich-text.js.map +1 -1
- package/dist/esm/runtimes/react/controls/rich-text-v2/EditableTextV2/editable-text-v2.js +1 -0
- package/dist/esm/runtimes/react/controls/rich-text-v2/EditableTextV2/editable-text-v2.js.map +1 -1
- package/dist/esm/runtimes/react/controls/rich-text-v2/ReadOnlyTextV2.js +1 -1
- package/dist/esm/runtimes/react/controls/rich-text-v2/ReadOnlyTextV2.js.map +1 -1
- package/dist/esm/runtimes/react/controls/rich-text-v2/rich-text-v2.js +14 -9
- package/dist/esm/runtimes/react/controls/rich-text-v2/rich-text-v2.js.map +1 -1
- package/dist/esm/runtimes/react/controls/slot.js +4 -3
- package/dist/esm/runtimes/react/controls/slot.js.map +1 -1
- package/dist/esm/runtimes/react/controls/style.js +6 -37
- package/dist/esm/runtimes/react/controls/style.js.map +1 -1
- package/dist/esm/runtimes/react/controls/typography.js +49 -48
- package/dist/esm/runtimes/react/controls/typography.js.map +1 -1
- package/dist/esm/runtimes/react/controls.js +14 -129
- package/dist/esm/runtimes/react/controls.js.map +1 -1
- package/dist/esm/runtimes/react/hooks/use-css-id.js +8 -0
- package/dist/esm/runtimes/react/hooks/use-css-id.js.map +1 -0
- package/dist/esm/runtimes/react/hooks/use-resolved-props.js +53 -0
- package/dist/esm/runtimes/react/hooks/use-resolved-props.js.map +1 -0
- package/dist/esm/runtimes/react/hooks/use-resolved-value.js +9 -2
- package/dist/esm/runtimes/react/hooks/use-resolved-value.js.map +1 -1
- package/dist/esm/runtimes/react/hooks/use-resource-resolver.js +34 -0
- package/dist/esm/runtimes/react/hooks/use-resource-resolver.js.map +1 -0
- package/dist/esm/runtimes/react/hooks/use-stylesheet-factory.js +94 -0
- package/dist/esm/runtimes/react/hooks/use-stylesheet-factory.js.map +1 -0
- package/dist/esm/runtimes/react/resolvable-record.js +43 -0
- package/dist/esm/runtimes/react/resolvable-record.js.map +1 -0
- package/dist/esm/runtimes/react/use-style.js +17 -3
- package/dist/esm/runtimes/react/use-style.js.map +1 -1
- package/dist/esm/slate/TypographyPlugin/index.js +2 -1
- package/dist/esm/slate/TypographyPlugin/index.js.map +1 -1
- package/dist/esm/slate/TypographyPlugin/normalizeTypographyDown.js +1 -1
- package/dist/esm/slate/TypographyPlugin/normalizeTypographyDown.js.map +1 -1
- package/dist/esm/slate/index.js.map +1 -1
- package/dist/esm/state/modules/breakpoints.js +9 -70
- package/dist/esm/state/modules/breakpoints.js.map +1 -1
- package/dist/types/api/react.d.ts +11 -1
- package/dist/types/api/react.d.ts.map +1 -1
- package/dist/types/components/builtin/Button/Button.d.ts +2 -2
- package/dist/types/components/shared/Link/index.d.ts.map +1 -1
- package/dist/types/components/utils/responsive-style.d.ts +1 -1
- package/dist/types/components/utils/responsive-style.d.ts.map +1 -1
- package/dist/types/controls/link.d.ts +16 -2
- package/dist/types/controls/link.d.ts.map +1 -1
- package/dist/types/controls/rich-text/rich-text.d.ts +2 -1
- package/dist/types/controls/rich-text/rich-text.d.ts.map +1 -1
- package/dist/types/controls/rich-text-v2/rich-text-v2.d.ts +2 -1
- package/dist/types/controls/rich-text-v2/rich-text-v2.d.ts.map +1 -1
- package/dist/types/controls/slot.d.ts +2 -1
- package/dist/types/controls/slot.d.ts.map +1 -1
- package/dist/types/locale.d.ts +1 -1
- package/dist/types/next/components/tests/controls/fixtures/rich-text-v2.d.ts +40 -0
- package/dist/types/next/components/tests/controls/fixtures/rich-text-v2.d.ts.map +1 -0
- package/dist/types/next/components/tests/controls/rich-text-v2-control.test.d.ts +2 -0
- package/dist/types/next/components/tests/controls/rich-text-v2-control.test.d.ts.map +1 -0
- package/dist/types/runtimes/react/controls/control.d.ts +1 -1
- package/dist/types/runtimes/react/controls/control.d.ts.map +1 -1
- package/dist/types/runtimes/react/controls/rich-text/EditableText/editable-text.d.ts.map +1 -1
- package/dist/types/runtimes/react/controls/rich-text/rich-text.d.ts +1 -1
- package/dist/types/runtimes/react/controls/rich-text/rich-text.d.ts.map +1 -1
- package/dist/types/runtimes/react/controls/rich-text-v2/EditableTextV2/editable-text-v2.d.ts.map +1 -1
- package/dist/types/runtimes/react/controls/rich-text-v2/ReadOnlyTextV2.d.ts +3 -3
- package/dist/types/runtimes/react/controls/rich-text-v2/ReadOnlyTextV2.d.ts.map +1 -1
- package/dist/types/runtimes/react/controls/rich-text-v2/rich-text-v2.d.ts +1 -1
- package/dist/types/runtimes/react/controls/rich-text-v2/rich-text-v2.d.ts.map +1 -1
- package/dist/types/runtimes/react/controls/slot.d.ts +4 -1
- package/dist/types/runtimes/react/controls/slot.d.ts.map +1 -1
- package/dist/types/runtimes/react/controls/style.d.ts +4 -3
- package/dist/types/runtimes/react/controls/style.d.ts.map +1 -1
- package/dist/types/runtimes/react/controls/typography.d.ts +5 -6
- package/dist/types/runtimes/react/controls/typography.d.ts.map +1 -1
- package/dist/types/runtimes/react/controls.d.ts +1 -1
- package/dist/types/runtimes/react/controls.d.ts.map +1 -1
- package/dist/types/runtimes/react/hooks/use-css-id.d.ts +2 -0
- package/dist/types/runtimes/react/hooks/use-css-id.d.ts.map +1 -0
- package/dist/types/runtimes/react/hooks/use-resolved-props.d.ts +3 -0
- package/dist/types/runtimes/react/hooks/use-resolved-props.d.ts.map +1 -0
- package/dist/types/runtimes/react/hooks/use-resolved-value.d.ts +2 -2
- package/dist/types/runtimes/react/hooks/use-resolved-value.d.ts.map +1 -1
- package/dist/types/runtimes/react/hooks/use-resource-resolver.d.ts +3 -0
- package/dist/types/runtimes/react/hooks/use-resource-resolver.d.ts.map +1 -0
- package/dist/types/runtimes/react/hooks/use-stylesheet-factory.d.ts +7 -0
- package/dist/types/runtimes/react/hooks/use-stylesheet-factory.d.ts.map +1 -0
- package/dist/types/runtimes/react/resolvable-record.d.ts +3 -0
- package/dist/types/runtimes/react/resolvable-record.d.ts.map +1 -0
- package/dist/types/runtimes/react/use-style.d.ts +4 -0
- package/dist/types/runtimes/react/use-style.d.ts.map +1 -1
- package/dist/types/slate/BlockPlugin/index.d.ts +5 -5
- package/dist/types/slate/LinkPlugin/getValue.d.ts +1 -1
- package/dist/types/slate/LinkPlugin/index.d.ts +1 -1
- package/dist/types/slate/TypographyPlugin/index.d.ts.map +1 -1
- package/dist/types/slate/TypographyPlugin/normalizeTypographyDown.d.ts.map +1 -1
- package/dist/types/slate/index.d.ts +1 -0
- package/dist/types/slate/index.d.ts.map +1 -1
- package/dist/types/slate/test-helpers/slate-test-helper.d.ts +4 -4
- package/dist/types/slate/test-helpers/test-elements.d.ts +1 -1
- package/dist/types/state/modules/breakpoints.d.ts +2 -21
- package/dist/types/state/modules/breakpoints.d.ts.map +1 -1
- package/package.json +3 -3
- package/dist/cjs/runtimes/react/controls/color.js +0 -58
- package/dist/cjs/runtimes/react/controls/color.js.map +0 -1
- package/dist/cjs/runtimes/react/controls/image.js +0 -53
- package/dist/cjs/runtimes/react/controls/image.js.map +0 -1
- package/dist/cjs/runtimes/react/controls/link.js +0 -110
- package/dist/cjs/runtimes/react/controls/link.js.map +0 -1
- package/dist/cjs/runtimes/react/controls/list.js +0 -58
- package/dist/cjs/runtimes/react/controls/list.js.map +0 -1
- package/dist/cjs/runtimes/react/controls/shape.js +0 -44
- package/dist/cjs/runtimes/react/controls/shape.js.map +0 -1
- package/dist/cjs/runtimes/react/controls/style-v2.js +0 -92
- package/dist/cjs/runtimes/react/controls/style-v2.js.map +0 -1
- package/dist/cjs/utils/coalesce.js.map +0 -1
- package/dist/cjs/utils/shallowMerge.js +0 -44
- package/dist/cjs/utils/shallowMerge.js.map +0 -1
- package/dist/esm/runtimes/react/controls/color.js +0 -24
- package/dist/esm/runtimes/react/controls/color.js.map +0 -1
- package/dist/esm/runtimes/react/controls/image.js +0 -29
- package/dist/esm/runtimes/react/controls/image.js.map +0 -1
- package/dist/esm/runtimes/react/controls/link.js +0 -76
- package/dist/esm/runtimes/react/controls/link.js.map +0 -1
- package/dist/esm/runtimes/react/controls/list.js +0 -34
- package/dist/esm/runtimes/react/controls/list.js.map +0 -1
- package/dist/esm/runtimes/react/controls/shape.js +0 -20
- package/dist/esm/runtimes/react/controls/shape.js.map +0 -1
- package/dist/esm/runtimes/react/controls/style-v2.js +0 -72
- package/dist/esm/runtimes/react/controls/style-v2.js.map +0 -1
- package/dist/esm/utils/coalesce.js +0 -13
- package/dist/esm/utils/coalesce.js.map +0 -1
- package/dist/esm/utils/shallowMerge.js +0 -14
- package/dist/esm/utils/shallowMerge.js.map +0 -1
- package/dist/types/runtimes/react/controls/color.d.ts +0 -4
- package/dist/types/runtimes/react/controls/color.d.ts.map +0 -1
- package/dist/types/runtimes/react/controls/image.d.ts +0 -4
- package/dist/types/runtimes/react/controls/image.d.ts.map +0 -1
- package/dist/types/runtimes/react/controls/link.d.ts +0 -4
- package/dist/types/runtimes/react/controls/link.d.ts.map +0 -1
- package/dist/types/runtimes/react/controls/list.d.ts +0 -12
- package/dist/types/runtimes/react/controls/list.d.ts.map +0 -1
- package/dist/types/runtimes/react/controls/shape.d.ts +0 -12
- package/dist/types/runtimes/react/controls/shape.d.ts.map +0 -1
- package/dist/types/runtimes/react/controls/style-v2.d.ts +0 -13
- package/dist/types/runtimes/react/controls/style-v2.d.ts.map +0 -1
- package/dist/types/utils/coalesce.d.ts +0 -3
- package/dist/types/utils/coalesce.d.ts.map +0 -1
- package/dist/types/utils/shallowMerge.d.ts +0 -2
- package/dist/types/utils/shallowMerge.d.ts.map +0 -1
package/dist/cjs/api/react.js
CHANGED
|
@@ -60,6 +60,13 @@ class MakeswiftHostApiClient {
|
|
|
60
60
|
MakeswiftApiClient.fetchAPIResource(import_types.APIResourceType.Swatch, swatchId)
|
|
61
61
|
);
|
|
62
62
|
}
|
|
63
|
+
resolveSwatch(swatchId) {
|
|
64
|
+
return this.resolveResource(import_types.APIResourceType.Swatch, {
|
|
65
|
+
id: swatchId,
|
|
66
|
+
read: (id) => this.readSwatch(id),
|
|
67
|
+
fetch: (id) => this.fetchSwatch(id)
|
|
68
|
+
});
|
|
69
|
+
}
|
|
63
70
|
readFile(fileId) {
|
|
64
71
|
return MakeswiftApiClient.getAPIResource(
|
|
65
72
|
this.makeswiftApiClient.getState(),
|
|
@@ -72,6 +79,13 @@ class MakeswiftHostApiClient {
|
|
|
72
79
|
MakeswiftApiClient.fetchAPIResource(import_types.APIResourceType.File, fileId)
|
|
73
80
|
);
|
|
74
81
|
}
|
|
82
|
+
resolveFile(fileId) {
|
|
83
|
+
return this.resolveResource(import_types.APIResourceType.File, {
|
|
84
|
+
id: fileId,
|
|
85
|
+
read: (id) => this.readFile(id),
|
|
86
|
+
fetch: (id) => this.fetchFile(id)
|
|
87
|
+
});
|
|
88
|
+
}
|
|
75
89
|
readTypography(typographyId) {
|
|
76
90
|
return MakeswiftApiClient.getAPIResource(
|
|
77
91
|
this.makeswiftApiClient.getState(),
|
|
@@ -84,6 +98,13 @@ class MakeswiftHostApiClient {
|
|
|
84
98
|
MakeswiftApiClient.fetchAPIResource(import_types.APIResourceType.Typography, typographyId)
|
|
85
99
|
);
|
|
86
100
|
}
|
|
101
|
+
resolveTypography(typographyId) {
|
|
102
|
+
return this.resolveResource(import_types.APIResourceType.Typography, {
|
|
103
|
+
id: typographyId,
|
|
104
|
+
read: (id) => this.readTypography(id),
|
|
105
|
+
fetch: (id) => this.fetchTypography(id)
|
|
106
|
+
});
|
|
107
|
+
}
|
|
87
108
|
readGlobalElement(globalElementId) {
|
|
88
109
|
return MakeswiftApiClient.getAPIResource(
|
|
89
110
|
this.makeswiftApiClient.getState(),
|
|
@@ -141,6 +162,30 @@ class MakeswiftHostApiClient {
|
|
|
141
162
|
MakeswiftApiClient.fetchAPIResource(import_types.APIResourceType.PagePathnameSlice, pageId, this.locale)
|
|
142
163
|
);
|
|
143
164
|
}
|
|
165
|
+
resolvePagePathnameSlice(pageId) {
|
|
166
|
+
return this.resolveResource(import_types.APIResourceType.PagePathnameSlice, {
|
|
167
|
+
id: pageId,
|
|
168
|
+
read: (id) => this.readPagePathnameSlice(id),
|
|
169
|
+
fetch: (id) => this.fetchPagePathnameSlice(id)
|
|
170
|
+
});
|
|
171
|
+
}
|
|
172
|
+
resolveResource(type, {
|
|
173
|
+
id,
|
|
174
|
+
read,
|
|
175
|
+
fetch
|
|
176
|
+
}) {
|
|
177
|
+
const _read = () => id != null ? read(id) : null;
|
|
178
|
+
let lastValue = null;
|
|
179
|
+
return {
|
|
180
|
+
name: `${type}:${id}`,
|
|
181
|
+
readStable: () => lastValue = _read(),
|
|
182
|
+
subscribe: (onUpdate) => this.subscribe(() => {
|
|
183
|
+
if (_read() !== lastValue)
|
|
184
|
+
onUpdate();
|
|
185
|
+
}),
|
|
186
|
+
fetch: async () => id != null ? fetch(id) : null
|
|
187
|
+
};
|
|
188
|
+
}
|
|
144
189
|
readTable(tableId) {
|
|
145
190
|
return MakeswiftApiClient.getAPIResource(
|
|
146
191
|
this.makeswiftApiClient.getState(),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/api/react.ts"],"sourcesContent":["import * as MakeswiftApiClient from '../state/makeswift-api-client'\nimport {\n APIResourceType,\n File,\n GlobalElement,\n LocalizedGlobalElement,\n Page,\n PagePathnameSlice,\n Site,\n Snippet,\n Swatch,\n Table,\n Typography,\n} from './graphql/types'\nimport { GraphQLClient } from './graphql/client'\nimport { CreateTableRecordMutation } from './graphql/documents'\nimport {\n CreateTableRecordMutationResult,\n CreateTableRecordMutationVariables,\n} from './graphql/generated/types'\n\nexport type SerializedLocalizedResourcesMap = {\n [resourceId: string]: string | null\n}\n\ntype LocalizedResourcesMap = Map<string, string | null>\n\nexport type CacheData = MakeswiftApiClient.SerializedState\n\nexport type MakeswiftClientOptions = {\n uri: string\n cacheData?: CacheData\n localizedResourcesMap?: SerializedLocalizedResourcesMap\n locale?: Intl.Locale\n}\n\n/**\n * NOTE(miguel): This \"client\" is used to fetch Makeswift API resources needed for the host. For\n * example, swatches, files, typographies, etc. Ideally it's internal to the runtime and is only\n * used by controls to transform API references to API resources.\n *\n * Moreover, its use should be reserved for the builder only, since for live pages all Makeswift\n * API resources should be embedded in the \"page snapshot\". In the builder, this client serves the\n * purpose of sending requests for API resources and keeping a cache so that changes that happen in\n * the builder, like modifying a swatch, can be sent via `postMessage` to the host and the cache can\n * immediately update the value and re-render.\n *\n * Furthermore, the API resources requested shouldn't be requested directly from the Makeswift API\n * as that would require those resources to not be authenticated since the requests come from the\n * browser when running the host. Instead, the requests should go to the host directly, at the\n * Makeswift API endpoint (i.g., `/api/makeswift/[...makeswift]` dynamic route) where the host's\n * API key can be used, securely, in the server. For this reason, this client should really be a\n * client of the host's API, not Makeswift's, intended to build and continuously maintain a realtime\n * snapshot for use in the builder, not the lives pages.\n */\nexport class MakeswiftHostApiClient {\n graphqlClient: GraphQLClient\n makeswiftApiClient: MakeswiftApiClient.Store\n subscribe: MakeswiftApiClient.Store['subscribe']\n private localizedResourcesMap: LocalizedResourcesMap\n private locale: Intl.Locale | undefined\n\n constructor({ uri, cacheData, localizedResourcesMap = {}, locale }: MakeswiftClientOptions) {\n this.graphqlClient = new GraphQLClient(uri)\n this.makeswiftApiClient = MakeswiftApiClient.configureStore({ serializedState: cacheData })\n this.subscribe = this.makeswiftApiClient.subscribe\n this.localizedResourcesMap = new Map(Object.entries(localizedResourcesMap))\n this.locale = locale\n }\n\n readSwatch(swatchId: string): Swatch | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Swatch,\n swatchId,\n )\n }\n\n async fetchSwatch(swatchId: string): Promise<Swatch | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.Swatch, swatchId),\n )\n }\n\n readFile(fileId: string): File | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.File,\n fileId,\n )\n }\n\n async fetchFile(fileId: string): Promise<File | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.File, fileId),\n )\n }\n\n readTypography(typographyId: string): Typography | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Typography,\n typographyId,\n )\n }\n\n async fetchTypography(typographyId: string): Promise<Typography | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.Typography, typographyId),\n )\n }\n\n readGlobalElement(globalElementId: string): GlobalElement | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.GlobalElement,\n globalElementId,\n )\n }\n\n async fetchGlobalElement(globalElementId: string): Promise<GlobalElement | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.GlobalElement, globalElementId),\n )\n }\n\n readLocalizedGlobalElement(globalElementId: string): LocalizedGlobalElement | null {\n const localizedGlobalElementId = this.getLocalizedResourceId(globalElementId)\n\n if (localizedGlobalElementId == null) return null\n\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.LocalizedGlobalElement,\n localizedGlobalElementId,\n )\n }\n\n async fetchLocalizedGlobalElement(\n globalElementId: string,\n ): Promise<LocalizedGlobalElement | null> {\n const locale = this.locale\n\n if (locale == null) return null\n\n // If getLocalizedResourceId returns null, it means we have tried to fetch the resource,\n // but the resource is not available. If we haven't fetched it yet, it'll return undefined.\n const noLocalizedResource = this.getLocalizedResourceId(globalElementId) === null\n\n if (noLocalizedResource) return null\n\n // TODO(fikri): We're checking the cache here because the cache hit will fail on fetchAPIResource.\n // This is because in the cache we're saving the ID of the localizedGlobalElementId,\n // but we're reading the cache using the globalElementId.\n // This is very confusing and it can lead to more bugs. We need to refactor how we handle\n // localized global element.\n const cacheResult = this.readLocalizedGlobalElement(globalElementId)\n\n if (cacheResult) return cacheResult\n\n const result = await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(\n APIResourceType.LocalizedGlobalElement,\n globalElementId,\n locale,\n ),\n )\n\n this.setLocalizedResourceId({\n resourceId: globalElementId,\n localizedResourceId: result?.id ?? null,\n })\n\n return result\n }\n\n readPagePathnameSlice(pageId: string): PagePathnameSlice | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.PagePathnameSlice,\n pageId,\n )\n }\n\n async fetchPagePathnameSlice(pageId: string): Promise<PagePathnameSlice | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.PagePathnameSlice, pageId, this.locale),\n )\n }\n\n readTable(tableId: string): Table | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Table,\n tableId,\n )\n }\n\n async fetchTable(tableId: string): Promise<Table | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.Table, tableId),\n )\n }\n\n async createTableRecord(tableId: string, columns: any): Promise<void> {\n await this.graphqlClient.request<\n CreateTableRecordMutationResult,\n CreateTableRecordMutationVariables\n >(CreateTableRecordMutation, { input: { data: { tableId, columns } } })\n }\n\n readSite(siteId: string): Site | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Site,\n siteId,\n )\n }\n\n readPage(pageId: string): Page | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Page,\n pageId,\n )\n }\n\n readSnippet(snippetId: string): Snippet | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Snippet,\n snippetId,\n )\n }\n\n private getLocalizedResourceId(resourceId: string): string | undefined | null {\n return this.localizedResourcesMap?.get(resourceId)\n }\n\n setLocalizedResourceId({\n resourceId,\n localizedResourceId,\n }: {\n resourceId: string\n localizedResourceId: string | null\n }): void {\n this.localizedResourcesMap.set(resourceId, localizedResourceId)\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,yBAAoC;AACpC,mBAYO;AACP,oBAA8B;AAC9B,uBAA0C;AAwCnC,MAAM,uBAAuB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACQ;AAAA,EACA;AAAA,EAER,YAAY,EAAE,KAAK,WAAW,wBAAwB,CAAC,GAAG,OAAO,GAA2B;AAC1F,SAAK,gBAAgB,IAAI,4BAAc,GAAG;AAC1C,SAAK,qBAAqB,mBAAmB,eAAe,EAAE,iBAAiB,UAAU,CAAC;AAC1F,SAAK,YAAY,KAAK,mBAAmB;AACzC,SAAK,wBAAwB,IAAI,IAAI,OAAO,QAAQ,qBAAqB,CAAC;AAC1E,SAAK,SAAS;AAAA,EAChB;AAAA,EAEA,WAAW,UAAiC;AAC1C,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,MAAM,YAAY,UAA0C;AAC1D,WAAO,MAAM,KAAK,mBAAmB;AAAA,MACnC,mBAAmB,iBAAiB,6BAAgB,QAAQ,QAAQ;AAAA,IACtE;AAAA,EACF;AAAA,EAEA,SAAS,QAA6B;AACpC,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,MAAM,UAAU,QAAsC;AACpD,WAAO,MAAM,KAAK,mBAAmB;AAAA,MACnC,mBAAmB,iBAAiB,6BAAgB,MAAM,MAAM;AAAA,IAClE;AAAA,EACF;AAAA,EAEA,eAAe,cAAyC;AACtD,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,MAAM,gBAAgB,cAAkD;AACtE,WAAO,MAAM,KAAK,mBAAmB;AAAA,MACnC,mBAAmB,iBAAiB,6BAAgB,YAAY,YAAY;AAAA,IAC9E;AAAA,EACF;AAAA,EAEA,kBAAkB,iBAA+C;AAC/D,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,MAAM,mBAAmB,iBAAwD;AAC/E,WAAO,MAAM,KAAK,mBAAmB;AAAA,MACnC,mBAAmB,iBAAiB,6BAAgB,eAAe,eAAe;AAAA,IACpF;AAAA,EACF;AAAA,EAEA,2BAA2B,iBAAwD;AACjF,UAAM,2BAA2B,KAAK,uBAAuB,eAAe;AAE5E,QAAI,4BAA4B;AAAM,aAAO;AAE7C,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,MAAM,4BACJ,iBACwC;AACxC,UAAM,SAAS,KAAK;AAEpB,QAAI,UAAU;AAAM,aAAO;AAI3B,UAAM,sBAAsB,KAAK,uBAAuB,eAAe,MAAM;AAE7E,QAAI;AAAqB,aAAO;AAOhC,UAAM,cAAc,KAAK,2BAA2B,eAAe;AAEnE,QAAI;AAAa,aAAO;AAExB,UAAM,SAAS,MAAM,KAAK,mBAAmB;AAAA,MAC3C,mBAAmB;AAAA,QACjB,6BAAgB;AAAA,QAChB;AAAA,QACA;AAAA,MACF;AAAA,IACF;AAEA,SAAK,uBAAuB;AAAA,MAC1B,YAAY;AAAA,MACZ,qBAAqB,QAAQ,MAAM;AAAA,IACrC,CAAC;AAED,WAAO;AAAA,EACT;AAAA,EAEA,sBAAsB,QAA0C;AAC9D,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,MAAM,uBAAuB,QAAmD;AAC9E,WAAO,MAAM,KAAK,mBAAmB;AAAA,MACnC,mBAAmB,iBAAiB,6BAAgB,mBAAmB,QAAQ,KAAK,MAAM;AAAA,IAC5F;AAAA,EACF;AAAA,EAEA,UAAU,SAA+B;AACvC,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,MAAM,WAAW,SAAwC;AACvD,WAAO,MAAM,KAAK,mBAAmB;AAAA,MACnC,mBAAmB,iBAAiB,6BAAgB,OAAO,OAAO;AAAA,IACpE;AAAA,EACF;AAAA,EAEA,MAAM,kBAAkB,SAAiB,SAA6B;AACpE,UAAM,KAAK,cAAc,QAGvB,4CAA2B,EAAE,OAAO,EAAE,MAAM,EAAE,SAAS,QAAQ,EAAE,EAAE,CAAC;AAAA,EACxE;AAAA,EAEA,SAAS,QAA6B;AACpC,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,SAAS,QAA6B;AACpC,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEA,YAAY,WAAmC;AAC7C,WAAO,mBAAmB;AAAA,MACxB,KAAK,mBAAmB,SAAS;AAAA,MACjC,6BAAgB;AAAA,MAChB;AAAA,IACF;AAAA,EACF;AAAA,EAEQ,uBAAuB,YAA+C;AAC5E,WAAO,KAAK,uBAAuB,IAAI,UAAU;AAAA,EACnD;AAAA,EAEA,uBAAuB;AAAA,IACrB;AAAA,IACA;AAAA,EACF,GAGS;AACP,SAAK,sBAAsB,IAAI,YAAY,mBAAmB;AAAA,EAChE;AACF;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../../src/api/react.ts"],"sourcesContent":["import { type FetchableValue } from '@makeswift/controls'\nimport * as MakeswiftApiClient from '../state/makeswift-api-client'\nimport {\n APIResourceType,\n File,\n GlobalElement,\n LocalizedGlobalElement,\n Page,\n PagePathnameSlice,\n Site,\n Snippet,\n Swatch,\n Table,\n Typography,\n} from './graphql/types'\nimport { GraphQLClient } from './graphql/client'\nimport { CreateTableRecordMutation } from './graphql/documents'\nimport {\n CreateTableRecordMutationResult,\n CreateTableRecordMutationVariables,\n} from './graphql/generated/types'\n\nexport type SerializedLocalizedResourcesMap = {\n [resourceId: string]: string | null\n}\n\ntype LocalizedResourcesMap = Map<string, string | null>\n\nexport type CacheData = MakeswiftApiClient.SerializedState\n\nexport type MakeswiftClientOptions = {\n uri: string\n cacheData?: CacheData\n localizedResourcesMap?: SerializedLocalizedResourcesMap\n locale?: Intl.Locale\n}\n\n/**\n * NOTE(miguel): This \"client\" is used to fetch Makeswift API resources needed for the host. For\n * example, swatches, files, typographies, etc. Ideally it's internal to the runtime and is only\n * used by controls to transform API references to API resources.\n *\n * Moreover, its use should be reserved for the builder only, since for live pages all Makeswift\n * API resources should be embedded in the \"page snapshot\". In the builder, this client serves the\n * purpose of sending requests for API resources and keeping a cache so that changes that happen in\n * the builder, like modifying a swatch, can be sent via `postMessage` to the host and the cache can\n * immediately update the value and re-render.\n *\n * Furthermore, the API resources requested shouldn't be requested directly from the Makeswift API\n * as that would require those resources to not be authenticated since the requests come from the\n * browser when running the host. Instead, the requests should go to the host directly, at the\n * Makeswift API endpoint (i.g., `/api/makeswift/[...makeswift]` dynamic route) where the host's\n * API key can be used, securely, in the server. For this reason, this client should really be a\n * client of the host's API, not Makeswift's, intended to build and continuously maintain a realtime\n * snapshot for use in the builder, not the lives pages.\n */\nexport class MakeswiftHostApiClient {\n graphqlClient: GraphQLClient\n makeswiftApiClient: MakeswiftApiClient.Store\n subscribe: MakeswiftApiClient.Store['subscribe']\n private localizedResourcesMap: LocalizedResourcesMap\n private locale: Intl.Locale | undefined\n\n constructor({ uri, cacheData, localizedResourcesMap = {}, locale }: MakeswiftClientOptions) {\n this.graphqlClient = new GraphQLClient(uri)\n this.makeswiftApiClient = MakeswiftApiClient.configureStore({ serializedState: cacheData })\n this.subscribe = this.makeswiftApiClient.subscribe\n this.localizedResourcesMap = new Map(Object.entries(localizedResourcesMap))\n this.locale = locale\n }\n\n readSwatch(swatchId: string): Swatch | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Swatch,\n swatchId,\n )\n }\n\n async fetchSwatch(swatchId: string): Promise<Swatch | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.Swatch, swatchId),\n )\n }\n\n resolveSwatch(swatchId: string | undefined): FetchableValue<Swatch | null> {\n return this.resolveResource(APIResourceType.Swatch, {\n id: swatchId,\n read: id => this.readSwatch(id),\n fetch: id => this.fetchSwatch(id),\n })\n }\n\n readFile(fileId: string): File | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.File,\n fileId,\n )\n }\n\n async fetchFile(fileId: string): Promise<File | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.File, fileId),\n )\n }\n\n resolveFile(fileId: string | undefined): FetchableValue<File | null> {\n return this.resolveResource(APIResourceType.File, {\n id: fileId,\n read: id => this.readFile(id),\n fetch: id => this.fetchFile(id),\n })\n }\n\n readTypography(typographyId: string): Typography | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Typography,\n typographyId,\n )\n }\n\n async fetchTypography(typographyId: string): Promise<Typography | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.Typography, typographyId),\n )\n }\n\n resolveTypography(typographyId: string | undefined): FetchableValue<Typography | null> {\n return this.resolveResource(APIResourceType.Typography, {\n id: typographyId,\n read: id => this.readTypography(id),\n fetch: id => this.fetchTypography(id),\n })\n }\n\n readGlobalElement(globalElementId: string): GlobalElement | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.GlobalElement,\n globalElementId,\n )\n }\n\n async fetchGlobalElement(globalElementId: string): Promise<GlobalElement | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.GlobalElement, globalElementId),\n )\n }\n\n readLocalizedGlobalElement(globalElementId: string): LocalizedGlobalElement | null {\n const localizedGlobalElementId = this.getLocalizedResourceId(globalElementId)\n\n if (localizedGlobalElementId == null) return null\n\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.LocalizedGlobalElement,\n localizedGlobalElementId,\n )\n }\n\n async fetchLocalizedGlobalElement(\n globalElementId: string,\n ): Promise<LocalizedGlobalElement | null> {\n const locale = this.locale\n\n if (locale == null) return null\n\n // If getLocalizedResourceId returns null, it means we have tried to fetch the resource,\n // but the resource is not available. If we haven't fetched it yet, it'll return undefined.\n const noLocalizedResource = this.getLocalizedResourceId(globalElementId) === null\n\n if (noLocalizedResource) return null\n\n // TODO(fikri): We're checking the cache here because the cache hit will fail on fetchAPIResource.\n // This is because in the cache we're saving the ID of the localizedGlobalElementId,\n // but we're reading the cache using the globalElementId.\n // This is very confusing and it can lead to more bugs. We need to refactor how we handle\n // localized global element.\n const cacheResult = this.readLocalizedGlobalElement(globalElementId)\n\n if (cacheResult) return cacheResult\n\n const result = await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(\n APIResourceType.LocalizedGlobalElement,\n globalElementId,\n locale,\n ),\n )\n\n this.setLocalizedResourceId({\n resourceId: globalElementId,\n localizedResourceId: result?.id ?? null,\n })\n\n return result\n }\n\n readPagePathnameSlice(pageId: string): PagePathnameSlice | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.PagePathnameSlice,\n pageId,\n )\n }\n\n async fetchPagePathnameSlice(pageId: string): Promise<PagePathnameSlice | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.PagePathnameSlice, pageId, this.locale),\n )\n }\n\n resolvePagePathnameSlice(pageId: string | undefined): FetchableValue<PagePathnameSlice | null> {\n return this.resolveResource(APIResourceType.PagePathnameSlice, {\n id: pageId,\n read: id => this.readPagePathnameSlice(id),\n fetch: id => this.fetchPagePathnameSlice(id),\n })\n }\n\n resolveResource<R>(\n type: APIResourceType,\n {\n id,\n read,\n fetch,\n }: {\n id: string | undefined\n read: (id: string) => R | null\n fetch: (id: string) => Promise<R | null>\n },\n ): FetchableValue<R | null> {\n const _read = () => (id != null ? read(id) : null)\n let lastValue: R | null = null\n return {\n name: `${type}:${id}`,\n readStable: () => (lastValue = _read()),\n subscribe: (onUpdate: () => void) =>\n this.subscribe(() => {\n if (_read() !== lastValue) onUpdate()\n }),\n fetch: async () => (id != null ? fetch(id) : null),\n }\n }\n\n readTable(tableId: string): Table | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Table,\n tableId,\n )\n }\n\n async fetchTable(tableId: string): Promise<Table | null> {\n return await this.makeswiftApiClient.dispatch(\n MakeswiftApiClient.fetchAPIResource(APIResourceType.Table, tableId),\n )\n }\n\n async createTableRecord(tableId: string, columns: any): Promise<void> {\n await this.graphqlClient.request<\n CreateTableRecordMutationResult,\n CreateTableRecordMutationVariables\n >(CreateTableRecordMutation, { input: { data: { tableId, columns } } })\n }\n\n readSite(siteId: string): Site | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Site,\n siteId,\n )\n }\n\n readPage(pageId: string): Page | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Page,\n pageId,\n )\n }\n\n readSnippet(snippetId: string): Snippet | null {\n return MakeswiftApiClient.getAPIResource(\n this.makeswiftApiClient.getState(),\n APIResourceType.Snippet,\n snippetId,\n )\n }\n\n private getLocalizedResourceId(resourceId: string): string | undefined | null {\n return this.localizedResourcesMap?.get(resourceId)\n }\n\n setLocalizedResourceId({\n resourceId,\n localizedResourceId,\n }: {\n resourceId: string\n localizedResourceId: string | null\n }): void {\n this.localizedResourcesMap.set(resourceId, localizedResourceId)\n }\n}\n"],"mappings":"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","names":[]}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
"use client";
|
|
2
3
|
var __create = Object.create;
|
|
3
4
|
var __defProp = Object.defineProperty;
|
|
4
5
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
@@ -33,10 +34,9 @@ __export(Link_exports, {
|
|
|
33
34
|
module.exports = __toCommonJS(Link_exports);
|
|
34
35
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
35
36
|
var import_react = require("react");
|
|
36
|
-
var import_scroll_into_view_if_needed = __toESM(require("scroll-into-view-if-needed"));
|
|
37
37
|
var import_link = __toESM(require("next/link"));
|
|
38
|
-
var
|
|
39
|
-
var
|
|
38
|
+
var import_link2 = require("../../../controls/link");
|
|
39
|
+
var import_use_resolved_value = require("../../../runtimes/react/hooks/use-resolved-value");
|
|
40
40
|
const isValidHref = (href) => {
|
|
41
41
|
try {
|
|
42
42
|
const bases = ["http://n", "https://n"];
|
|
@@ -48,79 +48,24 @@ const isValidHref = (href) => {
|
|
|
48
48
|
};
|
|
49
49
|
const Link = (0, import_react.forwardRef)(function Link2({ link, onClick = () => {
|
|
50
50
|
}, ...restOfProps }, ref) {
|
|
51
|
-
const
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
if (link) {
|
|
60
|
-
switch (link.type) {
|
|
61
|
-
case "OPEN_PAGE": {
|
|
62
|
-
if (page) {
|
|
63
|
-
useNextLink = true;
|
|
64
|
-
href = `/${page.localizedPathname ?? page.pathname}`;
|
|
65
|
-
}
|
|
66
|
-
target = link.payload.openInNewTab ? "_blank" : "_self";
|
|
67
|
-
break;
|
|
68
|
-
}
|
|
69
|
-
case "OPEN_URL": {
|
|
70
|
-
useNextLink = isValidHref(link.payload.url);
|
|
71
|
-
href = link.payload.url;
|
|
72
|
-
target = link.payload.openInNewTab ? "_blank" : "_self";
|
|
73
|
-
break;
|
|
74
|
-
}
|
|
75
|
-
case "SEND_EMAIL": {
|
|
76
|
-
useNextLink = false;
|
|
77
|
-
const { to, subject = "", body = "" } = link.payload;
|
|
78
|
-
if (to != null)
|
|
79
|
-
href = `mailto:${to}?subject=${subject}&body=${body}`;
|
|
80
|
-
break;
|
|
81
|
-
}
|
|
82
|
-
case "CALL_PHONE": {
|
|
83
|
-
useNextLink = false;
|
|
84
|
-
href = `tel:${link.payload.phoneNumber}`;
|
|
85
|
-
break;
|
|
86
|
-
}
|
|
87
|
-
case "SCROLL_TO_ELEMENT": {
|
|
88
|
-
useNextLink = false;
|
|
89
|
-
href = `#${elementId ?? ""}`;
|
|
90
|
-
block = link.payload.block;
|
|
91
|
-
break;
|
|
92
|
-
}
|
|
93
|
-
default:
|
|
94
|
-
throw new RangeError(`Invalid link type "${link.type}."`);
|
|
95
|
-
}
|
|
96
|
-
}
|
|
51
|
+
const {
|
|
52
|
+
href,
|
|
53
|
+
target,
|
|
54
|
+
onClick: resolvedOnClick
|
|
55
|
+
} = (0, import_use_resolved_value.useResolvedValue)(
|
|
56
|
+
link,
|
|
57
|
+
(link2, resourceResolver) => (0, import_link2.Link)().resolveValue(link2, resourceResolver)
|
|
58
|
+
) ?? {};
|
|
97
59
|
function handleClick(event) {
|
|
98
60
|
onClick(event);
|
|
99
61
|
if (event.defaultPrevented)
|
|
100
62
|
return;
|
|
101
63
|
if (event.currentTarget.isContentEditable)
|
|
102
64
|
return event.preventDefault();
|
|
103
|
-
|
|
104
|
-
let hash;
|
|
105
|
-
try {
|
|
106
|
-
if (href != null)
|
|
107
|
-
hash = new URL(`http://www.example.com/${href}`).hash;
|
|
108
|
-
} catch (error) {
|
|
109
|
-
console.error(`Link received invalid href: ${href}`, error);
|
|
110
|
-
}
|
|
111
|
-
if (href != null && hash != null && href === hash) {
|
|
112
|
-
event.preventDefault();
|
|
113
|
-
const view = event.view;
|
|
114
|
-
(0, import_scroll_into_view_if_needed.default)(view.document.querySelector(hash), {
|
|
115
|
-
behavior: "smooth",
|
|
116
|
-
block
|
|
117
|
-
});
|
|
118
|
-
if (view.location.hash !== hash)
|
|
119
|
-
view.history.pushState({}, "", hash);
|
|
120
|
-
}
|
|
121
|
-
}
|
|
65
|
+
return resolvedOnClick?.(event);
|
|
122
66
|
}
|
|
123
|
-
|
|
67
|
+
const useNextLink = href != null && link && (link.type === "OPEN_PAGE" || link.type === "OPEN_URL" && isValidHref(link.payload.url));
|
|
68
|
+
if (useNextLink) {
|
|
124
69
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
125
70
|
import_link.default,
|
|
126
71
|
{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../../src/components/shared/Link/index.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/shared/Link/index.tsx"],"sourcesContent":["'use client'\n\nimport { ComponentPropsWithoutRef, forwardRef, MouseEvent } from 'react'\nimport NextLink from 'next/link'\n\nimport { LinkData } from '@makeswift/prop-controllers'\n\nimport { Link as LinkDef } from '../../../controls/link'\nimport { useResolvedValue } from '../../../runtimes/react/hooks/use-resolved-value'\n\ntype BaseProps = {\n link?: LinkData\n onClick?: (event: MouseEvent<HTMLAnchorElement>) => unknown\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'a'>, keyof BaseProps>\n\n// workaround for https://github.com/vercel/next.js/issues/66650\nconst isValidHref = (href: string) => {\n try {\n const bases = ['http://n', 'https://n']\n // - if `href` is a relative path, it will be resolved relative to the base URL\n // - if `href` is a full URL, the base URL will be ignored, even if there is a mismatch of protocols\n // - if `href` is an incomplete, protocol-only URL with a protocol that\n // conflicts with one of the base URL, this will throw\n bases.forEach(base => new URL(href, base))\n } catch (_) {\n return false\n }\n return true\n}\n\nexport const Link = forwardRef<HTMLAnchorElement, Props>(function Link(\n { link, onClick = () => {}, ...restOfProps }: Props,\n ref,\n) {\n const {\n href,\n target,\n onClick: resolvedOnClick,\n } = useResolvedValue(link, (link, resourceResolver) =>\n LinkDef().resolveValue(link, resourceResolver),\n ) ?? {}\n\n function handleClick(event: MouseEvent<HTMLAnchorElement>) {\n onClick(event)\n\n if (event.defaultPrevented) return\n\n /**\n * When we introduced `next/link` instead of just `a` element slate no longer prevented link from navigating within\n * content mode. This is a hack to compensate for what would be expected as slate's default behavior.\n * On upgrade of slate this can be reevaluated.\n */\n if (event.currentTarget.isContentEditable) return event.preventDefault()\n\n return resolvedOnClick?.(event)\n }\n\n const useNextLink =\n href != null &&\n link &&\n (link.type === 'OPEN_PAGE' || (link.type === 'OPEN_URL' && isValidHref(link.payload.url)))\n\n if (useNextLink) {\n return (\n <NextLink\n {...restOfProps}\n ref={ref}\n target={target}\n onClick={handleClick}\n href={href}\n locale={false}\n // Next.js v12 has legacyBehavior set to true by default\n legacyBehavior={false}\n />\n )\n }\n\n // eslint-disable-next-line\n return <a {...restOfProps} ref={ref} href={href} target={target} onClick={handleClick} />\n})\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAkEM;AAhEN,mBAAiE;AACjE,kBAAqB;AAIrB,IAAAA,eAAgC;AAChC,gCAAiC;AAUjC,MAAM,cAAc,CAAC,SAAiB;AACpC,MAAI;AACF,UAAM,QAAQ,CAAC,YAAY,WAAW;AAKtC,UAAM,QAAQ,UAAQ,IAAI,IAAI,MAAM,IAAI,CAAC;AAAA,EAC3C,SAAS,GAAG;AACV,WAAO;AAAA,EACT;AACA,SAAO;AACT;AAEO,MAAM,WAAO,yBAAqC,SAASC,MAChE,EAAE,MAAM,UAAU,MAAM;AAAC,GAAG,GAAG,YAAY,GAC3C,KACA;AACA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS;AAAA,EACX,QAAI;AAAA,IAAiB;AAAA,IAAM,CAACC,OAAM,yBAChC,aAAAC,MAAQ,EAAE,aAAaD,OAAM,gBAAgB;AAAA,EAC/C,KAAK,CAAC;AAEN,WAAS,YAAY,OAAsC;AACzD,YAAQ,KAAK;AAEb,QAAI,MAAM;AAAkB;AAO5B,QAAI,MAAM,cAAc;AAAmB,aAAO,MAAM,eAAe;AAEvE,WAAO,kBAAkB,KAAK;AAAA,EAChC;AAEA,QAAM,cACJ,QAAQ,QACR,SACC,KAAK,SAAS,eAAgB,KAAK,SAAS,cAAc,YAAY,KAAK,QAAQ,GAAG;AAEzF,MAAI,aAAa;AACf,WACE;AAAA,MAAC,YAAAE;AAAA,MAAA;AAAA,QACE,GAAG;AAAA,QACJ;AAAA,QACA;AAAA,QACA,SAAS;AAAA,QACT;AAAA,QACA,QAAQ;AAAA,QAER,gBAAgB;AAAA;AAAA,IAClB;AAAA,EAEJ;AAGA,SAAO,4CAAC,OAAG,GAAG,aAAa,KAAU,MAAY,QAAgB,SAAS,aAAa;AACzF,CAAC;","names":["import_link","Link","link","LinkDef","NextLink"]}
|
|
@@ -37,6 +37,7 @@ __export(responsive_style_exports, {
|
|
|
37
37
|
useResponsiveWidth: () => useResponsiveWidth
|
|
38
38
|
});
|
|
39
39
|
module.exports = __toCommonJS(responsive_style_exports);
|
|
40
|
+
var import_controls = require("@makeswift/controls");
|
|
40
41
|
var import_breakpoints = require("../../state/modules/breakpoints");
|
|
41
42
|
var import_use_breakpoints = require("../../runtimes/react/hooks/use-breakpoints");
|
|
42
43
|
var import_columns = require("./columns");
|
|
@@ -46,7 +47,7 @@ var import_border_radius = require("../../css/border-radius");
|
|
|
46
47
|
var import_border = require("../../css/border");
|
|
47
48
|
var import_colorToString = require("./colorToString");
|
|
48
49
|
function responsiveStyle(breakpoints, responsiveValues, join, strategy) {
|
|
49
|
-
return (0,
|
|
50
|
+
return (0, import_controls.join)(breakpoints, responsiveValues, join, strategy).reduce(
|
|
50
51
|
(acc, { deviceId, value }) => {
|
|
51
52
|
const breakpoint = (0, import_breakpoints.getBreakpoint)(breakpoints, deviceId);
|
|
52
53
|
const mediaQuery = (0, import_breakpoints.getBreakpointMediaQuery)(breakpoint);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/utils/responsive-style.ts"],"sourcesContent":["import { WidthProperty } from 'csstype'\nimport { CSSObject } from '@emotion/css'\n\nimport type { ResponsiveValueType as ExtractResponsiveValue } from '@makeswift/controls'\n\nimport type {\n LengthData,\n ResponsiveBorderRadiusData,\n ResponsiveMarginData,\n ResponsivePaddingData,\n ResponsiveValue,\n ResponsiveLengthData,\n ResponsiveTextStyleData,\n} from '@makeswift/prop-controllers'\n\nimport {\n FallbackStrategy,\n getBreakpoint,\n getBreakpointMediaQuery,\n join as joinResponsiveValues,\n Breakpoints,\n} from '../../state/modules/breakpoints'\n\nimport { useBreakpoints } from '../../runtimes/react/hooks/use-breakpoints'\n\nimport { getIndexes } from './columns'\nimport { PaddingPropertyData, paddingPropertyDataToStyle } from '../../css/padding'\nimport { MarginPropertyData, marginPropertyDataToStyle } from '../../css/margin'\nimport { BorderRadiusPropertyData, borderRadiusPropertyDataToStyle } from '../../css/border-radius'\nimport { BorderPropertyData, borderPropertyDataToStyle } from '../../css/border'\nimport { BorderPropControllerData } from '../hooks/useBorder'\nimport { colorToString } from './colorToString'\nimport { BoxShadow, ResponsiveBoxShadow } from '../hooks'\nimport { DropFirst } from './drop-first'\n\nexport function responsiveStyle<V, A extends ReadonlyArray<ResponsiveValue<V> | null | undefined>>(\n breakpoints: Breakpoints,\n responsiveValues: A,\n join: (values: { [K in keyof A]: ExtractResponsiveValue<A[K]> | undefined }) => CSSObject,\n strategy?: FallbackStrategy<V>,\n): CSSObject {\n return joinResponsiveValues(breakpoints, responsiveValues, join, strategy).reduce(\n (acc, { deviceId, value }) => {\n const breakpoint = getBreakpoint(breakpoints, deviceId)\n const mediaQuery = getBreakpointMediaQuery(breakpoint)\n\n return {\n ...acc,\n [mediaQuery]: {\n ...(acc[mediaQuery] as CSSObject),\n ...value,\n },\n }\n },\n {} as CSSObject,\n )\n}\n\nexport function useResponsiveStyle<\n V,\n A extends ReadonlyArray<ResponsiveValue<V> | null | undefined>,\n>(\n responsiveValues: A,\n join: (values: { [K in keyof A]: ExtractResponsiveValue<A[K]> | undefined }) => CSSObject,\n strategy?: FallbackStrategy<V>,\n): CSSObject {\n return responsiveStyle(useBreakpoints(), responsiveValues, join, strategy)\n}\n\nexport function responsiveWidth(\n breakpoints: Breakpoints,\n widthData: ResponsiveLengthData | undefined,\n defaultValue: LengthData | WidthProperty<string | number> = '100%',\n): CSSObject {\n return {\n maxWidth: '100%',\n ...responsiveStyle(breakpoints, [widthData], ([width = defaultValue]) => ({\n width: typeof width === 'object' ? `${width.value}${width.unit}` : width,\n })),\n }\n}\n\nexport function useResponsiveWidth(\n ...args: DropFirst<Parameters<typeof responsiveWidth>>\n): CSSObject {\n return responsiveWidth(useBreakpoints(), ...args)\n}\n\nexport function responsivePadding(\n breakpoints: Breakpoints,\n paddingData: ResponsivePaddingData | undefined,\n defaultValue: PaddingPropertyData = {} as PaddingPropertyData,\n): CSSObject {\n return responsiveStyle(breakpoints, [paddingData], ([padding = {} as PaddingPropertyData]) =>\n paddingPropertyDataToStyle(\n padding,\n Object.assign(\n { paddingTop: 0, paddingRight: 0, paddingBottom: 0, paddingLeft: 0 },\n defaultValue,\n ),\n ),\n )\n}\n\nexport function useResponsivePadding(\n ...args: DropFirst<Parameters<typeof responsivePadding>>\n): CSSObject {\n return responsivePadding(useBreakpoints(), ...args)\n}\n\nexport function responsiveMargin(\n breakpoints: Breakpoints,\n marginData: ResponsiveMarginData | undefined,\n defaultValue: MarginPropertyData = {} as MarginPropertyData,\n): CSSObject {\n return responsiveStyle(breakpoints, [marginData], ([margin = {} as MarginPropertyData]) =>\n marginPropertyDataToStyle(\n margin,\n Object.assign(\n { marginTop: 0, marginRight: 'auto', marginBottom: 0, marginLeft: 'auto' },\n defaultValue,\n ),\n ),\n )\n}\n\nexport function useResponsiveMargin(\n ...args: DropFirst<Parameters<typeof responsiveMargin>>\n): CSSObject {\n return responsiveMargin(useBreakpoints(), ...args)\n}\n\nexport function responsiveBorderRadius(\n breakpoints: Breakpoints,\n borderRadiusData: ResponsiveBorderRadiusData | undefined,\n defaultValue: BorderRadiusPropertyData = {} as BorderRadiusPropertyData,\n): CSSObject {\n return responsiveStyle(breakpoints, [borderRadiusData], ([borderRadius = {}]) =>\n borderRadiusPropertyDataToStyle(\n borderRadius,\n Object.assign(\n {\n borderTopLeftRadius: 0,\n borderTopRightRadius: 0,\n borderBottomRightRadius: 0,\n borderBottomLeftRadius: 0,\n },\n defaultValue,\n ),\n ),\n )\n}\n\nexport function useResponsiveBorderRadius(\n ...args: DropFirst<Parameters<typeof responsiveBorderRadius>>\n): CSSObject {\n return responsiveBorderRadius(useBreakpoints(), ...args)\n}\n\nexport function useResponsiveBorder(\n borderData: BorderPropControllerData | undefined,\n defaultValue: BorderPropertyData = {},\n): CSSObject {\n return useResponsiveStyle([borderData], ([border = {}]) =>\n borderPropertyDataToStyle(\n border,\n Object.assign(\n {\n borderTop: '0px solid black',\n borderRight: '0px solid black',\n borderBottom: '0px solid black',\n borderLeft: '0px solid black',\n },\n defaultValue,\n ),\n ),\n )\n}\n\nconst floor =\n (d: number) =>\n (v: number): number =>\n Math.floor(10 ** d * v) / 10 ** d\n\nexport function responsiveGridItem(\n breakpoints: Breakpoints,\n props: {\n grid: ResponsiveValue<{ spans: number[][]; count: number }>\n index: number\n columnGap?: ResponsiveValue<LengthData>\n rowGap?: ResponsiveValue<LengthData>\n },\n): CSSObject {\n return {\n display: 'flex',\n ...responsiveStyle(\n breakpoints,\n [props.grid, props.columnGap, props.rowGap] as const,\n ([\n { spans, count } = { spans: [[12]], count: 12 },\n columnGap = { value: 0, unit: 'px' },\n rowGap = { value: 0, unit: 'px' },\n ]) => {\n const [rowIndex, columnIndex] = getIndexes(spans, props.index)\n const firstCol = columnIndex === 0\n const lastCol = columnIndex === spans[rowIndex].length - 1\n const span = spans[rowIndex][columnIndex]\n const fraction = floor(5)(span / count)\n const width = `${fraction} * (100% + ${columnGap.value}${columnGap.unit})`\n const excessWidth = `${Number(firstCol) + Number(lastCol)} * ${columnGap.value}${\n columnGap.unit\n } / 2`\n const iePrecisionError = '0.01px'\n const flexBasis = `calc(${width} - ${excessWidth} - ${iePrecisionError})`\n const firstRow = rowIndex === 0\n const lastRow = rowIndex === spans.length - 1\n\n return span === 0\n ? { display: 'none' }\n : {\n flexBasis,\n minWidth: flexBasis,\n // NOTE: IE11 width breaks without max width\n // https://github.com/philipwalton/flexbugs/issues/3\n maxWidth: flexBasis,\n paddingLeft: firstCol ? 0 : `${columnGap.value / 2}${columnGap.unit}`,\n paddingRight: lastCol ? 0 : `${columnGap.value / 2}${columnGap.unit}`,\n paddingTop: firstRow ? 0 : `${rowGap.value / 2}${rowGap.unit}`,\n paddingBottom: lastRow ? 0 : `${rowGap.value / 2}${rowGap.unit}`,\n }\n },\n ),\n }\n}\n\nexport function useResponsiveGridItem(\n ...args: DropFirst<Parameters<typeof responsiveGridItem>>\n): CSSObject {\n return responsiveGridItem(useBreakpoints(), ...args)\n}\n\nconst getBoxShadow = (shadows: BoxShadow) =>\n shadows\n .map(\n ({ payload: { inset, offsetX, offsetY, blurRadius, spreadRadius, color } }) =>\n `${inset ? 'inset ' : ''}${offsetX.toFixed(1)}px ${offsetY.toFixed(\n 1,\n )}px ${blurRadius}px ${spreadRadius}px ${\n color != null ? colorToString(color) : 'rgba(0,0,0,0.2)'\n }`,\n )\n .filter(Boolean)\n .join()\n\nexport function responsiveShadow(\n breakpoints: Breakpoints,\n value: ResponsiveBoxShadow | undefined,\n): CSSObject {\n return responsiveStyle(breakpoints, [value], ([shadow = []]) => ({\n boxShadow: getBoxShadow(shadow),\n }))\n}\n\nexport function useResponsiveShadow(\n ...args: DropFirst<Parameters<typeof responsiveShadow>>\n): CSSObject {\n return responsiveShadow(useBreakpoints(), ...args)\n}\n\nexport function responsiveTextStyle(\n breakpoints: Breakpoints,\n value: ResponsiveTextStyleData | undefined,\n): CSSObject {\n return responsiveStyle(\n breakpoints,\n [value],\n ([\n textStyle = {\n fontFamily: null,\n letterSpacing: null,\n fontSize: null,\n fontWeight: null,\n textTransform: [],\n fontStyle: [],\n },\n ]) => {\n const {\n fontSize,\n fontWeight,\n fontStyle = [],\n textTransform = [],\n letterSpacing,\n fontFamily,\n } = textStyle\n\n return {\n ...(fontFamily == null ? {} : { fontFamily: `\"${fontFamily}\"` }),\n ...(fontWeight == null ? {} : { fontWeight }),\n ...(letterSpacing == null ? {} : { letterSpacing }),\n ...(fontSize == null ? {} : { fontSize: `${fontSize.value}${fontSize.unit}` }),\n ...(textTransform.includes('uppercase') ? { textTransform: 'uppercase' } : {}),\n ...(fontStyle.includes('italic') ? { fontStyle: 'italic' } : {}),\n }\n },\n )\n}\n\nexport function useResponsiveTextStyle(\n ...args: DropFirst<Parameters<typeof responsiveTextStyle>>\n): CSSObject {\n return responsiveTextStyle(useBreakpoints(), ...args)\n}\n"],"mappings":"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","names":["joinResponsiveValues"]}
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/utils/responsive-style.ts"],"sourcesContent":["import { WidthProperty } from 'csstype'\nimport { CSSObject } from '@emotion/css'\n\nimport type { ResponsiveValueType as ExtractResponsiveValue } from '@makeswift/controls'\n\nimport type {\n LengthData,\n ResponsiveBorderRadiusData,\n ResponsiveMarginData,\n ResponsivePaddingData,\n ResponsiveValue,\n ResponsiveLengthData,\n ResponsiveTextStyleData,\n} from '@makeswift/prop-controllers'\n\nimport {\n FallbackStrategy,\n join as joinResponsiveValues,\n type Breakpoints,\n} from '@makeswift/controls'\n\nimport { getBreakpoint, getBreakpointMediaQuery } from '../../state/modules/breakpoints'\n\nimport { useBreakpoints } from '../../runtimes/react/hooks/use-breakpoints'\n\nimport { getIndexes } from './columns'\nimport { PaddingPropertyData, paddingPropertyDataToStyle } from '../../css/padding'\nimport { MarginPropertyData, marginPropertyDataToStyle } from '../../css/margin'\nimport { BorderRadiusPropertyData, borderRadiusPropertyDataToStyle } from '../../css/border-radius'\nimport { BorderPropertyData, borderPropertyDataToStyle } from '../../css/border'\nimport { BorderPropControllerData } from '../hooks/useBorder'\nimport { colorToString } from './colorToString'\nimport { BoxShadow, ResponsiveBoxShadow } from '../hooks'\nimport { DropFirst } from './drop-first'\n\nexport function responsiveStyle<V, A extends ReadonlyArray<ResponsiveValue<V> | null | undefined>>(\n breakpoints: Breakpoints,\n responsiveValues: A,\n join: (values: { [K in keyof A]: ExtractResponsiveValue<A[K]> | undefined }) => CSSObject,\n strategy?: FallbackStrategy<V>,\n): CSSObject {\n return joinResponsiveValues(breakpoints, responsiveValues, join, strategy).reduce(\n (acc, { deviceId, value }) => {\n const breakpoint = getBreakpoint(breakpoints, deviceId)\n const mediaQuery = getBreakpointMediaQuery(breakpoint)\n\n return {\n ...acc,\n [mediaQuery]: {\n ...(acc[mediaQuery] as CSSObject),\n ...value,\n },\n }\n },\n {} as CSSObject,\n )\n}\n\nexport function useResponsiveStyle<\n V,\n A extends ReadonlyArray<ResponsiveValue<V> | null | undefined>,\n>(\n responsiveValues: A,\n join: (values: { [K in keyof A]: ExtractResponsiveValue<A[K]> | undefined }) => CSSObject,\n strategy?: FallbackStrategy<V>,\n): CSSObject {\n return responsiveStyle(useBreakpoints(), responsiveValues, join, strategy)\n}\n\nexport function responsiveWidth(\n breakpoints: Breakpoints,\n widthData: ResponsiveLengthData | undefined,\n defaultValue: LengthData | WidthProperty<string | number> = '100%',\n): CSSObject {\n return {\n maxWidth: '100%',\n ...responsiveStyle(breakpoints, [widthData], ([width = defaultValue]) => ({\n width: typeof width === 'object' ? `${width.value}${width.unit}` : width,\n })),\n }\n}\n\nexport function useResponsiveWidth(\n ...args: DropFirst<Parameters<typeof responsiveWidth>>\n): CSSObject {\n return responsiveWidth(useBreakpoints(), ...args)\n}\n\nexport function responsivePadding(\n breakpoints: Breakpoints,\n paddingData: ResponsivePaddingData | undefined,\n defaultValue: PaddingPropertyData = {} as PaddingPropertyData,\n): CSSObject {\n return responsiveStyle(breakpoints, [paddingData], ([padding = {} as PaddingPropertyData]) =>\n paddingPropertyDataToStyle(\n padding,\n Object.assign(\n { paddingTop: 0, paddingRight: 0, paddingBottom: 0, paddingLeft: 0 },\n defaultValue,\n ),\n ),\n )\n}\n\nexport function useResponsivePadding(\n ...args: DropFirst<Parameters<typeof responsivePadding>>\n): CSSObject {\n return responsivePadding(useBreakpoints(), ...args)\n}\n\nexport function responsiveMargin(\n breakpoints: Breakpoints,\n marginData: ResponsiveMarginData | undefined,\n defaultValue: MarginPropertyData = {} as MarginPropertyData,\n): CSSObject {\n return responsiveStyle(breakpoints, [marginData], ([margin = {} as MarginPropertyData]) =>\n marginPropertyDataToStyle(\n margin,\n Object.assign(\n { marginTop: 0, marginRight: 'auto', marginBottom: 0, marginLeft: 'auto' },\n defaultValue,\n ),\n ),\n )\n}\n\nexport function useResponsiveMargin(\n ...args: DropFirst<Parameters<typeof responsiveMargin>>\n): CSSObject {\n return responsiveMargin(useBreakpoints(), ...args)\n}\n\nexport function responsiveBorderRadius(\n breakpoints: Breakpoints,\n borderRadiusData: ResponsiveBorderRadiusData | undefined,\n defaultValue: BorderRadiusPropertyData = {} as BorderRadiusPropertyData,\n): CSSObject {\n return responsiveStyle(breakpoints, [borderRadiusData], ([borderRadius = {}]) =>\n borderRadiusPropertyDataToStyle(\n borderRadius,\n Object.assign(\n {\n borderTopLeftRadius: 0,\n borderTopRightRadius: 0,\n borderBottomRightRadius: 0,\n borderBottomLeftRadius: 0,\n },\n defaultValue,\n ),\n ),\n )\n}\n\nexport function useResponsiveBorderRadius(\n ...args: DropFirst<Parameters<typeof responsiveBorderRadius>>\n): CSSObject {\n return responsiveBorderRadius(useBreakpoints(), ...args)\n}\n\nexport function useResponsiveBorder(\n borderData: BorderPropControllerData | undefined,\n defaultValue: BorderPropertyData = {},\n): CSSObject {\n return useResponsiveStyle([borderData], ([border = {}]) =>\n borderPropertyDataToStyle(\n border,\n Object.assign(\n {\n borderTop: '0px solid black',\n borderRight: '0px solid black',\n borderBottom: '0px solid black',\n borderLeft: '0px solid black',\n },\n defaultValue,\n ),\n ),\n )\n}\n\nconst floor =\n (d: number) =>\n (v: number): number =>\n Math.floor(10 ** d * v) / 10 ** d\n\nexport function responsiveGridItem(\n breakpoints: Breakpoints,\n props: {\n grid: ResponsiveValue<{ spans: number[][]; count: number }>\n index: number\n columnGap?: ResponsiveValue<LengthData>\n rowGap?: ResponsiveValue<LengthData>\n },\n): CSSObject {\n return {\n display: 'flex',\n ...responsiveStyle(\n breakpoints,\n [props.grid, props.columnGap, props.rowGap] as const,\n ([\n { spans, count } = { spans: [[12]], count: 12 },\n columnGap = { value: 0, unit: 'px' },\n rowGap = { value: 0, unit: 'px' },\n ]) => {\n const [rowIndex, columnIndex] = getIndexes(spans, props.index)\n const firstCol = columnIndex === 0\n const lastCol = columnIndex === spans[rowIndex].length - 1\n const span = spans[rowIndex][columnIndex]\n const fraction = floor(5)(span / count)\n const width = `${fraction} * (100% + ${columnGap.value}${columnGap.unit})`\n const excessWidth = `${Number(firstCol) + Number(lastCol)} * ${columnGap.value}${\n columnGap.unit\n } / 2`\n const iePrecisionError = '0.01px'\n const flexBasis = `calc(${width} - ${excessWidth} - ${iePrecisionError})`\n const firstRow = rowIndex === 0\n const lastRow = rowIndex === spans.length - 1\n\n return span === 0\n ? { display: 'none' }\n : {\n flexBasis,\n minWidth: flexBasis,\n // NOTE: IE11 width breaks without max width\n // https://github.com/philipwalton/flexbugs/issues/3\n maxWidth: flexBasis,\n paddingLeft: firstCol ? 0 : `${columnGap.value / 2}${columnGap.unit}`,\n paddingRight: lastCol ? 0 : `${columnGap.value / 2}${columnGap.unit}`,\n paddingTop: firstRow ? 0 : `${rowGap.value / 2}${rowGap.unit}`,\n paddingBottom: lastRow ? 0 : `${rowGap.value / 2}${rowGap.unit}`,\n }\n },\n ),\n }\n}\n\nexport function useResponsiveGridItem(\n ...args: DropFirst<Parameters<typeof responsiveGridItem>>\n): CSSObject {\n return responsiveGridItem(useBreakpoints(), ...args)\n}\n\nconst getBoxShadow = (shadows: BoxShadow) =>\n shadows\n .map(\n ({ payload: { inset, offsetX, offsetY, blurRadius, spreadRadius, color } }) =>\n `${inset ? 'inset ' : ''}${offsetX.toFixed(1)}px ${offsetY.toFixed(\n 1,\n )}px ${blurRadius}px ${spreadRadius}px ${\n color != null ? colorToString(color) : 'rgba(0,0,0,0.2)'\n }`,\n )\n .filter(Boolean)\n .join()\n\nexport function responsiveShadow(\n breakpoints: Breakpoints,\n value: ResponsiveBoxShadow | undefined,\n): CSSObject {\n return responsiveStyle(breakpoints, [value], ([shadow = []]) => ({\n boxShadow: getBoxShadow(shadow),\n }))\n}\n\nexport function useResponsiveShadow(\n ...args: DropFirst<Parameters<typeof responsiveShadow>>\n): CSSObject {\n return responsiveShadow(useBreakpoints(), ...args)\n}\n\nexport function responsiveTextStyle(\n breakpoints: Breakpoints,\n value: ResponsiveTextStyleData | undefined,\n): CSSObject {\n return responsiveStyle(\n breakpoints,\n [value],\n ([\n textStyle = {\n fontFamily: null,\n letterSpacing: null,\n fontSize: null,\n fontWeight: null,\n textTransform: [],\n fontStyle: [],\n },\n ]) => {\n const {\n fontSize,\n fontWeight,\n fontStyle = [],\n textTransform = [],\n letterSpacing,\n fontFamily,\n } = textStyle\n\n return {\n ...(fontFamily == null ? {} : { fontFamily: `\"${fontFamily}\"` }),\n ...(fontWeight == null ? {} : { fontWeight }),\n ...(letterSpacing == null ? {} : { letterSpacing }),\n ...(fontSize == null ? {} : { fontSize: `${fontSize.value}${fontSize.unit}` }),\n ...(textTransform.includes('uppercase') ? { textTransform: 'uppercase' } : {}),\n ...(fontStyle.includes('italic') ? { fontStyle: 'italic' } : {}),\n }\n },\n )\n}\n\nexport function useResponsiveTextStyle(\n ...args: DropFirst<Parameters<typeof responsiveTextStyle>>\n): CSSObject {\n return responsiveTextStyle(useBreakpoints(), ...args)\n}\n"],"mappings":"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","names":["joinResponsiveValues"]}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
2
3
|
var __defProp = Object.defineProperty;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
5
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
8
|
var __export = (target, all) => {
|
|
7
9
|
for (var name in all)
|
|
@@ -15,14 +17,32 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
15
17
|
}
|
|
16
18
|
return to;
|
|
17
19
|
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
18
28
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
29
|
var link_exports = {};
|
|
20
30
|
__export(link_exports, {
|
|
21
31
|
Link: () => Link,
|
|
22
|
-
LinkDefinition: () => LinkDefinition
|
|
32
|
+
LinkDefinition: () => LinkDefinition,
|
|
33
|
+
validateElementRef: () => validateElementRef
|
|
23
34
|
});
|
|
24
35
|
module.exports = __toCommonJS(link_exports);
|
|
36
|
+
var import_scroll_into_view_if_needed = __toESM(require("scroll-into-view-if-needed"));
|
|
25
37
|
var import_controls = require("@makeswift/controls");
|
|
38
|
+
function validateElementRef(href) {
|
|
39
|
+
try {
|
|
40
|
+
const hash = new URL(`http://www.example.com/${href}`).hash;
|
|
41
|
+
return href === hash ? hash : void 0;
|
|
42
|
+
} catch (error) {
|
|
43
|
+
return void 0;
|
|
44
|
+
}
|
|
45
|
+
}
|
|
26
46
|
class LinkDefinition extends import_controls.LinkDefinition {
|
|
27
47
|
static deserialize(data) {
|
|
28
48
|
if (data.type !== LinkDefinition.type) {
|
|
@@ -31,6 +51,29 @@ class LinkDefinition extends import_controls.LinkDefinition {
|
|
|
31
51
|
const { config } = LinkDefinition.schema.definition.parse(data);
|
|
32
52
|
return Link(config);
|
|
33
53
|
}
|
|
54
|
+
resolveOnClick(data, href, scrollOptions) {
|
|
55
|
+
const onClick = (event) => {
|
|
56
|
+
if (event.defaultPrevented)
|
|
57
|
+
return;
|
|
58
|
+
if (data && data.type === "SCROLL_TO_ELEMENT") {
|
|
59
|
+
const hash = validateElementRef(href);
|
|
60
|
+
if (hash == null) {
|
|
61
|
+
console.error(`Scroll-to-element link received invalid href: ${href}`);
|
|
62
|
+
return;
|
|
63
|
+
}
|
|
64
|
+
event.preventDefault();
|
|
65
|
+
const view = event.view;
|
|
66
|
+
(0, import_scroll_into_view_if_needed.default)(view.document.querySelector(hash), {
|
|
67
|
+
behavior: "smooth",
|
|
68
|
+
block: scrollOptions?.block
|
|
69
|
+
});
|
|
70
|
+
if (view.location.hash !== hash)
|
|
71
|
+
view.history.pushState({}, "", hash);
|
|
72
|
+
}
|
|
73
|
+
};
|
|
74
|
+
onClick.$scrollOptions = scrollOptions;
|
|
75
|
+
return onClick;
|
|
76
|
+
}
|
|
34
77
|
}
|
|
35
78
|
function Link(config) {
|
|
36
79
|
return new LinkDefinition(config ?? {});
|
|
@@ -38,6 +81,7 @@ function Link(config) {
|
|
|
38
81
|
// Annotate the CommonJS export names for ESM import in node:
|
|
39
82
|
0 && (module.exports = {
|
|
40
83
|
Link,
|
|
41
|
-
LinkDefinition
|
|
84
|
+
LinkDefinition,
|
|
85
|
+
validateElementRef
|
|
42
86
|
});
|
|
43
87
|
//# sourceMappingURL=link.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/controls/link.ts"],"sourcesContent":["import { type MouseEvent } from 'react'\nimport {
|
|
1
|
+
{"version":3,"sources":["../../../src/controls/link.ts"],"sourcesContent":["import { z } from 'zod'\nimport { type MouseEvent } from 'react'\nimport scrollIntoView from 'scroll-into-view-if-needed'\n\nimport {\n type DeserializedRecord,\n LinkDefinition as BaseLinkDefinition,\n LinkSchema,\n} from '@makeswift/controls'\n\ntype DataType = z.infer<typeof LinkDefinition.schema.data>\ntype ScrollOptions = z.infer<typeof LinkSchema.scrollOptions>\ntype MouseEventType = MouseEvent<Element>\n\nexport function validateElementRef(href: string) {\n try {\n const hash = new URL(`http://www.example.com/${href}`).hash\n return href === hash ? hash : undefined\n } catch (error) {\n return undefined\n }\n}\n\nexport class LinkDefinition extends BaseLinkDefinition<MouseEventType> {\n static deserialize(data: DeserializedRecord): LinkDefinition {\n if (data.type !== LinkDefinition.type) {\n throw new Error(`Link: expected type ${LinkDefinition.type}, got ${data.type}`)\n }\n\n const { config } = LinkDefinition.schema.definition.parse(data)\n return Link(config)\n }\n\n resolveOnClick(\n data: DataType | undefined,\n href: string,\n scrollOptions: ScrollOptions | undefined,\n ) {\n const onClick = (event: MouseEvent<Element>) => {\n if (event.defaultPrevented) return\n\n if (data && data.type === 'SCROLL_TO_ELEMENT') {\n const hash = validateElementRef(href)\n if (hash == null) {\n console.error(`Scroll-to-element link received invalid href: ${href}`)\n return\n }\n\n event.preventDefault()\n const view = event.view as unknown as Window\n\n scrollIntoView(view.document.querySelector(hash)!, {\n behavior: 'smooth',\n block: scrollOptions?.block,\n })\n\n if (view.location.hash !== hash) view.history.pushState({}, '', hash)\n }\n }\n\n onClick.$scrollOptions = scrollOptions\n return onClick\n }\n}\n\nexport function Link(config?: { label?: string }): LinkDefinition {\n return new LinkDefinition(config ?? {})\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,wCAA2B;AAE3B,sBAIO;AAMA,SAAS,mBAAmB,MAAc;AAC/C,MAAI;AACF,UAAM,OAAO,IAAI,IAAI,0BAA0B,IAAI,EAAE,EAAE;AACvD,WAAO,SAAS,OAAO,OAAO;AAAA,EAChC,SAAS,OAAO;AACd,WAAO;AAAA,EACT;AACF;AAEO,MAAM,uBAAuB,gBAAAA,eAAmC;AAAA,EACrE,OAAO,YAAY,MAA0C;AAC3D,QAAI,KAAK,SAAS,eAAe,MAAM;AACrC,YAAM,IAAI,MAAM,uBAAuB,eAAe,IAAI,SAAS,KAAK,IAAI,EAAE;AAAA,IAChF;AAEA,UAAM,EAAE,OAAO,IAAI,eAAe,OAAO,WAAW,MAAM,IAAI;AAC9D,WAAO,KAAK,MAAM;AAAA,EACpB;AAAA,EAEA,eACE,MACA,MACA,eACA;AACA,UAAM,UAAU,CAAC,UAA+B;AAC9C,UAAI,MAAM;AAAkB;AAE5B,UAAI,QAAQ,KAAK,SAAS,qBAAqB;AAC7C,cAAM,OAAO,mBAAmB,IAAI;AACpC,YAAI,QAAQ,MAAM;AAChB,kBAAQ,MAAM,iDAAiD,IAAI,EAAE;AACrE;AAAA,QACF;AAEA,cAAM,eAAe;AACrB,cAAM,OAAO,MAAM;AAEnB,8CAAAC,SAAe,KAAK,SAAS,cAAc,IAAI,GAAI;AAAA,UACjD,UAAU;AAAA,UACV,OAAO,eAAe;AAAA,QACxB,CAAC;AAED,YAAI,KAAK,SAAS,SAAS;AAAM,eAAK,QAAQ,UAAU,CAAC,GAAG,IAAI,IAAI;AAAA,MACtE;AAAA,IACF;AAEA,YAAQ,iBAAiB;AACzB,WAAO;AAAA,EACT;AACF;AAEO,SAAS,KAAK,QAA6C;AAChE,SAAO,IAAI,eAAe,UAAU,CAAC,CAAC;AACxC;","names":["BaseLinkDefinition","scrollIntoView"]}
|
|
@@ -23,6 +23,7 @@ __export(rich_text_exports, {
|
|
|
23
23
|
});
|
|
24
24
|
module.exports = __toCommonJS(rich_text_exports);
|
|
25
25
|
var import_controls = require("@makeswift/controls");
|
|
26
|
+
var import_rich_text = require("../../runtimes/react/controls/rich-text");
|
|
26
27
|
var import_control = require("./control");
|
|
27
28
|
class BaseDefinition extends import_controls.RichTextV1Definition {
|
|
28
29
|
}
|
|
@@ -34,6 +35,17 @@ class Definition extends BaseDefinition {
|
|
|
34
35
|
return new class RichTextV1 extends Definition {
|
|
35
36
|
}();
|
|
36
37
|
}
|
|
38
|
+
resolveValue(data, _resolver, _stylesheet, control) {
|
|
39
|
+
const stableValue = (0, import_controls.StableValue)({
|
|
40
|
+
name: Definition.type,
|
|
41
|
+
read: () => (0, import_rich_text.renderRichText)(data, control ?? null)
|
|
42
|
+
});
|
|
43
|
+
return {
|
|
44
|
+
...stableValue,
|
|
45
|
+
triggerResolve: async () => {
|
|
46
|
+
}
|
|
47
|
+
};
|
|
48
|
+
}
|
|
37
49
|
createInstance(sendMessage) {
|
|
38
50
|
return new import_control.RichTextControl(sendMessage);
|
|
39
51
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/controls/rich-text/rich-text.ts"],"sourcesContent":["import { ReactNode } from 'react'\nimport {
|
|
1
|
+
{"version":3,"sources":["../../../../src/controls/rich-text/rich-text.ts"],"sourcesContent":["import { ReactNode } from 'react'\nimport {\n RichTextV1Definition,\n SendMessage,\n StableValue,\n type DeserializedRecord,\n type ResourceResolver,\n type Stylesheet,\n type Resolvable,\n type DataType,\n} from '@makeswift/controls'\n\nimport { renderRichText } from '../../runtimes/react/controls/rich-text'\n\nimport { RichTextControl } from './control'\n\nabstract class BaseDefinition extends RichTextV1Definition<ReactNode, RichTextControl> {}\n\nclass Definition extends BaseDefinition {\n static deserialize(data: DeserializedRecord): Definition {\n if (data.type !== Definition.type) {\n throw new Error(`RichTextV1: expected type ${Definition.type}, got ${data.type}`)\n }\n\n return new (class RichTextV1 extends Definition {})()\n }\n\n resolveValue(\n data: DataType<BaseDefinition> | undefined,\n _resolver: ResourceResolver,\n _stylesheet: Stylesheet,\n control?: RichTextControl,\n ): Resolvable<ReactNode | undefined> {\n const stableValue = StableValue({\n name: Definition.type,\n read: () => renderRichText(data, control ?? null),\n })\n\n return {\n ...stableValue,\n triggerResolve: async () => {},\n }\n }\n\n createInstance(sendMessage: SendMessage<any>) {\n return new RichTextControl(sendMessage)\n }\n}\n\nexport { Definition as RichTextV1Definition, RichTextControl as RichTextV1Control }\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,sBASO;AAEP,uBAA+B;AAE/B,qBAAgC;AAEhC,MAAe,uBAAuB,qCAAiD;AAAC;AAExF,MAAM,mBAAmB,eAAe;AAAA,EACtC,OAAO,YAAY,MAAsC;AACvD,QAAI,KAAK,SAAS,WAAW,MAAM;AACjC,YAAM,IAAI,MAAM,6BAA6B,WAAW,IAAI,SAAS,KAAK,IAAI,EAAE;AAAA,IAClF;AAEA,WAAO,IAAK,MAAM,mBAAmB,WAAW;AAAA,IAAC,EAAG;AAAA,EACtD;AAAA,EAEA,aACE,MACA,WACA,aACA,SACmC;AACnC,UAAM,kBAAc,6BAAY;AAAA,MAC9B,MAAM,WAAW;AAAA,MACjB,MAAM,UAAM,iCAAe,MAAM,WAAW,IAAI;AAAA,IAClD,CAAC;AAED,WAAO;AAAA,MACL,GAAG;AAAA,MACH,gBAAgB,YAAY;AAAA,MAAC;AAAA,IAC/B;AAAA,EACF;AAAA,EAEA,eAAe,aAA+B;AAC5C,WAAO,IAAI,+BAAgB,WAAW;AAAA,EACxC;AACF;","names":[]}
|
|
@@ -43,6 +43,7 @@ var import_BlockPlugin = require("../../slate/BlockPlugin");
|
|
|
43
43
|
var import_TypographyPlugin = require("../../slate/TypographyPlugin");
|
|
44
44
|
var import_InlineModePlugin = require("../../slate/InlineModePlugin");
|
|
45
45
|
var import_utils = require("../../slate/utils");
|
|
46
|
+
var import_rich_text_v2 = require("../../runtimes/react/controls/rich-text-v2");
|
|
46
47
|
var import_plugin = require("./plugin");
|
|
47
48
|
var import_control = require("./control");
|
|
48
49
|
var import_translation = require("./translation");
|
|
@@ -98,6 +99,17 @@ class Definition extends import_controls.RichTextDefinition {
|
|
|
98
99
|
createInstance(sendMessage) {
|
|
99
100
|
return new import_control.RichTextV2Control(sendMessage, this);
|
|
100
101
|
}
|
|
102
|
+
resolveValue(data, _resolver, _stylesheet, control) {
|
|
103
|
+
const stableValue = (0, import_controls.StableValue)({
|
|
104
|
+
name: Definition.type,
|
|
105
|
+
read: () => (0, import_rich_text_v2.renderRichTextV2)(data, this, control ?? null)
|
|
106
|
+
});
|
|
107
|
+
return {
|
|
108
|
+
...stableValue,
|
|
109
|
+
triggerResolve: async () => {
|
|
110
|
+
}
|
|
111
|
+
};
|
|
112
|
+
}
|
|
101
113
|
getTranslatableData(data) {
|
|
102
114
|
return (0, import_translation.getTranslatableData)(Definition.dataToNodes(data), this.config.plugins);
|
|
103
115
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/controls/rich-text-v2/rich-text-v2.ts"],"sourcesContent":["import { ReactNode } from 'react'\nimport { z } from 'zod'\n// @ts-expect-error: there are no types for 'corporate-ipsum'\nimport ipsum from 'corporate-ipsum'\n\nimport {\n RichTextDefinition as BaseRichTextDefinition,\n type Data,\n type SendMessage,\n type SerializedRecord,\n type DeserializedRecord,\n type SchemaType,\n type SchemaTypeAny,\n type MergeTranslatableDataContext,\n type RichTextPluginControl,\n type
|
|
1
|
+
{"version":3,"sources":["../../../../src/controls/rich-text-v2/rich-text-v2.ts"],"sourcesContent":["import { ReactNode } from 'react'\nimport { z } from 'zod'\n// @ts-expect-error: there are no types for 'corporate-ipsum'\nimport ipsum from 'corporate-ipsum'\n\nimport {\n RichTextDefinition as BaseRichTextDefinition,\n isNotNil,\n ControlDefinition,\n SerializationSchema,\n serialize,\n StableValue,\n type Data,\n type Resolvable,\n type SendMessage,\n type SerializedRecord,\n type DeserializedRecord,\n type SchemaType,\n type SchemaTypeAny,\n type MergeTranslatableDataContext,\n type RichTextPluginControl,\n type ResourceResolver,\n type Stylesheet,\n type RichTextMode,\n} from '@makeswift/controls'\n\nimport { LinkPlugin } from '../../slate/LinkPlugin'\nimport { InlinePlugin } from '../../slate/InlinePlugin'\nimport { TextAlignPlugin } from '../../slate/TextAlignPlugin'\nimport { BlockPlugin } from '../../slate/BlockPlugin'\nimport { TypographyPlugin } from '../../slate/TypographyPlugin'\nimport { InlineModePlugin } from '../../slate/InlineModePlugin'\nimport { toText } from '../../slate/utils'\n\nimport { renderRichTextV2 } from '../../runtimes/react/controls/rich-text-v2'\n\nimport { RichTextV2Plugin, Plugin } from './plugin'\nimport { RichTextV2Control } from './control'\nimport {\n getTranslatableData,\n mergeTranslatedNodes,\n type RichTextTranslationDto,\n} from './translation'\n\ntype DataType = z.infer<typeof Definition.schema.data>\ntype DataV2Type = z.infer<typeof Definition.schema.dataV2>\ntype InstanceType = RichTextV2Control\ntype UserConfig = z.infer<typeof Definition.schema.userConfig>\ntype Config = UserConfig & {\n defaultValue: string\n plugins: RichTextV2Plugin[]\n}\n\nclass Definition extends BaseRichTextDefinition<ReactNode, Config, InstanceType> {\n constructor({ mode, defaultValue }: UserConfig, plugins?: RichTextV2Plugin[]) {\n super({\n mode,\n defaultValue:\n defaultValue ??\n (mode === Definition.Mode.Inline ? 'Edit this text' : Definition.generateParagraph()),\n plugins:\n plugins ??\n (mode === Definition.Mode.Inline\n ? [InlineModePlugin()]\n : [BlockPlugin(), TypographyPlugin(), TextAlignPlugin(), InlinePlugin(), LinkPlugin()]),\n })\n }\n\n static generateParagraph(): string {\n return ipsum(3)\n }\n\n static deserialize(\n data: DeserializedRecord,\n deserializeCallback: (r: DeserializedRecord) => ControlDefinition,\n ): RichTextV2Definition {\n if (data.type !== Definition.type) {\n throw new Error(`RichText: expected type ${Definition.type}, got ${data.type}`)\n }\n\n const { config } = Definition.fullSchema({\n pluginDef: SerializationSchema.deserializedRecord,\n }).definition.parse(data)\n\n const { plugins, ...userConfig } = config\n\n return new RichTextV2Definition(\n userConfig,\n plugins.map(({ control }) =>\n control ? { control: { definition: deserializeCallback(control?.definition) } } : {},\n ),\n )\n }\n\n static fullSchema<S extends SchemaTypeAny>({ pluginDef }: { pluginDef: S }) {\n const baseSchema = super.schema\n const plugin = z.object({\n control: z\n .object({\n definition: pluginDef,\n })\n .optional(),\n })\n\n const config = baseSchema.userConfig.extend({\n defaultValue: z.string(),\n plugins: z.array(plugin),\n })\n\n return {\n ...baseSchema,\n config,\n definition: z.object({\n type: baseSchema.type,\n config,\n }),\n }\n }\n\n get configSchema(): SchemaType<Config> {\n return Definition.fullSchema({ pluginDef: z.any() as SchemaType<ControlDefinition> }).config\n }\n\n createInstance(sendMessage: SendMessage): InstanceType {\n return new RichTextV2Control(sendMessage, this)\n }\n\n resolveValue(\n data: DataType | undefined,\n _resolver: ResourceResolver,\n _stylesheet: Stylesheet,\n control?: InstanceType,\n ): Resolvable<ReactNode | undefined> {\n const stableValue = StableValue({\n name: Definition.type,\n read: () => renderRichTextV2(data, this, control ?? null),\n })\n\n return {\n ...stableValue,\n triggerResolve: async () => {},\n }\n }\n\n getTranslatableData(data: DataType): Data {\n return getTranslatableData(Definition.dataToNodes(data), this.config.plugins)\n }\n\n mergeTranslatedData(\n data: DataType,\n translatedData: Data,\n _context: MergeTranslatableDataContext,\n ): Data {\n if (translatedData == null) return data as Data\n\n const { descendants, ...rest } = Definition.normalizeData(data)\n return {\n ...rest,\n descendants: mergeTranslatedNodes(\n descendants,\n translatedData as RichTextTranslationDto,\n this.config.plugins,\n ),\n }\n }\n\n serialize(): [SerializedRecord, Transferable[]] {\n const { plugins, ...config } = this.config\n\n // serialize only the plugin control definition, if any\n const pluginDefs = plugins.map(({ control }) =>\n control\n ? {\n control: {\n definition: control.definition,\n // FIXME: remove getValue/onChange stubs once we released a version of the builder\n // built against the runtime where these can be optional\n getValue: () => undefined,\n onChange: () => {},\n },\n }\n : {},\n )\n\n return serialize(\n { ...config, plugins: pluginDefs },\n {\n type: Definition.type,\n },\n )\n }\n\n get pluginControls(): RichTextPluginControl[] {\n return this.config.plugins.map(plugin => plugin.control).filter(isNotNil)\n }\n\n pluginControlAt(index: number): RichTextPluginControl | undefined {\n return this.pluginControls[index]\n }\n\n toText(data: DataType | undefined): string {\n if (data == null) return ''\n return toText(Definition.dataToNodes(data), this.config.mode ?? Definition.Mode.Block)\n }\n}\n\nexport class RichTextV2Definition extends Definition {}\n\nexport function RichText(config?: UserConfig): RichTextV2Definition {\n return new RichTextV2Definition(config ?? {})\n}\n\nRichText.Mode = Definition.Mode\nRichText.isV1Data = Definition.isV1Data\nRichText.dataToNodes = Definition.dataToNodes\nRichText.Plugin = Plugin\n\nexport { RichTextMode as RichTextV2Mode, type DataV2Type as RichTextDataV2, RichTextV2Control }\n"],"mappings":"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","names":["BaseRichTextDefinition","ipsum"]}
|
|
@@ -24,6 +24,7 @@ __export(slot_exports, {
|
|
|
24
24
|
});
|
|
25
25
|
module.exports = __toCommonJS(slot_exports);
|
|
26
26
|
var import_controls = require("@makeswift/controls");
|
|
27
|
+
var import_slot = require("../runtimes/react/controls/slot");
|
|
27
28
|
class BaseDefinition extends import_controls.SlotDefinition {
|
|
28
29
|
}
|
|
29
30
|
class SlotDefinition extends BaseDefinition {
|
|
@@ -33,6 +34,17 @@ class SlotDefinition extends BaseDefinition {
|
|
|
33
34
|
}
|
|
34
35
|
return Slot();
|
|
35
36
|
}
|
|
37
|
+
resolveValue(data, _resolver, _stylesheet, control) {
|
|
38
|
+
const stableValue = (0, import_controls.StableValue)({
|
|
39
|
+
name: SlotDefinition.type,
|
|
40
|
+
read: () => (0, import_slot.renderSlot)({ data, control: control ?? null })
|
|
41
|
+
});
|
|
42
|
+
return {
|
|
43
|
+
...stableValue,
|
|
44
|
+
triggerResolve: async () => {
|
|
45
|
+
}
|
|
46
|
+
};
|
|
47
|
+
}
|
|
36
48
|
}
|
|
37
49
|
function Slot() {
|
|
38
50
|
return new SlotDefinition();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/controls/slot.ts"],"sourcesContent":["import { ReactNode } from 'react'\nimport {\n SlotDefinition as BaseSlotDefinition,\n SlotControl,\n type DeserializedRecord,\n} from '@makeswift/controls'\n\nabstract class BaseDefinition extends BaseSlotDefinition<ReactNode> {}\n\nexport class SlotDefinition extends BaseDefinition {\n static deserialize(data: DeserializedRecord): SlotDefinition {\n if (data.type !== SlotDefinition.type) {\n throw new Error(`Slot: expected type ${SlotDefinition.type}, got ${data.type}`)\n }\n\n return Slot()\n }\n}\n\nexport function Slot(): SlotDefinition {\n return new SlotDefinition()\n}\n\nexport { SlotControl }\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,
|
|
1
|
+
{"version":3,"sources":["../../../src/controls/slot.ts"],"sourcesContent":["import { ReactNode } from 'react'\nimport {\n SlotDefinition as BaseSlotDefinition,\n SlotControl,\n StableValue,\n type DeserializedRecord,\n type ResourceResolver,\n type Stylesheet,\n type Resolvable,\n type DataType,\n} from '@makeswift/controls'\n\nimport { renderSlot } from '../runtimes/react/controls/slot'\n\nabstract class BaseDefinition extends BaseSlotDefinition<ReactNode> {}\n\nexport class SlotDefinition extends BaseDefinition {\n static deserialize(data: DeserializedRecord): SlotDefinition {\n if (data.type !== SlotDefinition.type) {\n throw new Error(`Slot: expected type ${SlotDefinition.type}, got ${data.type}`)\n }\n\n return Slot()\n }\n\n resolveValue(\n data: DataType<BaseDefinition> | undefined,\n _resolver: ResourceResolver,\n _stylesheet: Stylesheet,\n control?: SlotControl,\n ): Resolvable<ReactNode | undefined> {\n const stableValue = StableValue({\n name: SlotDefinition.type,\n read: () => renderSlot({ data, control: control ?? null }),\n })\n\n return {\n ...stableValue,\n triggerResolve: async () => {},\n }\n }\n}\n\nexport function Slot(): SlotDefinition {\n return new SlotDefinition()\n}\n\nexport { SlotControl }\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,sBASO;AAEP,kBAA2B;AAE3B,MAAe,uBAAuB,gBAAAA,eAA8B;AAAC;AAE9D,MAAM,uBAAuB,eAAe;AAAA,EACjD,OAAO,YAAY,MAA0C;AAC3D,QAAI,KAAK,SAAS,eAAe,MAAM;AACrC,YAAM,IAAI,MAAM,uBAAuB,eAAe,IAAI,SAAS,KAAK,IAAI,EAAE;AAAA,IAChF;AAEA,WAAO,KAAK;AAAA,EACd;AAAA,EAEA,aACE,MACA,WACA,aACA,SACmC;AACnC,UAAM,kBAAc,6BAAY;AAAA,MAC9B,MAAM,eAAe;AAAA,MACrB,MAAM,UAAM,wBAAW,EAAE,MAAM,SAAS,WAAW,KAAK,CAAC;AAAA,IAC3D,CAAC;AAED,WAAO;AAAA,MACL,GAAG;AAAA,MACH,gBAAgB,YAAY;AAAA,MAAC;AAAA,IAC/B;AAAA,EACF;AACF;AAEO,SAAS,OAAuB;AACrC,SAAO,IAAI,eAAe;AAC5B;","names":["BaseSlotDefinition"]}
|
|
@@ -36,7 +36,7 @@ async function handler(...args) {
|
|
|
36
36
|
const supportsPreviewMode = (0, import_ts_pattern.match)(args).with(routeHandlerPattern, () => false).with(apiRoutePattern, () => true).exhaustive();
|
|
37
37
|
const supportsDraftMode = (0, import_ts_pattern.match)(args).with(routeHandlerPattern, () => true).with(apiRoutePattern, () => false).exhaustive();
|
|
38
38
|
const body = {
|
|
39
|
-
version: "0.21.
|
|
39
|
+
version: "0.21.4-canary.0",
|
|
40
40
|
previewMode: supportsPreviewMode,
|
|
41
41
|
draftMode: supportsDraftMode,
|
|
42
42
|
interactionMode: true,
|