@makeswift/runtime 0.28.10-canary.12 → 0.28.10-canary.14

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.
Files changed (32) hide show
  1. package/dist/cjs/api/graphql-api-client.js +1 -1
  2. package/dist/cjs/api/rest-api-client.js +1 -1
  3. package/dist/cjs/api-handler/handlers/manifest.js +1 -1
  4. package/dist/cjs/components/builtin/Image/Image.js +17 -4
  5. package/dist/cjs/components/builtin/Image/Image.js.map +1 -1
  6. package/dist/cjs/components/builtin/Image/register.js +11 -0
  7. package/dist/cjs/components/builtin/Image/register.js.map +1 -1
  8. package/dist/cjs/runtimes/react/components/framework-context.js.map +1 -1
  9. package/dist/esm/api/graphql-api-client.js +1 -1
  10. package/dist/esm/api/rest-api-client.js +1 -1
  11. package/dist/esm/api-handler/handlers/manifest.js +1 -1
  12. package/dist/esm/components/builtin/Image/Image.js +17 -4
  13. package/dist/esm/components/builtin/Image/Image.js.map +1 -1
  14. package/dist/esm/components/builtin/Image/register.js +12 -0
  15. package/dist/esm/components/builtin/Image/register.js.map +1 -1
  16. package/dist/esm/runtimes/react/components/framework-context.js.map +1 -1
  17. package/dist/types/components/builtin/Image/Image.d.ts +3 -1
  18. package/dist/types/components/builtin/Image/Image.d.ts.map +1 -1
  19. package/dist/types/components/builtin/Image/register.d.ts.map +1 -1
  20. package/dist/types/controls/__tests__/fixtures/list.d.ts +1 -0
  21. package/dist/types/controls/__tests__/fixtures/list.d.ts.map +1 -1
  22. package/dist/types/controls/__tests__/fixtures/shape.d.ts +2 -0
  23. package/dist/types/controls/__tests__/fixtures/shape.d.ts.map +1 -1
  24. package/dist/types/runtimes/react/components/framework-context.d.ts +1 -0
  25. package/dist/types/runtimes/react/components/framework-context.d.ts.map +1 -1
  26. package/dist/types/slate/BlockPlugin/index.d.ts +13 -1
  27. package/dist/types/slate/BlockPlugin/index.d.ts.map +1 -1
  28. package/dist/types/slate/InlinePlugin/index.d.ts +13 -1
  29. package/dist/types/slate/InlinePlugin/index.d.ts.map +1 -1
  30. package/dist/types/slate/TextAlignPlugin/index.d.ts +13 -1
  31. package/dist/types/slate/TextAlignPlugin/index.d.ts.map +1 -1
  32. package/package.json +3 -3
@@ -27,7 +27,7 @@ class MakeswiftGraphQLApiClient {
27
27
  graphqlClient;
28
28
  constructor({ endpoint }) {
29
29
  this.graphqlClient = new import_client.GraphQLClient(endpoint, {
30
- "makeswift-runtime-version": "0.28.10-canary.12"
30
+ "makeswift-runtime-version": "0.28.10-canary.14"
31
31
  });
32
32
  }
33
33
  async getUnversionedResources({
@@ -198,7 +198,7 @@ class MakeswiftRestAPIClient {
198
198
  const requestHeaders = new Headers({
199
199
  "x-api-key": this.apiKey,
200
200
  "makeswift-site-api-key": this.apiKey,
201
- "makeswift-runtime-version": "0.28.10-canary.12"
201
+ "makeswift-runtime-version": "0.28.10-canary.14"
202
202
  });
203
203
  if (siteVersion?.token) {
204
204
  requestUrl.searchParams.set("version", siteVersion.version);
@@ -28,7 +28,7 @@ async function manifestHandler(req, { apiKey, manifest }) {
28
28
  return import_request_response.ApiResponse.json({ message: "Unauthorized" }, { status: 401 });
29
29
  }
30
30
  return import_request_response.ApiResponse.json({
31
- version: "0.28.10-canary.12",
31
+ version: "0.28.10-canary.14",
32
32
  interactionMode: true,
33
33
  clientSideNavigation: false,
34
34
  elementFromPoint: false,
@@ -34,6 +34,11 @@ var import_makeswift_api = require("../../../runtimes/react/hooks/makeswift-api"
34
34
  var import_use_breakpoints = require("../../../runtimes/react/hooks/use-breakpoints");
35
35
  var import_use_framework_context = require("../../../runtimes/react/components/hooks/use-framework-context");
36
36
  var import_ts_pattern = require("ts-pattern");
37
+ const aspectRatioValues = {
38
+ "16:9": "16 / 9",
39
+ "4:3": "4 / 3",
40
+ "1:1": "1 / 1"
41
+ };
37
42
  function loadImage(src) {
38
43
  return new Promise((resolve, reject) => {
39
44
  const image = new Image();
@@ -69,6 +74,7 @@ const ImageComponent = (0, import_react.forwardRef)(function Image2({
69
74
  link,
70
75
  opacity,
71
76
  boxShadow,
77
+ aspectRatio,
72
78
  placeholder = import_placeholders.placeholders.image,
73
79
  className,
74
80
  priority
@@ -109,6 +115,16 @@ const ImageComponent = (0, import_react.forwardRef)(function Image2({
109
115
  className
110
116
  );
111
117
  const { Image: Image3 } = (0, import_use_framework_context.useFrameworkContext)();
118
+ const imageClassName = (0, import_use_style.useStyle)(
119
+ (0, import_responsive_style.useResponsiveStyle)([aspectRatio], ([aspectRatio2 = "original"]) => ({
120
+ width: "100%",
121
+ height: "auto",
122
+ ...aspectRatio2 !== "original" && {
123
+ aspectRatio: aspectRatioValues[aspectRatio2],
124
+ objectFit: "cover"
125
+ }
126
+ }))
127
+ );
112
128
  if (!dimensions)
113
129
  return null;
114
130
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Container, { link, ref, id, className: containerClassName, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
@@ -120,10 +136,7 @@ const ImageComponent = (0, import_react.forwardRef)(function Image2({
120
136
  alt: altText ?? "",
121
137
  width: dimensions.width,
122
138
  height: dimensions.height,
123
- style: {
124
- width: "100%",
125
- height: "auto"
126
- }
139
+ className: imageClassName
127
140
  }
128
141
  ) });
129
142
  });
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/builtin/Image/Image.tsx"],"sourcesContent":["'use client'\n\nimport { useState, useEffect, Ref, forwardRef } from 'react'\n\nimport {\n LinkData,\n ResponsiveLengthData,\n ImageData,\n ResponsiveOpacityValue,\n} from '@makeswift/prop-controllers'\nimport { type Breakpoints, findBreakpointOverride } from '@makeswift/controls'\n\nimport { placeholders } from '../../utils/placeholders'\nimport { Link } from '../../shared/Link'\nimport { cx } from '@emotion/css'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useResponsiveStyle, useResponsiveWidth } from '../../utils/responsive-style'\nimport { useFile } from '../../../runtimes/react/hooks/makeswift-api'\nimport { useBreakpoints } from '../../../runtimes/react/hooks/use-breakpoints'\nimport { useFrameworkContext } from '../../../runtimes/react/components/hooks/use-framework-context'\nimport { match, P } from 'ts-pattern'\n\ntype Props = {\n id?: string\n file?: ImageData\n altText?: string\n link?: LinkData\n width?: ResponsiveLengthData\n margin?: string\n padding?: string\n border?: string\n borderRadius?: string\n boxShadow?: string\n opacity?: ResponsiveOpacityValue\n placeholder?: { src: string; dimensions: { width: number; height: number } }\n className?: string\n priority?: boolean\n}\n\nfunction loadImage(src: string): Promise<HTMLImageElement> {\n return new Promise<HTMLImageElement>((resolve, reject) => {\n const image = new Image()\n\n image.onload = () => resolve(image)\n image.onerror = reject\n image.src = src\n })\n}\n\nfunction imageSizes(breakpoints: Breakpoints, width?: Props['width']): string {\n const baseDevice = breakpoints.find(breakpoint => breakpoint.maxWidth == null)\n const baseWidth = baseDevice && width && findBreakpointOverride(breakpoints, width, baseDevice.id)\n const baseWidthSize =\n baseWidth == null || baseWidth.value.unit !== 'px' ? '100vw' : `${baseWidth.value.value}px`\n\n return breakpoints\n .map(breakpoint => {\n const override = findBreakpointOverride(breakpoints, width, breakpoint.id)\n\n if (override == null || breakpoint.maxWidth == null || override.value.unit !== 'px') {\n return null\n }\n\n return `(max-width: ${breakpoint.maxWidth}px) ${Math.min(\n breakpoint.maxWidth,\n override.value.value,\n )}px`\n })\n .filter((size): size is NonNullable<typeof size> => size != null)\n .reduce((sourceSizes, sourceSize) => `${sourceSize}, ${sourceSizes}`, baseWidthSize)\n}\n\ntype Dimensions = {\n width: number\n height: number\n}\n\nconst ImageComponent = forwardRef(function Image(\n {\n id,\n width,\n margin,\n padding,\n file,\n border,\n borderRadius,\n altText,\n link,\n opacity,\n boxShadow,\n placeholder = placeholders.image,\n className,\n priority,\n }: Props,\n ref: Ref<HTMLAnchorElement & HTMLDivElement>,\n) {\n const fileId = match(file)\n .with(P.string, v => v)\n .with({ type: 'makeswift-file', version: 1 }, v => v.id)\n .otherwise(() => null)\n const fileData = useFile(fileId)\n const imageSrc = match([file, fileData])\n .with([P.any, P.not(P.nullish)], ([, fileData]) => fileData.publicUrl)\n .with([{ type: 'external-file', version: 1 }, P.any], ([file]) => file.url)\n .otherwise(() => placeholder.src)\n const dataDimensions = match([file, fileData, imageSrc])\n .with(\n [{ type: 'external-file', version: 1, width: P.number, height: P.number }, P.any, P.any],\n ([externalFile]) => ({ width: externalFile.width, height: externalFile.height }),\n )\n .with([P.any, P.not(P.nullish), P.any], ([, data]) => data.dimensions)\n .with([P.any, P.any, placeholder.src], () => placeholder.dimensions)\n .otherwise(() => null)\n const [measuredDimensions, setMeasuredDimensions] = useState<Dimensions | null>(null)\n const breakpoints = useBreakpoints()\n\n useEffect(() => {\n if (dataDimensions) return\n\n let cleanedUp = false\n\n loadImage(imageSrc)\n .then(image => {\n if (!cleanedUp) {\n setMeasuredDimensions({ width: image.naturalWidth, height: image.naturalHeight })\n }\n })\n .catch(console.error)\n\n return () => {\n cleanedUp = true\n }\n }, [dataDimensions, imageSrc])\n\n const dimensions = dataDimensions ?? measuredDimensions\n const Container = link ? Link : 'div'\n const containerClassName = cx(\n useStyle({ lineHeight: 0, overflow: 'hidden' }),\n useStyle(useResponsiveWidth(width, dimensions?.width)),\n useStyle(useResponsiveStyle([opacity] as const, ([opacity = 1]) => ({ opacity }))),\n margin,\n padding,\n border,\n borderRadius,\n boxShadow,\n className,\n )\n\n const { Image } = useFrameworkContext()\n\n if (!dimensions) return null\n\n return (\n <Container link={link} ref={ref} id={id} className={containerClassName}>\n <Image\n src={imageSrc}\n priority={priority}\n sizes={imageSizes(breakpoints, width)}\n alt={altText ?? ''}\n width={dimensions.width}\n height={dimensions.height}\n style={{\n width: '100%',\n height: 'auto',\n }}\n />\n </Container>\n )\n})\n\nexport default ImageComponent\n"],"mappings":"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","names":["Image","fileData","file","opacity"]}
1
+ {"version":3,"sources":["../../../../../src/components/builtin/Image/Image.tsx"],"sourcesContent":["'use client'\n\nimport { useState, useEffect, Ref, forwardRef } from 'react'\n\nimport {\n LinkData,\n ResponsiveLengthData,\n ImageData,\n ResponsiveOpacityValue,\n ResponsiveSelectValue,\n} from '@makeswift/prop-controllers'\nimport { type Breakpoints, findBreakpointOverride } from '@makeswift/controls'\n\nimport { placeholders } from '../../utils/placeholders'\nimport { Link } from '../../shared/Link'\nimport { cx } from '@emotion/css'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useResponsiveStyle, useResponsiveWidth } from '../../utils/responsive-style'\nimport { useFile } from '../../../runtimes/react/hooks/makeswift-api'\nimport { useBreakpoints } from '../../../runtimes/react/hooks/use-breakpoints'\nimport { useFrameworkContext } from '../../../runtimes/react/components/hooks/use-framework-context'\nimport { match, P } from 'ts-pattern'\n\ntype AspectRatio = 'original' | '16:9' | '4:3' | '1:1'\n\nconst aspectRatioValues: Record<Exclude<AspectRatio, 'original'>, string> = {\n '16:9': '16 / 9',\n '4:3': '4 / 3',\n '1:1': '1 / 1',\n}\n\ntype Props = {\n id?: string\n file?: ImageData\n altText?: string\n link?: LinkData\n width?: ResponsiveLengthData\n aspectRatio?: ResponsiveSelectValue<AspectRatio>\n margin?: string\n padding?: string\n border?: string\n borderRadius?: string\n boxShadow?: string\n opacity?: ResponsiveOpacityValue\n placeholder?: { src: string; dimensions: { width: number; height: number } }\n className?: string\n priority?: boolean\n}\n\nfunction loadImage(src: string): Promise<HTMLImageElement> {\n return new Promise<HTMLImageElement>((resolve, reject) => {\n const image = new Image()\n\n image.onload = () => resolve(image)\n image.onerror = reject\n image.src = src\n })\n}\n\nfunction imageSizes(breakpoints: Breakpoints, width?: Props['width']): string {\n const baseDevice = breakpoints.find(breakpoint => breakpoint.maxWidth == null)\n const baseWidth = baseDevice && width && findBreakpointOverride(breakpoints, width, baseDevice.id)\n const baseWidthSize =\n baseWidth == null || baseWidth.value.unit !== 'px' ? '100vw' : `${baseWidth.value.value}px`\n\n return breakpoints\n .map(breakpoint => {\n const override = findBreakpointOverride(breakpoints, width, breakpoint.id)\n\n if (override == null || breakpoint.maxWidth == null || override.value.unit !== 'px') {\n return null\n }\n\n return `(max-width: ${breakpoint.maxWidth}px) ${Math.min(\n breakpoint.maxWidth,\n override.value.value,\n )}px`\n })\n .filter((size): size is NonNullable<typeof size> => size != null)\n .reduce((sourceSizes, sourceSize) => `${sourceSize}, ${sourceSizes}`, baseWidthSize)\n}\n\ntype Dimensions = {\n width: number\n height: number\n}\n\nconst ImageComponent = forwardRef(function Image(\n {\n id,\n width,\n margin,\n padding,\n file,\n border,\n borderRadius,\n altText,\n link,\n opacity,\n boxShadow,\n aspectRatio,\n placeholder = placeholders.image,\n className,\n priority,\n }: Props,\n ref: Ref<HTMLAnchorElement & HTMLDivElement>,\n) {\n const fileId = match(file)\n .with(P.string, v => v)\n .with({ type: 'makeswift-file', version: 1 }, v => v.id)\n .otherwise(() => null)\n const fileData = useFile(fileId)\n const imageSrc = match([file, fileData])\n .with([P.any, P.not(P.nullish)], ([, fileData]) => fileData.publicUrl)\n .with([{ type: 'external-file', version: 1 }, P.any], ([file]) => file.url)\n .otherwise(() => placeholder.src)\n const dataDimensions = match([file, fileData, imageSrc])\n .with(\n [{ type: 'external-file', version: 1, width: P.number, height: P.number }, P.any, P.any],\n ([externalFile]) => ({ width: externalFile.width, height: externalFile.height }),\n )\n .with([P.any, P.not(P.nullish), P.any], ([, data]) => data.dimensions)\n .with([P.any, P.any, placeholder.src], () => placeholder.dimensions)\n .otherwise(() => null)\n const [measuredDimensions, setMeasuredDimensions] = useState<Dimensions | null>(null)\n const breakpoints = useBreakpoints()\n\n useEffect(() => {\n if (dataDimensions) return\n\n let cleanedUp = false\n\n loadImage(imageSrc)\n .then(image => {\n if (!cleanedUp) {\n setMeasuredDimensions({ width: image.naturalWidth, height: image.naturalHeight })\n }\n })\n .catch(console.error)\n\n return () => {\n cleanedUp = true\n }\n }, [dataDimensions, imageSrc])\n\n const dimensions = dataDimensions ?? measuredDimensions\n const Container = link ? Link : 'div'\n const containerClassName = cx(\n useStyle({ lineHeight: 0, overflow: 'hidden' }),\n useStyle(useResponsiveWidth(width, dimensions?.width)),\n useStyle(useResponsiveStyle([opacity] as const, ([opacity = 1]) => ({ opacity }))),\n margin,\n padding,\n border,\n borderRadius,\n boxShadow,\n className,\n )\n\n const { Image } = useFrameworkContext()\n\n const imageClassName = useStyle(\n useResponsiveStyle([aspectRatio] as const, ([aspectRatio = 'original']) => ({\n width: '100%',\n height: 'auto',\n ...(aspectRatio !== 'original' && {\n aspectRatio: aspectRatioValues[aspectRatio],\n objectFit: 'cover',\n }),\n })),\n )\n\n if (!dimensions) return null\n\n return (\n <Container link={link} ref={ref} id={id} className={containerClassName}>\n <Image\n src={imageSrc}\n priority={priority}\n sizes={imageSizes(breakpoints, width)}\n alt={altText ?? ''}\n width={dimensions.width}\n height={dimensions.height}\n className={imageClassName}\n />\n </Container>\n )\n})\n\nexport default ImageComponent\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgLM;AA9KN,mBAAqD;AASrD,sBAAyD;AAEzD,0BAA6B;AAC7B,kBAAqB;AACrB,iBAAmB;AACnB,uBAAyB;AACzB,8BAAuD;AACvD,2BAAwB;AACxB,6BAA+B;AAC/B,mCAAoC;AACpC,wBAAyB;AAIzB,MAAM,oBAAsE;AAAA,EAC1E,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,OAAO;AACT;AAoBA,SAAS,UAAU,KAAwC;AACzD,SAAO,IAAI,QAA0B,CAAC,SAAS,WAAW;AACxD,UAAM,QAAQ,IAAI,MAAM;AAExB,UAAM,SAAS,MAAM,QAAQ,KAAK;AAClC,UAAM,UAAU;AAChB,UAAM,MAAM;AAAA,EACd,CAAC;AACH;AAEA,SAAS,WAAW,aAA0B,OAAgC;AAC5E,QAAM,aAAa,YAAY,KAAK,gBAAc,WAAW,YAAY,IAAI;AAC7E,QAAM,YAAY,cAAc,aAAS,wCAAuB,aAAa,OAAO,WAAW,EAAE;AACjG,QAAM,gBACJ,aAAa,QAAQ,UAAU,MAAM,SAAS,OAAO,UAAU,GAAG,UAAU,MAAM,KAAK;AAEzF,SAAO,YACJ,IAAI,gBAAc;AACjB,UAAM,eAAW,wCAAuB,aAAa,OAAO,WAAW,EAAE;AAEzE,QAAI,YAAY,QAAQ,WAAW,YAAY,QAAQ,SAAS,MAAM,SAAS,MAAM;AACnF,aAAO;AAAA,IACT;AAEA,WAAO,eAAe,WAAW,QAAQ,OAAO,KAAK;AAAA,MACnD,WAAW;AAAA,MACX,SAAS,MAAM;AAAA,IACjB,CAAC;AAAA,EACH,CAAC,EACA,OAAO,CAAC,SAA2C,QAAQ,IAAI,EAC/D,OAAO,CAAC,aAAa,eAAe,GAAG,UAAU,KAAK,WAAW,IAAI,aAAa;AACvF;AAOA,MAAM,qBAAiB,yBAAW,SAASA,OACzC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc,iCAAa;AAAA,EAC3B;AAAA,EACA;AACF,GACA,KACA;AACA,QAAM,aAAS,yBAAM,IAAI,EACtB,KAAK,oBAAE,QAAQ,OAAK,CAAC,EACrB,KAAK,EAAE,MAAM,kBAAkB,SAAS,EAAE,GAAG,OAAK,EAAE,EAAE,EACtD,UAAU,MAAM,IAAI;AACvB,QAAM,eAAW,8BAAQ,MAAM;AAC/B,QAAM,eAAW,yBAAM,CAAC,MAAM,QAAQ,CAAC,EACpC,KAAK,CAAC,oBAAE,KAAK,oBAAE,IAAI,oBAAE,OAAO,CAAC,GAAG,CAAC,CAAC,EAAEC,SAAQ,MAAMA,UAAS,SAAS,EACpE,KAAK,CAAC,EAAE,MAAM,iBAAiB,SAAS,EAAE,GAAG,oBAAE,GAAG,GAAG,CAAC,CAACC,KAAI,MAAMA,MAAK,GAAG,EACzE,UAAU,MAAM,YAAY,GAAG;AAClC,QAAM,qBAAiB,yBAAM,CAAC,MAAM,UAAU,QAAQ,CAAC,EACpD;AAAA,IACC,CAAC,EAAE,MAAM,iBAAiB,SAAS,GAAG,OAAO,oBAAE,QAAQ,QAAQ,oBAAE,OAAO,GAAG,oBAAE,KAAK,oBAAE,GAAG;AAAA,IACvF,CAAC,CAAC,YAAY,OAAO,EAAE,OAAO,aAAa,OAAO,QAAQ,aAAa,OAAO;AAAA,EAChF,EACC,KAAK,CAAC,oBAAE,KAAK,oBAAE,IAAI,oBAAE,OAAO,GAAG,oBAAE,GAAG,GAAG,CAAC,CAAC,EAAE,IAAI,MAAM,KAAK,UAAU,EACpE,KAAK,CAAC,oBAAE,KAAK,oBAAE,KAAK,YAAY,GAAG,GAAG,MAAM,YAAY,UAAU,EAClE,UAAU,MAAM,IAAI;AACvB,QAAM,CAAC,oBAAoB,qBAAqB,QAAI,uBAA4B,IAAI;AACpF,QAAM,kBAAc,uCAAe;AAEnC,8BAAU,MAAM;AACd,QAAI;AAAgB;AAEpB,QAAI,YAAY;AAEhB,cAAU,QAAQ,EACf,KAAK,WAAS;AACb,UAAI,CAAC,WAAW;AACd,8BAAsB,EAAE,OAAO,MAAM,cAAc,QAAQ,MAAM,cAAc,CAAC;AAAA,MAClF;AAAA,IACF,CAAC,EACA,MAAM,QAAQ,KAAK;AAEtB,WAAO,MAAM;AACX,kBAAY;AAAA,IACd;AAAA,EACF,GAAG,CAAC,gBAAgB,QAAQ,CAAC;AAE7B,QAAM,aAAa,kBAAkB;AACrC,QAAM,YAAY,OAAO,mBAAO;AAChC,QAAM,yBAAqB;AAAA,QACzB,2BAAS,EAAE,YAAY,GAAG,UAAU,SAAS,CAAC;AAAA,QAC9C,+BAAS,4CAAmB,OAAO,YAAY,KAAK,CAAC;AAAA,QACrD,+BAAS,4CAAmB,CAAC,OAAO,GAAY,CAAC,CAACC,WAAU,CAAC,OAAO,EAAE,SAAAA,SAAQ,EAAE,CAAC;AAAA,IACjF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,QAAM,EAAE,OAAAH,OAAM,QAAI,kDAAoB;AAEtC,QAAM,qBAAiB;AAAA,QACrB,4CAAmB,CAAC,WAAW,GAAY,CAAC,CAACI,eAAc,UAAU,OAAO;AAAA,MAC1E,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,GAAIA,iBAAgB,cAAc;AAAA,QAChC,aAAa,kBAAkBA,YAAW;AAAA,QAC1C,WAAW;AAAA,MACb;AAAA,IACF,EAAE;AAAA,EACJ;AAEA,MAAI,CAAC;AAAY,WAAO;AAExB,SACE,4CAAC,aAAU,MAAY,KAAU,IAAQ,WAAW,oBAClD;AAAA,IAACJ;AAAA,IAAA;AAAA,MACC,KAAK;AAAA,MACL;AAAA,MACA,OAAO,WAAW,aAAa,KAAK;AAAA,MACpC,KAAK,WAAW;AAAA,MAChB,OAAO,WAAW;AAAA,MAClB,QAAQ,WAAW;AAAA,MACnB,WAAW;AAAA;AAAA,EACb,GACF;AAEJ,CAAC;AAED,IAAO,gBAAQ;","names":["Image","fileData","file","opacity","aspectRatio"]}
@@ -46,6 +46,17 @@ function registerComponent(runtime) {
46
46
  altText: (0, import_prop_controllers.TextInput)({ label: "Alt text" }),
47
47
  link: (0, import_prop_controllers.Link)({ label: "On click" }),
48
48
  width: (0, import_prop_controllers.Width)(),
49
+ aspectRatio: (0, import_prop_controllers.ResponsiveSelect)({
50
+ label: "Aspect ratio",
51
+ labelOrientation: "vertical",
52
+ options: [
53
+ { value: "original", label: "Original" },
54
+ { value: "16:9", label: "16:9" },
55
+ { value: "4:3", label: "4:3" },
56
+ { value: "1:1", label: "1:1" }
57
+ ],
58
+ defaultValue: "original"
59
+ }),
49
60
  margin: (0, import_prop_controllers.Margin)({ format: import_prop_controllers.Margin.Format.ClassName }),
50
61
  padding: (0, import_prop_controllers.Padding)({ format: import_prop_controllers.Padding.Format.ClassName }),
51
62
  border: (0, import_prop_controllers.Border)({ format: import_prop_controllers.Border.Format.ClassName }),
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/builtin/Image/register.ts"],"sourcesContent":["import { lazy } from 'react'\nimport { type ReactRuntimeCore } from '../../../runtimes/react/react-runtime-core'\nimport { MakeswiftComponentType } from '../constants'\nimport {\n Border,\n Link,\n Shadows,\n Checkbox,\n BorderRadius,\n Margin,\n Padding,\n Width,\n ElementID,\n Image,\n ResponsiveOpacity,\n TextInput,\n} from '@makeswift/prop-controllers'\n\nexport function registerComponent(runtime: ReactRuntimeCore) {\n return runtime.registerComponent(\n lazy(() => import('./Image')),\n {\n type: MakeswiftComponentType.Image,\n label: 'Image',\n props: {\n id: ElementID(),\n file: Image(),\n altText: TextInput({ label: 'Alt text' }),\n link: Link({ label: 'On click' }),\n width: Width(),\n margin: Margin({ format: Margin.Format.ClassName }),\n padding: Padding({ format: Padding.Format.ClassName }),\n border: Border({ format: Border.Format.ClassName }),\n borderRadius: BorderRadius({ format: BorderRadius.Format.ClassName }),\n boxShadow: Shadows({ format: Shadows.Format.ClassName }),\n opacity: ResponsiveOpacity(),\n priority: Checkbox({ label: 'Priority' }),\n },\n },\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAqB;AAErB,uBAAuC;AACvC,8BAaO;AAEA,SAAS,kBAAkB,SAA2B;AAC3D,SAAO,QAAQ;AAAA,QACb,mBAAK,MAAM,6CAAO,SAAS,GAAC;AAAA,IAC5B;AAAA,MACE,MAAM,wCAAuB;AAAA,MAC7B,OAAO;AAAA,MACP,OAAO;AAAA,QACL,QAAI,mCAAU;AAAA,QACd,UAAM,+BAAM;AAAA,QACZ,aAAS,mCAAU,EAAE,OAAO,WAAW,CAAC;AAAA,QACxC,UAAM,8BAAK,EAAE,OAAO,WAAW,CAAC;AAAA,QAChC,WAAO,+BAAM;AAAA,QACb,YAAQ,gCAAO,EAAE,QAAQ,+BAAO,OAAO,UAAU,CAAC;AAAA,QAClD,aAAS,iCAAQ,EAAE,QAAQ,gCAAQ,OAAO,UAAU,CAAC;AAAA,QACrD,YAAQ,gCAAO,EAAE,QAAQ,+BAAO,OAAO,UAAU,CAAC;AAAA,QAClD,kBAAc,sCAAa,EAAE,QAAQ,qCAAa,OAAO,UAAU,CAAC;AAAA,QACpE,eAAW,iCAAQ,EAAE,QAAQ,gCAAQ,OAAO,UAAU,CAAC;AAAA,QACvD,aAAS,2CAAkB;AAAA,QAC3B,cAAU,kCAAS,EAAE,OAAO,WAAW,CAAC;AAAA,MAC1C;AAAA,IACF;AAAA,EACF;AACF;","names":[]}
1
+ {"version":3,"sources":["../../../../../src/components/builtin/Image/register.ts"],"sourcesContent":["import { lazy } from 'react'\nimport { type ReactRuntimeCore } from '../../../runtimes/react/react-runtime-core'\nimport { MakeswiftComponentType } from '../constants'\nimport {\n Border,\n Link,\n Shadows,\n Checkbox,\n BorderRadius,\n Margin,\n Padding,\n Width,\n ElementID,\n Image,\n ResponsiveOpacity,\n ResponsiveSelect,\n TextInput,\n} from '@makeswift/prop-controllers'\n\nexport function registerComponent(runtime: ReactRuntimeCore) {\n return runtime.registerComponent(\n lazy(() => import('./Image')),\n {\n type: MakeswiftComponentType.Image,\n label: 'Image',\n props: {\n id: ElementID(),\n file: Image(),\n altText: TextInput({ label: 'Alt text' }),\n link: Link({ label: 'On click' }),\n width: Width(),\n aspectRatio: ResponsiveSelect({\n label: 'Aspect ratio',\n labelOrientation: 'vertical',\n options: [\n { value: 'original', label: 'Original' },\n { value: '16:9', label: '16:9' },\n { value: '4:3', label: '4:3' },\n { value: '1:1', label: '1:1' },\n ],\n defaultValue: 'original',\n }),\n margin: Margin({ format: Margin.Format.ClassName }),\n padding: Padding({ format: Padding.Format.ClassName }),\n border: Border({ format: Border.Format.ClassName }),\n borderRadius: BorderRadius({ format: BorderRadius.Format.ClassName }),\n boxShadow: Shadows({ format: Shadows.Format.ClassName }),\n opacity: ResponsiveOpacity(),\n priority: Checkbox({ label: 'Priority' }),\n },\n },\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAqB;AAErB,uBAAuC;AACvC,8BAcO;AAEA,SAAS,kBAAkB,SAA2B;AAC3D,SAAO,QAAQ;AAAA,QACb,mBAAK,MAAM,6CAAO,SAAS,GAAC;AAAA,IAC5B;AAAA,MACE,MAAM,wCAAuB;AAAA,MAC7B,OAAO;AAAA,MACP,OAAO;AAAA,QACL,QAAI,mCAAU;AAAA,QACd,UAAM,+BAAM;AAAA,QACZ,aAAS,mCAAU,EAAE,OAAO,WAAW,CAAC;AAAA,QACxC,UAAM,8BAAK,EAAE,OAAO,WAAW,CAAC;AAAA,QAChC,WAAO,+BAAM;AAAA,QACb,iBAAa,0CAAiB;AAAA,UAC5B,OAAO;AAAA,UACP,kBAAkB;AAAA,UAClB,SAAS;AAAA,YACP,EAAE,OAAO,YAAY,OAAO,WAAW;AAAA,YACvC,EAAE,OAAO,QAAQ,OAAO,OAAO;AAAA,YAC/B,EAAE,OAAO,OAAO,OAAO,MAAM;AAAA,YAC7B,EAAE,OAAO,OAAO,OAAO,MAAM;AAAA,UAC/B;AAAA,UACA,cAAc;AAAA,QAChB,CAAC;AAAA,QACD,YAAQ,gCAAO,EAAE,QAAQ,+BAAO,OAAO,UAAU,CAAC;AAAA,QAClD,aAAS,iCAAQ,EAAE,QAAQ,gCAAQ,OAAO,UAAU,CAAC;AAAA,QACrD,YAAQ,gCAAO,EAAE,QAAQ,+BAAO,OAAO,UAAU,CAAC;AAAA,QAClD,kBAAc,sCAAa,EAAE,QAAQ,qCAAa,OAAO,UAAU,CAAC;AAAA,QACpE,eAAW,iCAAQ,EAAE,QAAQ,gCAAQ,OAAO,UAAU,CAAC;AAAA,QACvD,aAAS,2CAAkB;AAAA,QAC3B,cAAU,kCAAS,EAAE,OAAO,WAAW,CAAC;AAAA,MAC1C;AAAA,IACF;AAAA,EACF;AACF;","names":[]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/runtimes/react/components/framework-context.tsx"],"sourcesContent":["'use client'\n\nimport {\n type ReactNode,\n type PropsWithChildren,\n type CSSProperties,\n type ComponentPropsWithoutRef,\n type MouseEvent,\n type ForwardRefExoticComponent,\n type RefAttributes,\n forwardRef,\n createContext,\n useContext,\n useMemo,\n} from 'react'\n\nimport { type LinkData } from '@makeswift/prop-controllers'\n\nimport { type Snippet } from '../../../client/page-snapshot'\n\nimport { type RenderElementPayload } from '../server/render-element-payload'\n\nimport { BaseHeadSnippet } from './page/HeadSnippet'\n\ntype HeadComponent = (props: { children: ReactNode }) => ReactNode\ntype HeadSnippet = (props: { snippet: Snippet }) => ReactNode\ntype ImageComponent = (props: {\n src: string\n alt: string\n sizes?: string\n width?: number\n height?: number\n priority?: boolean\n fill?: boolean\n style?: CSSProperties\n}) => ReactNode\n\ntype LinkProps = Omit<ComponentPropsWithoutRef<'a'>, 'onClick'> & {\n linkType?: LinkData['type']\n onClick?: (event: MouseEvent<HTMLAnchorElement>) => unknown\n}\n\ntype LinkComponent = ForwardRefExoticComponent<RefAttributes<HTMLAnchorElement> & LinkProps>\n\nexport type FrameworkContext = {\n Head: HeadComponent\n HeadSnippet: HeadSnippet\n Image: ImageComponent\n Link: LinkComponent\n /**\n * Callback to render a single RSC element on the server and return the result.\n */\n renderRSCElement?: (args: RenderElementPayload) => Promise<ReactNode>\n}\n\n// React 19 automatically hoists metadata tags to the <head>\nconst DefaultHead = ({ children }: PropsWithChildren) => <>{children}</>\n\nconst DefaultHeadSnippet = BaseHeadSnippet\n\nconst DefaultImage: ImageComponent = ({ priority, fill, style, ...props }) => (\n <img\n {...props}\n style={{\n ...(fill\n ? {\n height: '100%',\n width: '100%',\n objectFit: 'cover',\n }\n : {}),\n ...style,\n }}\n loading={priority ? 'eager' : 'lazy'}\n />\n)\n\nconst DefaultLink: LinkComponent = forwardRef<HTMLAnchorElement, LinkProps>(\n ({ linkType, ...props }, ref) => <a {...props} ref={ref} />,\n)\n\nconst FrameworkContext = createContext<Partial<FrameworkContext>>({})\n\nexport const FrameworkContextProvider = ({\n value,\n children,\n}: PropsWithChildren<{ value: Partial<FrameworkContext> }>) => {\n const parentContext = useContext(FrameworkContext)\n const mergedContext = useMemo(() => ({ ...parentContext, ...value }), [parentContext, value])\n\n return <FrameworkContext.Provider value={mergedContext}>{children}</FrameworkContext.Provider>\n}\n\nconst defaultContext: FrameworkContext = {\n Head: DefaultHead,\n HeadSnippet: DefaultHeadSnippet,\n Image: DefaultImage,\n Link: DefaultLink,\n}\n\nexport function useFrameworkContext(): FrameworkContext {\n return { ...defaultContext, ...useContext(FrameworkContext) }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAwDyD;AAtDzD,mBAYO;AAQP,yBAAgC;AAkChC,MAAM,cAAc,CAAC,EAAE,SAAS,MAAyB,2EAAG,UAAS;AAErE,MAAM,qBAAqB;AAE3B,MAAM,eAA+B,CAAC,EAAE,UAAU,MAAM,OAAO,GAAG,MAAM,MACtE;AAAA,EAAC;AAAA;AAAA,IACE,GAAG;AAAA,IACJ,OAAO;AAAA,MACL,GAAI,OACA;AAAA,QACE,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,WAAW;AAAA,MACb,IACA,CAAC;AAAA,MACL,GAAG;AAAA,IACL;AAAA,IACA,SAAS,WAAW,UAAU;AAAA;AAChC;AAGF,MAAM,kBAA6B;AAAA,EACjC,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,QAAQ,4CAAC,OAAG,GAAG,OAAO,KAAU;AAC3D;AAEA,MAAM,uBAAmB,4BAAyC,CAAC,CAAC;AAE7D,MAAM,2BAA2B,CAAC;AAAA,EACvC;AAAA,EACA;AACF,MAA+D;AAC7D,QAAM,oBAAgB,yBAAW,gBAAgB;AACjD,QAAM,oBAAgB,sBAAQ,OAAO,EAAE,GAAG,eAAe,GAAG,MAAM,IAAI,CAAC,eAAe,KAAK,CAAC;AAE5F,SAAO,4CAAC,iBAAiB,UAAjB,EAA0B,OAAO,eAAgB,UAAS;AACpE;AAEA,MAAM,iBAAmC;AAAA,EACvC,MAAM;AAAA,EACN,aAAa;AAAA,EACb,OAAO;AAAA,EACP,MAAM;AACR;AAEO,SAAS,sBAAwC;AACtD,SAAO,EAAE,GAAG,gBAAgB,OAAG,yBAAW,gBAAgB,EAAE;AAC9D;","names":[]}
1
+ {"version":3,"sources":["../../../../../src/runtimes/react/components/framework-context.tsx"],"sourcesContent":["'use client'\n\nimport {\n type ReactNode,\n type PropsWithChildren,\n type CSSProperties,\n type ComponentPropsWithoutRef,\n type MouseEvent,\n type ForwardRefExoticComponent,\n type RefAttributes,\n forwardRef,\n createContext,\n useContext,\n useMemo,\n} from 'react'\n\nimport { type LinkData } from '@makeswift/prop-controllers'\n\nimport { type Snippet } from '../../../client/page-snapshot'\n\nimport { type RenderElementPayload } from '../server/render-element-payload'\n\nimport { BaseHeadSnippet } from './page/HeadSnippet'\n\ntype HeadComponent = (props: { children: ReactNode }) => ReactNode\ntype HeadSnippet = (props: { snippet: Snippet }) => ReactNode\ntype ImageComponent = (props: {\n src: string\n alt: string\n sizes?: string\n width?: number\n height?: number\n priority?: boolean\n fill?: boolean\n style?: CSSProperties\n className?: string\n}) => ReactNode\n\ntype LinkProps = Omit<ComponentPropsWithoutRef<'a'>, 'onClick'> & {\n linkType?: LinkData['type']\n onClick?: (event: MouseEvent<HTMLAnchorElement>) => unknown\n}\n\ntype LinkComponent = ForwardRefExoticComponent<RefAttributes<HTMLAnchorElement> & LinkProps>\n\nexport type FrameworkContext = {\n Head: HeadComponent\n HeadSnippet: HeadSnippet\n Image: ImageComponent\n Link: LinkComponent\n /**\n * Callback to render a single RSC element on the server and return the result.\n */\n renderRSCElement?: (args: RenderElementPayload) => Promise<ReactNode>\n}\n\n// React 19 automatically hoists metadata tags to the <head>\nconst DefaultHead = ({ children }: PropsWithChildren) => <>{children}</>\n\nconst DefaultHeadSnippet = BaseHeadSnippet\n\nconst DefaultImage: ImageComponent = ({ priority, fill, style, ...props }) => (\n <img\n {...props}\n style={{\n ...(fill\n ? {\n height: '100%',\n width: '100%',\n objectFit: 'cover',\n }\n : {}),\n ...style,\n }}\n loading={priority ? 'eager' : 'lazy'}\n />\n)\n\nconst DefaultLink: LinkComponent = forwardRef<HTMLAnchorElement, LinkProps>(\n ({ linkType, ...props }, ref) => <a {...props} ref={ref} />,\n)\n\nconst FrameworkContext = createContext<Partial<FrameworkContext>>({})\n\nexport const FrameworkContextProvider = ({\n value,\n children,\n}: PropsWithChildren<{ value: Partial<FrameworkContext> }>) => {\n const parentContext = useContext(FrameworkContext)\n const mergedContext = useMemo(() => ({ ...parentContext, ...value }), [parentContext, value])\n\n return <FrameworkContext.Provider value={mergedContext}>{children}</FrameworkContext.Provider>\n}\n\nconst defaultContext: FrameworkContext = {\n Head: DefaultHead,\n HeadSnippet: DefaultHeadSnippet,\n Image: DefaultImage,\n Link: DefaultLink,\n}\n\nexport function useFrameworkContext(): FrameworkContext {\n return { ...defaultContext, ...useContext(FrameworkContext) }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyDyD;AAvDzD,mBAYO;AAQP,yBAAgC;AAmChC,MAAM,cAAc,CAAC,EAAE,SAAS,MAAyB,2EAAG,UAAS;AAErE,MAAM,qBAAqB;AAE3B,MAAM,eAA+B,CAAC,EAAE,UAAU,MAAM,OAAO,GAAG,MAAM,MACtE;AAAA,EAAC;AAAA;AAAA,IACE,GAAG;AAAA,IACJ,OAAO;AAAA,MACL,GAAI,OACA;AAAA,QACE,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,WAAW;AAAA,MACb,IACA,CAAC;AAAA,MACL,GAAG;AAAA,IACL;AAAA,IACA,SAAS,WAAW,UAAU;AAAA;AAChC;AAGF,MAAM,kBAA6B;AAAA,EACjC,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,QAAQ,4CAAC,OAAG,GAAG,OAAO,KAAU;AAC3D;AAEA,MAAM,uBAAmB,4BAAyC,CAAC,CAAC;AAE7D,MAAM,2BAA2B,CAAC;AAAA,EACvC;AAAA,EACA;AACF,MAA+D;AAC7D,QAAM,oBAAgB,yBAAW,gBAAgB;AACjD,QAAM,oBAAgB,sBAAQ,OAAO,EAAE,GAAG,eAAe,GAAG,MAAM,IAAI,CAAC,eAAe,KAAK,CAAC;AAE5F,SAAO,4CAAC,iBAAiB,UAAjB,EAA0B,OAAO,eAAgB,UAAS;AACpE;AAEA,MAAM,iBAAmC;AAAA,EACvC,MAAM;AAAA,EACN,aAAa;AAAA,EACb,OAAO;AAAA,EACP,MAAM;AACR;AAEO,SAAS,sBAAwC;AACtD,SAAO,EAAE,GAAG,gBAAgB,OAAG,yBAAW,gBAAgB,EAAE;AAC9D;","names":[]}
@@ -4,7 +4,7 @@ class MakeswiftGraphQLApiClient {
4
4
  graphqlClient;
5
5
  constructor({ endpoint }) {
6
6
  this.graphqlClient = new GraphQLClient(endpoint, {
7
- "makeswift-runtime-version": "0.28.10-canary.12"
7
+ "makeswift-runtime-version": "0.28.10-canary.14"
8
8
  });
9
9
  }
10
10
  async getUnversionedResources({
@@ -163,7 +163,7 @@ class MakeswiftRestAPIClient {
163
163
  const requestHeaders = new Headers({
164
164
  "x-api-key": this.apiKey,
165
165
  "makeswift-site-api-key": this.apiKey,
166
- "makeswift-runtime-version": "0.28.10-canary.12"
166
+ "makeswift-runtime-version": "0.28.10-canary.14"
167
167
  });
168
168
  if (siteVersion?.token) {
169
169
  requestUrl.searchParams.set("version", siteVersion.version);
@@ -8,7 +8,7 @@ async function manifestHandler(req, { apiKey, manifest }) {
8
8
  return ApiResponse.json({ message: "Unauthorized" }, { status: 401 });
9
9
  }
10
10
  return ApiResponse.json({
11
- version: "0.28.10-canary.12",
11
+ version: "0.28.10-canary.14",
12
12
  interactionMode: true,
13
13
  clientSideNavigation: false,
14
14
  elementFromPoint: false,
@@ -11,6 +11,11 @@ import { useFile } from "../../../runtimes/react/hooks/makeswift-api";
11
11
  import { useBreakpoints } from "../../../runtimes/react/hooks/use-breakpoints";
12
12
  import { useFrameworkContext } from "../../../runtimes/react/components/hooks/use-framework-context";
13
13
  import { match, P } from "ts-pattern";
14
+ const aspectRatioValues = {
15
+ "16:9": "16 / 9",
16
+ "4:3": "4 / 3",
17
+ "1:1": "1 / 1"
18
+ };
14
19
  function loadImage(src) {
15
20
  return new Promise((resolve, reject) => {
16
21
  const image = new Image();
@@ -46,6 +51,7 @@ const ImageComponent = forwardRef(function Image2({
46
51
  link,
47
52
  opacity,
48
53
  boxShadow,
54
+ aspectRatio,
49
55
  placeholder = placeholders.image,
50
56
  className,
51
57
  priority
@@ -86,6 +92,16 @@ const ImageComponent = forwardRef(function Image2({
86
92
  className
87
93
  );
88
94
  const { Image: Image3 } = useFrameworkContext();
95
+ const imageClassName = useStyle(
96
+ useResponsiveStyle([aspectRatio], ([aspectRatio2 = "original"]) => ({
97
+ width: "100%",
98
+ height: "auto",
99
+ ...aspectRatio2 !== "original" && {
100
+ aspectRatio: aspectRatioValues[aspectRatio2],
101
+ objectFit: "cover"
102
+ }
103
+ }))
104
+ );
89
105
  if (!dimensions)
90
106
  return null;
91
107
  return /* @__PURE__ */ jsx(Container, { link, ref, id, className: containerClassName, children: /* @__PURE__ */ jsx(
@@ -97,10 +113,7 @@ const ImageComponent = forwardRef(function Image2({
97
113
  alt: altText ?? "",
98
114
  width: dimensions.width,
99
115
  height: dimensions.height,
100
- style: {
101
- width: "100%",
102
- height: "auto"
103
- }
116
+ className: imageClassName
104
117
  }
105
118
  ) });
106
119
  });
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/builtin/Image/Image.tsx"],"sourcesContent":["'use client'\n\nimport { useState, useEffect, Ref, forwardRef } from 'react'\n\nimport {\n LinkData,\n ResponsiveLengthData,\n ImageData,\n ResponsiveOpacityValue,\n} from '@makeswift/prop-controllers'\nimport { type Breakpoints, findBreakpointOverride } from '@makeswift/controls'\n\nimport { placeholders } from '../../utils/placeholders'\nimport { Link } from '../../shared/Link'\nimport { cx } from '@emotion/css'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useResponsiveStyle, useResponsiveWidth } from '../../utils/responsive-style'\nimport { useFile } from '../../../runtimes/react/hooks/makeswift-api'\nimport { useBreakpoints } from '../../../runtimes/react/hooks/use-breakpoints'\nimport { useFrameworkContext } from '../../../runtimes/react/components/hooks/use-framework-context'\nimport { match, P } from 'ts-pattern'\n\ntype Props = {\n id?: string\n file?: ImageData\n altText?: string\n link?: LinkData\n width?: ResponsiveLengthData\n margin?: string\n padding?: string\n border?: string\n borderRadius?: string\n boxShadow?: string\n opacity?: ResponsiveOpacityValue\n placeholder?: { src: string; dimensions: { width: number; height: number } }\n className?: string\n priority?: boolean\n}\n\nfunction loadImage(src: string): Promise<HTMLImageElement> {\n return new Promise<HTMLImageElement>((resolve, reject) => {\n const image = new Image()\n\n image.onload = () => resolve(image)\n image.onerror = reject\n image.src = src\n })\n}\n\nfunction imageSizes(breakpoints: Breakpoints, width?: Props['width']): string {\n const baseDevice = breakpoints.find(breakpoint => breakpoint.maxWidth == null)\n const baseWidth = baseDevice && width && findBreakpointOverride(breakpoints, width, baseDevice.id)\n const baseWidthSize =\n baseWidth == null || baseWidth.value.unit !== 'px' ? '100vw' : `${baseWidth.value.value}px`\n\n return breakpoints\n .map(breakpoint => {\n const override = findBreakpointOverride(breakpoints, width, breakpoint.id)\n\n if (override == null || breakpoint.maxWidth == null || override.value.unit !== 'px') {\n return null\n }\n\n return `(max-width: ${breakpoint.maxWidth}px) ${Math.min(\n breakpoint.maxWidth,\n override.value.value,\n )}px`\n })\n .filter((size): size is NonNullable<typeof size> => size != null)\n .reduce((sourceSizes, sourceSize) => `${sourceSize}, ${sourceSizes}`, baseWidthSize)\n}\n\ntype Dimensions = {\n width: number\n height: number\n}\n\nconst ImageComponent = forwardRef(function Image(\n {\n id,\n width,\n margin,\n padding,\n file,\n border,\n borderRadius,\n altText,\n link,\n opacity,\n boxShadow,\n placeholder = placeholders.image,\n className,\n priority,\n }: Props,\n ref: Ref<HTMLAnchorElement & HTMLDivElement>,\n) {\n const fileId = match(file)\n .with(P.string, v => v)\n .with({ type: 'makeswift-file', version: 1 }, v => v.id)\n .otherwise(() => null)\n const fileData = useFile(fileId)\n const imageSrc = match([file, fileData])\n .with([P.any, P.not(P.nullish)], ([, fileData]) => fileData.publicUrl)\n .with([{ type: 'external-file', version: 1 }, P.any], ([file]) => file.url)\n .otherwise(() => placeholder.src)\n const dataDimensions = match([file, fileData, imageSrc])\n .with(\n [{ type: 'external-file', version: 1, width: P.number, height: P.number }, P.any, P.any],\n ([externalFile]) => ({ width: externalFile.width, height: externalFile.height }),\n )\n .with([P.any, P.not(P.nullish), P.any], ([, data]) => data.dimensions)\n .with([P.any, P.any, placeholder.src], () => placeholder.dimensions)\n .otherwise(() => null)\n const [measuredDimensions, setMeasuredDimensions] = useState<Dimensions | null>(null)\n const breakpoints = useBreakpoints()\n\n useEffect(() => {\n if (dataDimensions) return\n\n let cleanedUp = false\n\n loadImage(imageSrc)\n .then(image => {\n if (!cleanedUp) {\n setMeasuredDimensions({ width: image.naturalWidth, height: image.naturalHeight })\n }\n })\n .catch(console.error)\n\n return () => {\n cleanedUp = true\n }\n }, [dataDimensions, imageSrc])\n\n const dimensions = dataDimensions ?? measuredDimensions\n const Container = link ? Link : 'div'\n const containerClassName = cx(\n useStyle({ lineHeight: 0, overflow: 'hidden' }),\n useStyle(useResponsiveWidth(width, dimensions?.width)),\n useStyle(useResponsiveStyle([opacity] as const, ([opacity = 1]) => ({ opacity }))),\n margin,\n padding,\n border,\n borderRadius,\n boxShadow,\n className,\n )\n\n const { Image } = useFrameworkContext()\n\n if (!dimensions) return null\n\n return (\n <Container link={link} ref={ref} id={id} className={containerClassName}>\n <Image\n src={imageSrc}\n priority={priority}\n sizes={imageSizes(breakpoints, width)}\n alt={altText ?? ''}\n width={dimensions.width}\n height={dimensions.height}\n style={{\n width: '100%',\n height: 'auto',\n }}\n />\n </Container>\n )\n})\n\nexport default ImageComponent\n"],"mappings":"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","names":["Image","fileData","file","opacity"]}
1
+ {"version":3,"sources":["../../../../../src/components/builtin/Image/Image.tsx"],"sourcesContent":["'use client'\n\nimport { useState, useEffect, Ref, forwardRef } from 'react'\n\nimport {\n LinkData,\n ResponsiveLengthData,\n ImageData,\n ResponsiveOpacityValue,\n ResponsiveSelectValue,\n} from '@makeswift/prop-controllers'\nimport { type Breakpoints, findBreakpointOverride } from '@makeswift/controls'\n\nimport { placeholders } from '../../utils/placeholders'\nimport { Link } from '../../shared/Link'\nimport { cx } from '@emotion/css'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useResponsiveStyle, useResponsiveWidth } from '../../utils/responsive-style'\nimport { useFile } from '../../../runtimes/react/hooks/makeswift-api'\nimport { useBreakpoints } from '../../../runtimes/react/hooks/use-breakpoints'\nimport { useFrameworkContext } from '../../../runtimes/react/components/hooks/use-framework-context'\nimport { match, P } from 'ts-pattern'\n\ntype AspectRatio = 'original' | '16:9' | '4:3' | '1:1'\n\nconst aspectRatioValues: Record<Exclude<AspectRatio, 'original'>, string> = {\n '16:9': '16 / 9',\n '4:3': '4 / 3',\n '1:1': '1 / 1',\n}\n\ntype Props = {\n id?: string\n file?: ImageData\n altText?: string\n link?: LinkData\n width?: ResponsiveLengthData\n aspectRatio?: ResponsiveSelectValue<AspectRatio>\n margin?: string\n padding?: string\n border?: string\n borderRadius?: string\n boxShadow?: string\n opacity?: ResponsiveOpacityValue\n placeholder?: { src: string; dimensions: { width: number; height: number } }\n className?: string\n priority?: boolean\n}\n\nfunction loadImage(src: string): Promise<HTMLImageElement> {\n return new Promise<HTMLImageElement>((resolve, reject) => {\n const image = new Image()\n\n image.onload = () => resolve(image)\n image.onerror = reject\n image.src = src\n })\n}\n\nfunction imageSizes(breakpoints: Breakpoints, width?: Props['width']): string {\n const baseDevice = breakpoints.find(breakpoint => breakpoint.maxWidth == null)\n const baseWidth = baseDevice && width && findBreakpointOverride(breakpoints, width, baseDevice.id)\n const baseWidthSize =\n baseWidth == null || baseWidth.value.unit !== 'px' ? '100vw' : `${baseWidth.value.value}px`\n\n return breakpoints\n .map(breakpoint => {\n const override = findBreakpointOverride(breakpoints, width, breakpoint.id)\n\n if (override == null || breakpoint.maxWidth == null || override.value.unit !== 'px') {\n return null\n }\n\n return `(max-width: ${breakpoint.maxWidth}px) ${Math.min(\n breakpoint.maxWidth,\n override.value.value,\n )}px`\n })\n .filter((size): size is NonNullable<typeof size> => size != null)\n .reduce((sourceSizes, sourceSize) => `${sourceSize}, ${sourceSizes}`, baseWidthSize)\n}\n\ntype Dimensions = {\n width: number\n height: number\n}\n\nconst ImageComponent = forwardRef(function Image(\n {\n id,\n width,\n margin,\n padding,\n file,\n border,\n borderRadius,\n altText,\n link,\n opacity,\n boxShadow,\n aspectRatio,\n placeholder = placeholders.image,\n className,\n priority,\n }: Props,\n ref: Ref<HTMLAnchorElement & HTMLDivElement>,\n) {\n const fileId = match(file)\n .with(P.string, v => v)\n .with({ type: 'makeswift-file', version: 1 }, v => v.id)\n .otherwise(() => null)\n const fileData = useFile(fileId)\n const imageSrc = match([file, fileData])\n .with([P.any, P.not(P.nullish)], ([, fileData]) => fileData.publicUrl)\n .with([{ type: 'external-file', version: 1 }, P.any], ([file]) => file.url)\n .otherwise(() => placeholder.src)\n const dataDimensions = match([file, fileData, imageSrc])\n .with(\n [{ type: 'external-file', version: 1, width: P.number, height: P.number }, P.any, P.any],\n ([externalFile]) => ({ width: externalFile.width, height: externalFile.height }),\n )\n .with([P.any, P.not(P.nullish), P.any], ([, data]) => data.dimensions)\n .with([P.any, P.any, placeholder.src], () => placeholder.dimensions)\n .otherwise(() => null)\n const [measuredDimensions, setMeasuredDimensions] = useState<Dimensions | null>(null)\n const breakpoints = useBreakpoints()\n\n useEffect(() => {\n if (dataDimensions) return\n\n let cleanedUp = false\n\n loadImage(imageSrc)\n .then(image => {\n if (!cleanedUp) {\n setMeasuredDimensions({ width: image.naturalWidth, height: image.naturalHeight })\n }\n })\n .catch(console.error)\n\n return () => {\n cleanedUp = true\n }\n }, [dataDimensions, imageSrc])\n\n const dimensions = dataDimensions ?? measuredDimensions\n const Container = link ? Link : 'div'\n const containerClassName = cx(\n useStyle({ lineHeight: 0, overflow: 'hidden' }),\n useStyle(useResponsiveWidth(width, dimensions?.width)),\n useStyle(useResponsiveStyle([opacity] as const, ([opacity = 1]) => ({ opacity }))),\n margin,\n padding,\n border,\n borderRadius,\n boxShadow,\n className,\n )\n\n const { Image } = useFrameworkContext()\n\n const imageClassName = useStyle(\n useResponsiveStyle([aspectRatio] as const, ([aspectRatio = 'original']) => ({\n width: '100%',\n height: 'auto',\n ...(aspectRatio !== 'original' && {\n aspectRatio: aspectRatioValues[aspectRatio],\n objectFit: 'cover',\n }),\n })),\n )\n\n if (!dimensions) return null\n\n return (\n <Container link={link} ref={ref} id={id} className={containerClassName}>\n <Image\n src={imageSrc}\n priority={priority}\n sizes={imageSizes(breakpoints, width)}\n alt={altText ?? ''}\n width={dimensions.width}\n height={dimensions.height}\n className={imageClassName}\n />\n </Container>\n )\n})\n\nexport default ImageComponent\n"],"mappings":"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","names":["Image","fileData","file","opacity","aspectRatio"]}
@@ -12,6 +12,7 @@ import {
12
12
  ElementID,
13
13
  Image,
14
14
  ResponsiveOpacity,
15
+ ResponsiveSelect,
15
16
  TextInput
16
17
  } from "@makeswift/prop-controllers";
17
18
  function registerComponent(runtime) {
@@ -26,6 +27,17 @@ function registerComponent(runtime) {
26
27
  altText: TextInput({ label: "Alt text" }),
27
28
  link: Link({ label: "On click" }),
28
29
  width: Width(),
30
+ aspectRatio: ResponsiveSelect({
31
+ label: "Aspect ratio",
32
+ labelOrientation: "vertical",
33
+ options: [
34
+ { value: "original", label: "Original" },
35
+ { value: "16:9", label: "16:9" },
36
+ { value: "4:3", label: "4:3" },
37
+ { value: "1:1", label: "1:1" }
38
+ ],
39
+ defaultValue: "original"
40
+ }),
29
41
  margin: Margin({ format: Margin.Format.ClassName }),
30
42
  padding: Padding({ format: Padding.Format.ClassName }),
31
43
  border: Border({ format: Border.Format.ClassName }),
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/builtin/Image/register.ts"],"sourcesContent":["import { lazy } from 'react'\nimport { type ReactRuntimeCore } from '../../../runtimes/react/react-runtime-core'\nimport { MakeswiftComponentType } from '../constants'\nimport {\n Border,\n Link,\n Shadows,\n Checkbox,\n BorderRadius,\n Margin,\n Padding,\n Width,\n ElementID,\n Image,\n ResponsiveOpacity,\n TextInput,\n} from '@makeswift/prop-controllers'\n\nexport function registerComponent(runtime: ReactRuntimeCore) {\n return runtime.registerComponent(\n lazy(() => import('./Image')),\n {\n type: MakeswiftComponentType.Image,\n label: 'Image',\n props: {\n id: ElementID(),\n file: Image(),\n altText: TextInput({ label: 'Alt text' }),\n link: Link({ label: 'On click' }),\n width: Width(),\n margin: Margin({ format: Margin.Format.ClassName }),\n padding: Padding({ format: Padding.Format.ClassName }),\n border: Border({ format: Border.Format.ClassName }),\n borderRadius: BorderRadius({ format: BorderRadius.Format.ClassName }),\n boxShadow: Shadows({ format: Shadows.Format.ClassName }),\n opacity: ResponsiveOpacity(),\n priority: Checkbox({ label: 'Priority' }),\n },\n },\n )\n}\n"],"mappings":"AAAA,SAAS,YAAY;AAErB,SAAS,8BAA8B;AACvC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEA,SAAS,kBAAkB,SAA2B;AAC3D,SAAO,QAAQ;AAAA,IACb,KAAK,MAAM,OAAO,SAAS,CAAC;AAAA,IAC5B;AAAA,MACE,MAAM,uBAAuB;AAAA,MAC7B,OAAO;AAAA,MACP,OAAO;AAAA,QACL,IAAI,UAAU;AAAA,QACd,MAAM,MAAM;AAAA,QACZ,SAAS,UAAU,EAAE,OAAO,WAAW,CAAC;AAAA,QACxC,MAAM,KAAK,EAAE,OAAO,WAAW,CAAC;AAAA,QAChC,OAAO,MAAM;AAAA,QACb,QAAQ,OAAO,EAAE,QAAQ,OAAO,OAAO,UAAU,CAAC;AAAA,QAClD,SAAS,QAAQ,EAAE,QAAQ,QAAQ,OAAO,UAAU,CAAC;AAAA,QACrD,QAAQ,OAAO,EAAE,QAAQ,OAAO,OAAO,UAAU,CAAC;AAAA,QAClD,cAAc,aAAa,EAAE,QAAQ,aAAa,OAAO,UAAU,CAAC;AAAA,QACpE,WAAW,QAAQ,EAAE,QAAQ,QAAQ,OAAO,UAAU,CAAC;AAAA,QACvD,SAAS,kBAAkB;AAAA,QAC3B,UAAU,SAAS,EAAE,OAAO,WAAW,CAAC;AAAA,MAC1C;AAAA,IACF;AAAA,EACF;AACF;","names":[]}
1
+ {"version":3,"sources":["../../../../../src/components/builtin/Image/register.ts"],"sourcesContent":["import { lazy } from 'react'\nimport { type ReactRuntimeCore } from '../../../runtimes/react/react-runtime-core'\nimport { MakeswiftComponentType } from '../constants'\nimport {\n Border,\n Link,\n Shadows,\n Checkbox,\n BorderRadius,\n Margin,\n Padding,\n Width,\n ElementID,\n Image,\n ResponsiveOpacity,\n ResponsiveSelect,\n TextInput,\n} from '@makeswift/prop-controllers'\n\nexport function registerComponent(runtime: ReactRuntimeCore) {\n return runtime.registerComponent(\n lazy(() => import('./Image')),\n {\n type: MakeswiftComponentType.Image,\n label: 'Image',\n props: {\n id: ElementID(),\n file: Image(),\n altText: TextInput({ label: 'Alt text' }),\n link: Link({ label: 'On click' }),\n width: Width(),\n aspectRatio: ResponsiveSelect({\n label: 'Aspect ratio',\n labelOrientation: 'vertical',\n options: [\n { value: 'original', label: 'Original' },\n { value: '16:9', label: '16:9' },\n { value: '4:3', label: '4:3' },\n { value: '1:1', label: '1:1' },\n ],\n defaultValue: 'original',\n }),\n margin: Margin({ format: Margin.Format.ClassName }),\n padding: Padding({ format: Padding.Format.ClassName }),\n border: Border({ format: Border.Format.ClassName }),\n borderRadius: BorderRadius({ format: BorderRadius.Format.ClassName }),\n boxShadow: Shadows({ format: Shadows.Format.ClassName }),\n opacity: ResponsiveOpacity(),\n priority: Checkbox({ label: 'Priority' }),\n },\n },\n )\n}\n"],"mappings":"AAAA,SAAS,YAAY;AAErB,SAAS,8BAA8B;AACvC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEA,SAAS,kBAAkB,SAA2B;AAC3D,SAAO,QAAQ;AAAA,IACb,KAAK,MAAM,OAAO,SAAS,CAAC;AAAA,IAC5B;AAAA,MACE,MAAM,uBAAuB;AAAA,MAC7B,OAAO;AAAA,MACP,OAAO;AAAA,QACL,IAAI,UAAU;AAAA,QACd,MAAM,MAAM;AAAA,QACZ,SAAS,UAAU,EAAE,OAAO,WAAW,CAAC;AAAA,QACxC,MAAM,KAAK,EAAE,OAAO,WAAW,CAAC;AAAA,QAChC,OAAO,MAAM;AAAA,QACb,aAAa,iBAAiB;AAAA,UAC5B,OAAO;AAAA,UACP,kBAAkB;AAAA,UAClB,SAAS;AAAA,YACP,EAAE,OAAO,YAAY,OAAO,WAAW;AAAA,YACvC,EAAE,OAAO,QAAQ,OAAO,OAAO;AAAA,YAC/B,EAAE,OAAO,OAAO,OAAO,MAAM;AAAA,YAC7B,EAAE,OAAO,OAAO,OAAO,MAAM;AAAA,UAC/B;AAAA,UACA,cAAc;AAAA,QAChB,CAAC;AAAA,QACD,QAAQ,OAAO,EAAE,QAAQ,OAAO,OAAO,UAAU,CAAC;AAAA,QAClD,SAAS,QAAQ,EAAE,QAAQ,QAAQ,OAAO,UAAU,CAAC;AAAA,QACrD,QAAQ,OAAO,EAAE,QAAQ,OAAO,OAAO,UAAU,CAAC;AAAA,QAClD,cAAc,aAAa,EAAE,QAAQ,aAAa,OAAO,UAAU,CAAC;AAAA,QACpE,WAAW,QAAQ,EAAE,QAAQ,QAAQ,OAAO,UAAU,CAAC;AAAA,QACvD,SAAS,kBAAkB;AAAA,QAC3B,UAAU,SAAS,EAAE,OAAO,WAAW,CAAC;AAAA,MAC1C;AAAA,IACF;AAAA,EACF;AACF;","names":[]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/runtimes/react/components/framework-context.tsx"],"sourcesContent":["'use client'\n\nimport {\n type ReactNode,\n type PropsWithChildren,\n type CSSProperties,\n type ComponentPropsWithoutRef,\n type MouseEvent,\n type ForwardRefExoticComponent,\n type RefAttributes,\n forwardRef,\n createContext,\n useContext,\n useMemo,\n} from 'react'\n\nimport { type LinkData } from '@makeswift/prop-controllers'\n\nimport { type Snippet } from '../../../client/page-snapshot'\n\nimport { type RenderElementPayload } from '../server/render-element-payload'\n\nimport { BaseHeadSnippet } from './page/HeadSnippet'\n\ntype HeadComponent = (props: { children: ReactNode }) => ReactNode\ntype HeadSnippet = (props: { snippet: Snippet }) => ReactNode\ntype ImageComponent = (props: {\n src: string\n alt: string\n sizes?: string\n width?: number\n height?: number\n priority?: boolean\n fill?: boolean\n style?: CSSProperties\n}) => ReactNode\n\ntype LinkProps = Omit<ComponentPropsWithoutRef<'a'>, 'onClick'> & {\n linkType?: LinkData['type']\n onClick?: (event: MouseEvent<HTMLAnchorElement>) => unknown\n}\n\ntype LinkComponent = ForwardRefExoticComponent<RefAttributes<HTMLAnchorElement> & LinkProps>\n\nexport type FrameworkContext = {\n Head: HeadComponent\n HeadSnippet: HeadSnippet\n Image: ImageComponent\n Link: LinkComponent\n /**\n * Callback to render a single RSC element on the server and return the result.\n */\n renderRSCElement?: (args: RenderElementPayload) => Promise<ReactNode>\n}\n\n// React 19 automatically hoists metadata tags to the <head>\nconst DefaultHead = ({ children }: PropsWithChildren) => <>{children}</>\n\nconst DefaultHeadSnippet = BaseHeadSnippet\n\nconst DefaultImage: ImageComponent = ({ priority, fill, style, ...props }) => (\n <img\n {...props}\n style={{\n ...(fill\n ? {\n height: '100%',\n width: '100%',\n objectFit: 'cover',\n }\n : {}),\n ...style,\n }}\n loading={priority ? 'eager' : 'lazy'}\n />\n)\n\nconst DefaultLink: LinkComponent = forwardRef<HTMLAnchorElement, LinkProps>(\n ({ linkType, ...props }, ref) => <a {...props} ref={ref} />,\n)\n\nconst FrameworkContext = createContext<Partial<FrameworkContext>>({})\n\nexport const FrameworkContextProvider = ({\n value,\n children,\n}: PropsWithChildren<{ value: Partial<FrameworkContext> }>) => {\n const parentContext = useContext(FrameworkContext)\n const mergedContext = useMemo(() => ({ ...parentContext, ...value }), [parentContext, value])\n\n return <FrameworkContext.Provider value={mergedContext}>{children}</FrameworkContext.Provider>\n}\n\nconst defaultContext: FrameworkContext = {\n Head: DefaultHead,\n HeadSnippet: DefaultHeadSnippet,\n Image: DefaultImage,\n Link: DefaultLink,\n}\n\nexport function useFrameworkContext(): FrameworkContext {\n return { ...defaultContext, ...useContext(FrameworkContext) }\n}\n"],"mappings":";AAwDyD;AAtDzD;AAAA,EAQE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAQP,SAAS,uBAAuB;AAkChC,MAAM,cAAc,CAAC,EAAE,SAAS,MAAyB,gCAAG,UAAS;AAErE,MAAM,qBAAqB;AAE3B,MAAM,eAA+B,CAAC,EAAE,UAAU,MAAM,OAAO,GAAG,MAAM,MACtE;AAAA,EAAC;AAAA;AAAA,IACE,GAAG;AAAA,IACJ,OAAO;AAAA,MACL,GAAI,OACA;AAAA,QACE,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,WAAW;AAAA,MACb,IACA,CAAC;AAAA,MACL,GAAG;AAAA,IACL;AAAA,IACA,SAAS,WAAW,UAAU;AAAA;AAChC;AAGF,MAAM,cAA6B;AAAA,EACjC,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,QAAQ,oBAAC,OAAG,GAAG,OAAO,KAAU;AAC3D;AAEA,MAAM,mBAAmB,cAAyC,CAAC,CAAC;AAE7D,MAAM,2BAA2B,CAAC;AAAA,EACvC;AAAA,EACA;AACF,MAA+D;AAC7D,QAAM,gBAAgB,WAAW,gBAAgB;AACjD,QAAM,gBAAgB,QAAQ,OAAO,EAAE,GAAG,eAAe,GAAG,MAAM,IAAI,CAAC,eAAe,KAAK,CAAC;AAE5F,SAAO,oBAAC,iBAAiB,UAAjB,EAA0B,OAAO,eAAgB,UAAS;AACpE;AAEA,MAAM,iBAAmC;AAAA,EACvC,MAAM;AAAA,EACN,aAAa;AAAA,EACb,OAAO;AAAA,EACP,MAAM;AACR;AAEO,SAAS,sBAAwC;AACtD,SAAO,EAAE,GAAG,gBAAgB,GAAG,WAAW,gBAAgB,EAAE;AAC9D;","names":[]}
1
+ {"version":3,"sources":["../../../../../src/runtimes/react/components/framework-context.tsx"],"sourcesContent":["'use client'\n\nimport {\n type ReactNode,\n type PropsWithChildren,\n type CSSProperties,\n type ComponentPropsWithoutRef,\n type MouseEvent,\n type ForwardRefExoticComponent,\n type RefAttributes,\n forwardRef,\n createContext,\n useContext,\n useMemo,\n} from 'react'\n\nimport { type LinkData } from '@makeswift/prop-controllers'\n\nimport { type Snippet } from '../../../client/page-snapshot'\n\nimport { type RenderElementPayload } from '../server/render-element-payload'\n\nimport { BaseHeadSnippet } from './page/HeadSnippet'\n\ntype HeadComponent = (props: { children: ReactNode }) => ReactNode\ntype HeadSnippet = (props: { snippet: Snippet }) => ReactNode\ntype ImageComponent = (props: {\n src: string\n alt: string\n sizes?: string\n width?: number\n height?: number\n priority?: boolean\n fill?: boolean\n style?: CSSProperties\n className?: string\n}) => ReactNode\n\ntype LinkProps = Omit<ComponentPropsWithoutRef<'a'>, 'onClick'> & {\n linkType?: LinkData['type']\n onClick?: (event: MouseEvent<HTMLAnchorElement>) => unknown\n}\n\ntype LinkComponent = ForwardRefExoticComponent<RefAttributes<HTMLAnchorElement> & LinkProps>\n\nexport type FrameworkContext = {\n Head: HeadComponent\n HeadSnippet: HeadSnippet\n Image: ImageComponent\n Link: LinkComponent\n /**\n * Callback to render a single RSC element on the server and return the result.\n */\n renderRSCElement?: (args: RenderElementPayload) => Promise<ReactNode>\n}\n\n// React 19 automatically hoists metadata tags to the <head>\nconst DefaultHead = ({ children }: PropsWithChildren) => <>{children}</>\n\nconst DefaultHeadSnippet = BaseHeadSnippet\n\nconst DefaultImage: ImageComponent = ({ priority, fill, style, ...props }) => (\n <img\n {...props}\n style={{\n ...(fill\n ? {\n height: '100%',\n width: '100%',\n objectFit: 'cover',\n }\n : {}),\n ...style,\n }}\n loading={priority ? 'eager' : 'lazy'}\n />\n)\n\nconst DefaultLink: LinkComponent = forwardRef<HTMLAnchorElement, LinkProps>(\n ({ linkType, ...props }, ref) => <a {...props} ref={ref} />,\n)\n\nconst FrameworkContext = createContext<Partial<FrameworkContext>>({})\n\nexport const FrameworkContextProvider = ({\n value,\n children,\n}: PropsWithChildren<{ value: Partial<FrameworkContext> }>) => {\n const parentContext = useContext(FrameworkContext)\n const mergedContext = useMemo(() => ({ ...parentContext, ...value }), [parentContext, value])\n\n return <FrameworkContext.Provider value={mergedContext}>{children}</FrameworkContext.Provider>\n}\n\nconst defaultContext: FrameworkContext = {\n Head: DefaultHead,\n HeadSnippet: DefaultHeadSnippet,\n Image: DefaultImage,\n Link: DefaultLink,\n}\n\nexport function useFrameworkContext(): FrameworkContext {\n return { ...defaultContext, ...useContext(FrameworkContext) }\n}\n"],"mappings":";AAyDyD;AAvDzD;AAAA,EAQE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAQP,SAAS,uBAAuB;AAmChC,MAAM,cAAc,CAAC,EAAE,SAAS,MAAyB,gCAAG,UAAS;AAErE,MAAM,qBAAqB;AAE3B,MAAM,eAA+B,CAAC,EAAE,UAAU,MAAM,OAAO,GAAG,MAAM,MACtE;AAAA,EAAC;AAAA;AAAA,IACE,GAAG;AAAA,IACJ,OAAO;AAAA,MACL,GAAI,OACA;AAAA,QACE,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,WAAW;AAAA,MACb,IACA,CAAC;AAAA,MACL,GAAG;AAAA,IACL;AAAA,IACA,SAAS,WAAW,UAAU;AAAA;AAChC;AAGF,MAAM,cAA6B;AAAA,EACjC,CAAC,EAAE,UAAU,GAAG,MAAM,GAAG,QAAQ,oBAAC,OAAG,GAAG,OAAO,KAAU;AAC3D;AAEA,MAAM,mBAAmB,cAAyC,CAAC,CAAC;AAE7D,MAAM,2BAA2B,CAAC;AAAA,EACvC;AAAA,EACA;AACF,MAA+D;AAC7D,QAAM,gBAAgB,WAAW,gBAAgB;AACjD,QAAM,gBAAgB,QAAQ,OAAO,EAAE,GAAG,eAAe,GAAG,MAAM,IAAI,CAAC,eAAe,KAAK,CAAC;AAE5F,SAAO,oBAAC,iBAAiB,UAAjB,EAA0B,OAAO,eAAgB,UAAS;AACpE;AAEA,MAAM,iBAAmC;AAAA,EACvC,MAAM;AAAA,EACN,aAAa;AAAA,EACb,OAAO;AAAA,EACP,MAAM;AACR;AAEO,SAAS,sBAAwC;AACtD,SAAO,EAAE,GAAG,gBAAgB,GAAG,WAAW,gBAAgB,EAAE;AAC9D;","names":[]}
@@ -1,10 +1,12 @@
1
- import { LinkData, ResponsiveLengthData, ImageData, ResponsiveOpacityValue } from '@makeswift/prop-controllers';
1
+ import { LinkData, ResponsiveLengthData, ImageData, ResponsiveOpacityValue, ResponsiveSelectValue } from '@makeswift/prop-controllers';
2
+ type AspectRatio = 'original' | '16:9' | '4:3' | '1:1';
2
3
  type Props = {
3
4
  id?: string;
4
5
  file?: ImageData;
5
6
  altText?: string;
6
7
  link?: LinkData;
7
8
  width?: ResponsiveLengthData;
9
+ aspectRatio?: ResponsiveSelectValue<AspectRatio>;
8
10
  margin?: string;
9
11
  padding?: string;
10
12
  border?: string;
@@ -1 +1 @@
1
- {"version":3,"file":"Image.d.ts","sourceRoot":"","sources":["../../../../../src/components/builtin/Image/Image.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,QAAQ,EACR,oBAAoB,EACpB,SAAS,EACT,sBAAsB,EACvB,MAAM,6BAA6B,CAAA;AAapC,KAAK,KAAK,GAAG;IACX,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,KAAK,CAAC,EAAE,oBAAoB,CAAA;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,sBAAsB,CAAA;IAChC,WAAW,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE;YAAE,KAAK,EAAE,MAAM,CAAC;YAAC,MAAM,EAAE,MAAM,CAAA;SAAE,CAAA;KAAE,CAAA;IAC5E,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAwCD,QAAA,MAAM,cAAc,sHA2FlB,CAAA;AAEF,eAAe,cAAc,CAAA"}
1
+ {"version":3,"file":"Image.d.ts","sourceRoot":"","sources":["../../../../../src/components/builtin/Image/Image.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,QAAQ,EACR,oBAAoB,EACpB,SAAS,EACT,sBAAsB,EACtB,qBAAqB,EACtB,MAAM,6BAA6B,CAAA;AAapC,KAAK,WAAW,GAAG,UAAU,GAAG,MAAM,GAAG,KAAK,GAAG,KAAK,CAAA;AAQtD,KAAK,KAAK,GAAG;IACX,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,KAAK,CAAC,EAAE,oBAAoB,CAAA;IAC5B,WAAW,CAAC,EAAE,qBAAqB,CAAC,WAAW,CAAC,CAAA;IAChD,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,sBAAsB,CAAA;IAChC,WAAW,CAAC,EAAE;QAAE,GAAG,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE;YAAE,KAAK,EAAE,MAAM,CAAC;YAAC,MAAM,EAAE,MAAM,CAAA;SAAE,CAAA;KAAE,CAAA;IAC5E,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAwCD,QAAA,MAAM,cAAc,sHAoGlB,CAAA;AAEF,eAAe,cAAc,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"register.d.ts","sourceRoot":"","sources":["../../../../../src/components/builtin/Image/register.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,gBAAgB,EAAE,MAAM,4CAA4C,CAAA;AAiBlF,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,gBAAgB,cAsB1D"}
1
+ {"version":3,"file":"register.d.ts","sourceRoot":"","sources":["../../../../../src/components/builtin/Image/register.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,gBAAgB,EAAE,MAAM,4CAA4C,CAAA;AAkBlF,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,gBAAgB,cAiC1D"}
@@ -5,6 +5,7 @@ export declare const componentRegistration: import("@makeswift/controls").ListDe
5
5
  description?: string | undefined;
6
6
  defaultValue?: string | undefined;
7
7
  selectAll?: boolean | undefined;
8
+ provides?: undefined;
8
9
  }>;
9
10
  label?: string;
10
11
  description?: string;
@@ -1 +1 @@
1
- {"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../../../../src/controls/__tests__/fixtures/list.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmB,KAAK,QAAQ,EAAE,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAEzF,eAAO,MAAM,qBAAqB;;;;;;;;;;EAEhC,CAAA;AAEF,KAAK,IAAI,GAAG,QAAQ,CAAC,OAAO,qBAAqB,CAAC,CAAA;AAElD,eAAO,MAAM,yBAAyB,EAAE,IAUvC,CAAA;AAED,eAAO,MAAM,uBAAuB,EAAE,IAUrC,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,cAK5B,CAAA"}
1
+ {"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../../../../src/controls/__tests__/fixtures/list.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmB,KAAK,QAAQ,EAAE,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAEzF,eAAO,MAAM,qBAAqB;;;;;;;;;;;EAEhC,CAAA;AAEF,KAAK,IAAI,GAAG,QAAQ,CAAC,OAAO,qBAAqB,CAAC,CAAA;AAElD,eAAO,MAAM,yBAAyB,EAAE,IAUvC,CAAA;AAED,eAAO,MAAM,uBAAuB,EAAE,IAUrC,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,cAK5B,CAAA"}
@@ -6,6 +6,7 @@ export declare const componentRegistration: import("@makeswift/controls").ShapeD
6
6
  description?: string | undefined;
7
7
  defaultValue?: string | undefined;
8
8
  selectAll?: boolean | undefined;
9
+ provides?: undefined;
9
10
  }>;
10
11
  link: import("../../link").LinkDefinition;
11
12
  number: import("@makeswift/controls").NumberDefinition<{
@@ -17,6 +18,7 @@ export declare const componentRegistration: import("@makeswift/controls").ShapeD
17
18
  max?: number | undefined;
18
19
  step?: number | undefined;
19
20
  suffix?: string | undefined;
21
+ provides?: undefined;
20
22
  }>;
21
23
  };
22
24
  }>;
@@ -1 +1 @@
1
- {"version":3,"file":"shape.d.ts","sourceRoot":"","sources":["../../../../../src/controls/__tests__/fixtures/shape.ts"],"names":[],"mappings":"AAAA,OAAO,EAA4B,KAAK,QAAQ,EAAE,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAIlG,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;EAMhC,CAAA;AAEF,KAAK,IAAI,GAAG,QAAQ,CAAC,OAAO,qBAAqB,CAAC,CAAA;AAElD,eAAO,MAAM,yBAAyB,EAAE,IAIvC,CAAA;AAED,eAAO,MAAM,uBAAuB,EAAE,IAIrC,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,cAI5B,CAAA"}
1
+ {"version":3,"file":"shape.d.ts","sourceRoot":"","sources":["../../../../../src/controls/__tests__/fixtures/shape.ts"],"names":[],"mappings":"AAAA,OAAO,EAA4B,KAAK,QAAQ,EAAE,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAIlG,eAAO,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;EAMhC,CAAA;AAEF,KAAK,IAAI,GAAG,QAAQ,CAAC,OAAO,qBAAqB,CAAC,CAAA;AAElD,eAAO,MAAM,yBAAyB,EAAE,IAIvC,CAAA;AAED,eAAO,MAAM,uBAAuB,EAAE,IAIrC,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,cAI5B,CAAA"}
@@ -17,6 +17,7 @@ type ImageComponent = (props: {
17
17
  priority?: boolean;
18
18
  fill?: boolean;
19
19
  style?: CSSProperties;
20
+ className?: string;
20
21
  }) => ReactNode;
21
22
  type LinkProps = Omit<ComponentPropsWithoutRef<'a'>, 'onClick'> & {
22
23
  linkType?: LinkData['type'];
@@ -1 +1 @@
1
- {"version":3,"file":"framework-context.d.ts","sourceRoot":"","sources":["../../../../../src/runtimes/react/components/framework-context.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,SAAS,EACd,KAAK,iBAAiB,EACtB,KAAK,aAAa,EAClB,KAAK,wBAAwB,EAC7B,KAAK,UAAU,EACf,KAAK,yBAAyB,EAC9B,KAAK,aAAa,EAKnB,MAAM,OAAO,CAAA;AAEd,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAE3D,OAAO,EAAE,KAAK,OAAO,EAAE,MAAM,+BAA+B,CAAA;AAE5D,OAAO,EAAE,KAAK,oBAAoB,EAAE,MAAM,kCAAkC,CAAA;AAI5E,KAAK,aAAa,GAAG,CAAC,KAAK,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,KAAK,SAAS,CAAA;AAClE,KAAK,WAAW,GAAG,CAAC,KAAK,EAAE;IAAE,OAAO,EAAE,OAAO,CAAA;CAAE,KAAK,SAAS,CAAA;AAC7D,KAAK,cAAc,GAAG,CAAC,KAAK,EAAE;IAC5B,GAAG,EAAE,MAAM,CAAA;IACX,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,KAAK,SAAS,CAAA;AAEf,KAAK,SAAS,GAAG,IAAI,CAAC,wBAAwB,CAAC,GAAG,CAAC,EAAE,SAAS,CAAC,GAAG;IAChE,QAAQ,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAA;IAC3B,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,OAAO,CAAA;CAC5D,CAAA;AAED,KAAK,aAAa,GAAG,yBAAyB,CAAC,aAAa,CAAC,iBAAiB,CAAC,GAAG,SAAS,CAAC,CAAA;AAE5F,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,EAAE,aAAa,CAAA;IACnB,WAAW,EAAE,WAAW,CAAA;IACxB,KAAK,EAAE,cAAc,CAAA;IACrB,IAAI,EAAE,aAAa,CAAA;IACnB;;OAEG;IACH,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,OAAO,CAAC,SAAS,CAAC,CAAA;CACtE,CAAA;AA8BD,eAAO,MAAM,wBAAwB,GAAI,sBAGtC,iBAAiB,CAAC;IAAE,KAAK,EAAE,OAAO,CAAC,gBAAgB,CAAC,CAAA;CAAE,CAAC,4CAKzD,CAAA;AASD,wBAAgB,mBAAmB,IAAI,gBAAgB,CAEtD"}
1
+ {"version":3,"file":"framework-context.d.ts","sourceRoot":"","sources":["../../../../../src/runtimes/react/components/framework-context.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,SAAS,EACd,KAAK,iBAAiB,EACtB,KAAK,aAAa,EAClB,KAAK,wBAAwB,EAC7B,KAAK,UAAU,EACf,KAAK,yBAAyB,EAC9B,KAAK,aAAa,EAKnB,MAAM,OAAO,CAAA;AAEd,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAE3D,OAAO,EAAE,KAAK,OAAO,EAAE,MAAM,+BAA+B,CAAA;AAE5D,OAAO,EAAE,KAAK,oBAAoB,EAAE,MAAM,kCAAkC,CAAA;AAI5E,KAAK,aAAa,GAAG,CAAC,KAAK,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,KAAK,SAAS,CAAA;AAClE,KAAK,WAAW,GAAG,CAAC,KAAK,EAAE;IAAE,OAAO,EAAE,OAAO,CAAA;CAAE,KAAK,SAAS,CAAA;AAC7D,KAAK,cAAc,GAAG,CAAC,KAAK,EAAE;IAC5B,GAAG,EAAE,MAAM,CAAA;IACX,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,KAAK,SAAS,CAAA;AAEf,KAAK,SAAS,GAAG,IAAI,CAAC,wBAAwB,CAAC,GAAG,CAAC,EAAE,SAAS,CAAC,GAAG;IAChE,QAAQ,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAA;IAC3B,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,OAAO,CAAA;CAC5D,CAAA;AAED,KAAK,aAAa,GAAG,yBAAyB,CAAC,aAAa,CAAC,iBAAiB,CAAC,GAAG,SAAS,CAAC,CAAA;AAE5F,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,EAAE,aAAa,CAAA;IACnB,WAAW,EAAE,WAAW,CAAA;IACxB,KAAK,EAAE,cAAc,CAAA;IACrB,IAAI,EAAE,aAAa,CAAA;IACnB;;OAEG;IACH,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,OAAO,CAAC,SAAS,CAAC,CAAA;CACtE,CAAA;AA8BD,eAAO,MAAM,wBAAwB,GAAI,sBAGtC,iBAAiB,CAAC;IAAE,KAAK,EAAE,OAAO,CAAC,gBAAgB,CAAC,CAAA;CAAE,CAAC,4CAKzD,CAAA;AASD,wBAAgB,mBAAmB,IAAI,gBAAgB,CAEtD"}
@@ -27,7 +27,19 @@ export declare const ListActions: {
27
27
  export declare function onKeyDown(e: KeyboardEvent, editor: Editor): void;
28
28
  export declare function withBlock(editor: Editor): import("../../slate/types").MakeswiftEditor;
29
29
  export declare function BlockPlugin(): {
30
- control: import("@makeswift/controls").RichTextPluginControl<import("@makeswift/controls").SelectDefinition<import("@makeswift/controls").SelectConfig<"paragraph" | "heading-one" | "heading-two" | "heading-three" | "heading-four" | "heading-five" | "heading-six" | "blockquote" | "unordered-list" | "ordered-list"> & {
30
+ control: import("@makeswift/controls").RichTextPluginControl<import("@makeswift/controls").SelectDefinition<import("@makeswift/controls").ProvidesConfig<never> & {
31
+ readonly options: readonly [{
32
+ readonly value: "paragraph" | "heading-one" | "heading-two" | "heading-three" | "heading-four" | "heading-five" | "heading-six" | "blockquote" | "unordered-list" | "ordered-list";
33
+ readonly label: string;
34
+ }, ...{
35
+ readonly value: "paragraph" | "heading-one" | "heading-two" | "heading-three" | "heading-four" | "heading-five" | "heading-six" | "blockquote" | "unordered-list" | "ordered-list";
36
+ readonly label: string;
37
+ }[]];
38
+ readonly defaultValue?: "paragraph" | "heading-one" | "heading-two" | "heading-three" | "heading-four" | "heading-five" | "heading-six" | "blockquote" | "unordered-list" | "ordered-list" | undefined;
39
+ readonly label?: string;
40
+ readonly labelOrientation?: "horizontal" | "vertical";
41
+ readonly description?: string;
42
+ } & {
31
43
  readonly defaultValue: "paragraph" | "heading-one" | "heading-two" | "heading-three" | "heading-four" | "heading-five" | "heading-six" | "blockquote" | "unordered-list" | "ordered-list";
32
44
  }>, "paragraph" | "heading-one" | "heading-two" | "heading-three" | "heading-four" | "heading-five" | "heading-six" | "blockquote" | "unordered-list" | "ordered-list"> | undefined;
33
45
  withPlugin: ((editor: Editor) => Editor) | undefined;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/slate/BlockPlugin/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAE1C,OAAO,EAAE,MAAM,EAA0C,MAAM,OAAO,CAAA;AACtE,OAAO,EAAE,KAAK,kBAAkB,EAAE,MAAM,aAAa,CAAA;AAGrD,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAA;AAC7D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAA;AACjE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAI7C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAKzC,OAAO,EAAE,KAAK,aAAa,EAAU,MAAM,oCAAoC,CAAA;AAG/E,eAAO,MAAM,YAAY;;;;;CAKxB,CAAA;AAID,eAAO,MAAM,WAAW;;;;;;CAMvB,CAAA;AAED,wBAAgB,SAAS,CAAC,CAAC,EAAE,aAAa,EAAE,MAAM,EAAE,MAAM,QAwEzD;AAED,wBAAgB,SAAS,CAAC,MAAM,EAAE,MAAM,+CAoGvC;AAkDD,wBAAgB,WAAW;;;;;;;;EAkD1B"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/slate/BlockPlugin/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAE1C,OAAO,EAAE,MAAM,EAA0C,MAAM,OAAO,CAAA;AACtE,OAAO,EAAE,KAAK,kBAAkB,EAAE,MAAM,aAAa,CAAA;AAGrD,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAA;AAC7D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAA;AACjE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAI7C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AACjC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAKzC,OAAO,EAAE,KAAK,aAAa,EAAU,MAAM,oCAAoC,CAAA;AAG/E,eAAO,MAAM,YAAY;;;;;CAKxB,CAAA;AAID,eAAO,MAAM,WAAW;;;;;;CAMvB,CAAA;AAED,wBAAgB,SAAS,CAAC,CAAC,EAAE,aAAa,EAAE,MAAM,EAAE,MAAM,QAwEzD;AAED,wBAAgB,SAAS,CAAC,MAAM,EAAE,MAAM,+CAoGvC;AAkDD,wBAAgB,WAAW;;;;;;;;;;;;;;;;;;;;EAkD1B"}
@@ -3,7 +3,19 @@ import { type RenderElementProps } from 'slate-react';
3
3
  import { type RenderElement } from '../../controls/rich-text-v2/plugin';
4
4
  export declare const withInline: (editor: Editor) => import("..").MakeswiftEditor;
5
5
  export declare function InlinePlugin(): {
6
- control: import("@makeswift/controls").RichTextPluginControl<import("@makeswift/controls").IconRadioGroupDefinition<import("@makeswift/controls").IconRadioGroupConfig<"code" | "superscript" | "subscript"> & {
6
+ control: import("@makeswift/controls").RichTextPluginControl<import("@makeswift/controls").IconRadioGroupDefinition<import("@makeswift/controls").ProvidesConfig<never> & {
7
+ readonly options: readonly [{
8
+ readonly value: "code" | "superscript" | "subscript";
9
+ readonly label: string;
10
+ readonly icon: import("@makeswift/controls").IconRadioGroupIcon;
11
+ }, ...{
12
+ readonly value: "code" | "superscript" | "subscript";
13
+ readonly label: string;
14
+ readonly icon: import("@makeswift/controls").IconRadioGroupIcon;
15
+ }[]];
16
+ readonly defaultValue?: "code" | "superscript" | "subscript" | undefined;
17
+ readonly label?: string;
18
+ } & {
7
19
  readonly defaultValue?: "code" | "superscript" | "subscript" | undefined;
8
20
  }>, import("./types").SupportedInlineType | null> | undefined;
9
21
  withPlugin: ((editor: Editor) => Editor) | undefined;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/slate/InlinePlugin/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,MAAM,EAAgB,MAAM,OAAO,CAAA;AACjD,OAAO,EAAE,KAAK,kBAAkB,EAAE,MAAM,aAAa,CAAA;AAGrD,OAAO,EAAE,KAAK,aAAa,EAAU,MAAM,oCAAoC,CAAA;AAM/E,eAAO,MAAM,UAAU,GAAI,QAAQ,MAAM,iCAQxC,CAAA;AAED,wBAAgB,YAAY;;;;;;;;EAiB3B"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/slate/InlinePlugin/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,MAAM,EAAgB,MAAM,OAAO,CAAA;AACjD,OAAO,EAAE,KAAK,kBAAkB,EAAE,MAAM,aAAa,CAAA;AAGrD,OAAO,EAAE,KAAK,aAAa,EAAU,MAAM,oCAAoC,CAAA;AAM/E,eAAO,MAAM,UAAU,GAAI,QAAQ,MAAM,iCAQxC,CAAA;AAED,wBAAgB,YAAY;;;;;;;;;;;;;;;;;;;;EAiB3B"}
@@ -2,7 +2,19 @@ import { Editor } from 'slate';
2
2
  import { Slate } from '@makeswift/controls';
3
3
  export declare const withTextAlign: (editor: Editor) => import("..").MakeswiftEditor;
4
4
  export declare function TextAlignPlugin(): {
5
- control: import("@makeswift/controls").RichTextPluginControl<import("../../controls/style-v2/style-v2").StyleV2Definition<import("@makeswift/controls").IconRadioGroupDefinition<import("@makeswift/controls").IconRadioGroupConfig<"right" | "left" | "center" | "justify"> & {
5
+ control: import("@makeswift/controls").RichTextPluginControl<import("../../controls/style-v2/style-v2").StyleV2Definition<import("@makeswift/controls").IconRadioGroupDefinition<import("@makeswift/controls").ProvidesConfig<never> & {
6
+ readonly options: readonly [{
7
+ readonly value: "right" | "left" | "center" | "justify";
8
+ readonly label: string;
9
+ readonly icon: import("@makeswift/controls").IconRadioGroupIcon;
10
+ }, ...{
11
+ readonly value: "right" | "left" | "center" | "justify";
12
+ readonly label: string;
13
+ readonly icon: import("@makeswift/controls").IconRadioGroupIcon;
14
+ }[]];
15
+ readonly defaultValue?: "right" | "left" | "center" | "justify" | undefined;
16
+ readonly label?: string;
17
+ } & {
6
18
  readonly defaultValue: "right" | "left" | "center" | "justify";
7
19
  }>>, Slate.ResponsiveBlockTextAlignment> | undefined;
8
20
  withPlugin: ((editor: Editor) => Editor) | undefined;
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/slate/TextAlignPlugin/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAsB,MAAM,OAAO,CAAA;AAClD,OAAO,EAAkB,KAAK,EAAE,MAAM,qBAAqB,CAAA;AAS3D,eAAO,MAAM,aAAa,GAAI,QAAQ,MAAM,iCAc3C,CAAA;AAED,wBAAgB,eAAe;;;;;;;;EAuD9B"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/slate/TextAlignPlugin/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAsB,MAAM,OAAO,CAAA;AAClD,OAAO,EAAkB,KAAK,EAAE,MAAM,qBAAqB,CAAA;AAS3D,eAAO,MAAM,aAAa,GAAI,QAAQ,MAAM,iCAc3C,CAAA;AAED,wBAAgB,eAAe;;;;;;;;;;;;;;;;;;;;EAuD9B"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@makeswift/runtime",
3
- "version": "0.28.10-canary.12",
3
+ "version": "0.28.10-canary.14",
4
4
  "license": "MIT",
5
5
  "repository": {
6
6
  "url": "makeswift/makeswift",
@@ -244,9 +244,9 @@
244
244
  "use-sync-external-store": "^1.5.0",
245
245
  "uuid": "^9.0.0",
246
246
  "zod": "^3.21.4",
247
- "@makeswift/controls": "0.1.22-canary.2",
247
+ "@makeswift/controls": "0.1.22-canary.3",
248
248
  "@makeswift/next-plugin": "0.6.1",
249
- "@makeswift/prop-controllers": "0.4.16-canary.2"
249
+ "@makeswift/prop-controllers": "0.4.16-canary.3"
250
250
  },
251
251
  "devDependencies": {
252
252
  "@emotion/jest": "^11.11.0",