npm - @makeswift/runtime - Versions diffs - 0.16.0-canary.0 → 0.16.0-canary.2 - Mend

@makeswift/runtime 0.16.0-canary.0 → 0.16.0-canary.2

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 (329) hide show

package/dist/esm/components/builtin/Navigation/register.js CHANGED Viewed

@@ -3,7 +3,18 @@ import { findBreakpointOverride, getBaseBreakpoint } from "../../../state/module
 import { MakeswiftComponentType } from "../constants";
 import { ComponentIcon } from "../../../state/modules/components-meta";
 import { lazy } from "react";
-import { Link } from "@makeswift/prop-controllers";
+import {
+  ControlDataTypeKey,
+  Checkbox,
+  Link,
+  ResponsiveColor,
+  ResponsiveLength,
+  ResponsiveLengthPropControllerDataV1Type,
+  checkboxPropControllerDataSchema,
+  getCheckboxPropControllerDataBoolean,
+  Margin,
+  Width
+} from "@makeswift/prop-controllers";
 function registerComponent(runtime) {
   return runtime.registerComponent(
     lazy(() => import("./Navigation")),
@@ -21,32 +32,47 @@ function registerComponent(runtime) {
             hidden: links == null || links.length === 0
           };
         }),
-        showLogo: Props.Checkbox({ preset: true, label: "Show logo" }),
+        showLogo: Checkbox({ preset: true, label: "Show logo" }),
         logoFile: Props.Image((props) => ({
           label: "Logo",
-          hidden: props.showLogo === false
+          hidden: getCheckboxPropControllerDataBoolean(
+            checkboxPropControllerDataSchema.optional().catch(void 0).parse(props.showLogo)
+          ) === false
         })),
-        logoWidth: Props.ResponsiveLength((props) => ({
-          preset: [
-            {
-              deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,
-              value: { value: 100, unit: "px" }
-            }
-          ],
+        logoWidth: ResponsiveLength((props) => ({
+          // TODO(miguel): We're manually constructing the data here but should be using a factory
+          // function instead. This is because the factory function currently expects a definition
+          // but we don't have one to pass here. Perhaps we should make the factory function not
+          // require the definition and use the latest version when a definition isn't provided.
+          preset: {
+            [ControlDataTypeKey]: ResponsiveLengthPropControllerDataV1Type,
+            value: [
+              {
+                deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,
+                value: { value: 100, unit: "px" }
+              }
+            ]
+          },
           label: "Logo width",
           min: 0,
           max: 1e3,
           // TODO: This is hardcoded value, import it from LengthInputOptions
           options: [{ value: "px", label: "Pixels", icon: "Px16" }],
-          hidden: props.showLogo === false
+          hidden: getCheckboxPropControllerDataBoolean(
+            checkboxPropControllerDataSchema.optional().catch(void 0).parse(props.showLogo)
+          ) === false
         })),
         logoAltText: Props.TextInput((props) => ({
           label: "Logo alt text",
-          hidden: props.showLogo === false
+          hidden: getCheckboxPropControllerDataBoolean(
+            checkboxPropControllerDataSchema.optional().catch(void 0).parse(props.showLogo)
+          ) === false
         })),
         logoLink: Link((props) => ({
           label: "Logo on click",
-          hidden: props.showLogo === false
+          hidden: getCheckboxPropControllerDataBoolean(
+            checkboxPropControllerDataSchema.optional().catch(void 0).parse(props.showLogo)
+          ) === false
         })),
         alignment: Props.ResponsiveIconRadioGroup({
           label: "Alignment",
@@ -77,7 +103,7 @@ function registerComponent(runtime) {
             { value: "coverLeft", label: "Cover from left" }
           ]
         }),
-        mobileMenuOpenIconColor: Props.ResponsiveColor((props, device) => {
+        mobileMenuOpenIconColor: ResponsiveColor((props, device) => {
           const mobileMenuAnimation = props.mobileMenuAnimation;
           const hidden = !findBreakpointOverride(
             runtime.getBreakpoints(),
@@ -90,7 +116,7 @@ function registerComponent(runtime) {
             hidden
           };
         }),
-        mobileMenuCloseIconColor: Props.ResponsiveColor((props, device) => {
+        mobileMenuCloseIconColor: ResponsiveColor((props, device) => {
           const mobileMenuAnimation = props.mobileMenuAnimation;
           const hidden = !findBreakpointOverride(
             runtime.getBreakpoints(),
@@ -103,7 +129,7 @@ function registerComponent(runtime) {
             hidden
           };
         }),
-        mobileMenuBackgroundColor: Props.ResponsiveColor((props, device) => {
+        mobileMenuBackgroundColor: ResponsiveColor((props, device) => {
           const mobileMenuAnimation = props.mobileMenuAnimation;
           const hidden = !findBreakpointOverride(
             runtime.getBreakpoints(),
@@ -116,11 +142,11 @@ function registerComponent(runtime) {
             hidden
           };
         }),
-        width: Props.Width({
-          format: Props.Width.Format.ClassName,
+        width: Width({
+          format: Width.Format.ClassName,
           defaultValue: { value: 100, unit: "%" }
         }),
-        margin: Props.Margin({ format: Props.Margin.Format.ClassName })
+        margin: Margin({ format: Margin.Format.ClassName })
       }
     }
   );

package/dist/esm/components/builtin/Navigation/register.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/components/builtin/Navigation/register.ts"],"sourcesContent":["import { Props } from '../../../prop-controllers'\nimport { NavigationLinksValue, ~~ResponsiveValue~~ } from '../../../prop-controllers/descriptors'\nimport { ReactRuntime } from '../../../runtimes/react'\nimport { findBreakpointOverride, getBaseBreakpoint } from '../../../state/modules/breakpoints'\nimport { MakeswiftComponentType } from '../constants'\nimport { ComponentIcon } from '../../../state/modules/components-meta'\nimport { lazy } from 'react'\nimport { Link } from '@makeswift/prop-controllers'\n\nexport function registerComponent(runtime: ReactRuntime) {\n return runtime.registerComponent(\n lazy(() => import('./Navigation')),\n {\n type: MakeswiftComponentType.Navigation,\n label: 'Navigation',\n icon: ComponentIcon.Navigation,\n props: {\n id: Props.ElementID(),\n links: Props.NavigationLinks(),\n linkTextStyle: Props.TextStyle(props => {\n const links = props.links as NavigationLinksValue\n\n return {\n label: 'Link text style',\n hidden: links == null \|\| links.length === 0,\n }\n }),\n showLogo: ~~Props.~~Checkbox({ preset: true, label: 'Show logo' }),\n logoFile: Props.Image(props => ({\n label: 'Logo',\n hidden: props.showLogo === false,\n })),\n logoWidth: ~~Props.~~ResponsiveLength(props => ({\n preset: [\n {\n deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,\n value: { value: 100, unit: 'px' },\n },\n ],\n label: 'Logo width',\n min: 0,\n max: 1000,\n // TODO: This is hardcoded value, import it from LengthInputOptions\n options: [{ value: 'px', label: 'Pixels', icon: 'Px16' }],\n hidden: props.showLogo === false,\n })),\n logoAltText: Props.TextInput(props => ({\n label: 'Logo alt text',\n hidden: props.showLogo === false,\n })),\n logoLink: Link(props => ({\n label: 'Logo on click',\n hidden: props.showLogo === false,\n })),\n alignment: Props.ResponsiveIconRadioGroup({\n label: 'Alignment',\n options: [\n { label: 'Left', value: 'flex-start', icon: 'AlignLeft16' },\n { label: 'Center', value: 'center', icon: 'AlignCenter16' },\n { label: 'End', value: 'flex-end', icon: 'AlignRight16' },\n ],\n defaultValue: 'flex-end',\n }),\n gutter: Props.GapX({\n preset: [\n {\n deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,\n value: { value: 10, unit: 'px' },\n },\n ],\n label: 'Link gap',\n min: 0,\n max: 100,\n step: 1,\n defaultValue: { value: 0, unit: 'px' },\n }),\n mobileMenuAnimation: Props.ResponsiveSelect({\n label: 'Mobile menu',\n options: [\n { value: 'coverRight', label: 'Cover from right' },\n { value: 'coverLeft', label: 'Cover from left' },\n ],\n }),\n mobileMenuOpenIconColor: ~~Props.~~ResponsiveColor((props, device) => {\n const mobileMenuAnimation = props.mobileMenuAnimation as ~~ResponsiveValue~~<string>\n const hidden = !findBreakpointOverride(\n runtime.getBreakpoints(),\n mobileMenuAnimation,\n device,\n )\n\n return {\n label: 'Open icon color',\n placeholder: 'rgba(161, 168, 194, 0.5)',\n hidden,\n }\n }),\n mobileMenuCloseIconColor: ~~Props.~~ResponsiveColor((props, device) => {\n const mobileMenuAnimation = props.mobileMenuAnimation as ~~ResponsiveValue~~<string>\n const hidden = !findBreakpointOverride(\n runtime.getBreakpoints(),\n mobileMenuAnimation,\n device,\n )\n\n return {\n label: 'Close icon color',\n placeholder: 'rgba(161, 168, 194, 0.5)',\n hidden,\n }\n }),\n mobileMenuBackgroundColor: ~~Props.~~ResponsiveColor((props, device) => {\n const mobileMenuAnimation = props.mobileMenuAnimation as ~~ResponsiveValue~~<string>\n const hidden = !findBreakpointOverride(\n runtime.getBreakpoints(),\n mobileMenuAnimation,\n device,\n )\n\n return {\n label: 'Menu BG color',\n placeholder: 'black',\n hidden,\n }\n }),\n width: ~~Props.~~Width({\n format: ~~Props.~~Width.Format.ClassName,\n defaultValue: { value: 100, unit: '%' },\n }),\n margin: ~~Props.~~Margin({ format: ~~Props.~~Margin.Format.ClassName }),\n },\n },\n )\n}\n"],"mappings":"AAAA,SAAS,aAAa;AAGtB,SAAS,wBAAwB,yBAAyB;AAC1D,SAAS,8BAA8B;AACvC,SAAS,qBAAqB;AAC9B,SAAS,YAAY;AACrB,~~SAAS~~,~~YAAY~~;~~AAEd~~,SAAS,kBAAkB,SAAuB;AACvD,SAAO,QAAQ;AAAA,IACb,KAAK,MAAM,OAAO,cAAc,CAAC;AAAA,IACjC;AAAA,MACE,MAAM,uBAAuB;AAAA,MAC7B,OAAO;AAAA,MACP,MAAM,cAAc;AAAA,MACpB,OAAO;AAAA,QACL,IAAI,MAAM,UAAU;AAAA,QACpB,OAAO,MAAM,gBAAgB;AAAA,QAC7B,eAAe,MAAM,UAAU,WAAS;AACtC,gBAAM,QAAQ,MAAM;AAEpB,iBAAO;AAAA,YACL,OAAO;AAAA,YACP,QAAQ,SAAS,QAAQ,MAAM,WAAW;AAAA,UAC5C;AAAA,QACF,CAAC;AAAA,QACD,UAAU,~~MAAM,~~SAAS,EAAE,QAAQ,MAAM,OAAO,YAAY,CAAC;AAAA,~~QAC7D~~,UAAU,MAAM,MAAM,YAAU;AAAA,UAC9B,OAAO;AAAA,UACP,~~QAAQ~~,MAAM,~~aAAa~~;AAAA,~~QAC7B~~,EAAE;AAAA,QACF,WAAW,~~MAAM,~~iBAAiB,YAAU;AAAA,~~UAC1C~~,QAAQ;AAAA,YACN;AAAA,~~cACE~~,UAAU,kBAAkB,QAAQ,eAAe,CAAC,EAAE;AAAA,~~cACtD~~,OAAO,EAAE,OAAO,KAAK,MAAM,KAAK;AAAA,~~YAClC~~;AAAA,UACF;AAAA,UACA,OAAO;AAAA,UACP,KAAK;AAAA,UACL,KAAK;AAAA;AAAA,UAEL,SAAS,CAAC,EAAE,OAAO,MAAM,OAAO,UAAU,MAAM,OAAO,CAAC;AAAA,UACxD,~~QAAQ~~,MAAM,~~aAAa~~;AAAA,~~QAC7B~~,EAAE;AAAA,QACF,aAAa,MAAM,UAAU,YAAU;AAAA,UACrC,OAAO;AAAA,UACP,~~QAAQ~~,MAAM,~~aAAa~~;AAAA,~~QAC7B~~,EAAE;AAAA,QACF,UAAU,KAAK,YAAU;AAAA,UACvB,OAAO;AAAA,UACP,~~QAAQ~~,MAAM,~~aAAa~~;AAAA,~~QAC7B~~,EAAE;AAAA,QACF,WAAW,MAAM,yBAAyB;AAAA,UACxC,OAAO;AAAA,UACP,SAAS;AAAA,YACP,EAAE,OAAO,QAAQ,OAAO,cAAc,MAAM,cAAc;AAAA,YAC1D,EAAE,OAAO,UAAU,OAAO,UAAU,MAAM,gBAAgB;AAAA,YAC1D,EAAE,OAAO,OAAO,OAAO,YAAY,MAAM,eAAe;AAAA,UAC1D;AAAA,UACA,cAAc;AAAA,QAChB,CAAC;AAAA,QACD,QAAQ,MAAM,KAAK;AAAA,UACjB,QAAQ;AAAA,YACN;AAAA,cACE,UAAU,kBAAkB,QAAQ,eAAe,CAAC,EAAE;AAAA,cACtD,OAAO,EAAE,OAAO,IAAI,MAAM,KAAK;AAAA,YACjC;AAAA,UACF;AAAA,UACA,OAAO;AAAA,UACP,KAAK;AAAA,UACL,KAAK;AAAA,UACL,MAAM;AAAA,UACN,cAAc,EAAE,OAAO,GAAG,MAAM,KAAK;AAAA,QACvC,CAAC;AAAA,QACD,qBAAqB,MAAM,iBAAiB;AAAA,UAC1C,OAAO;AAAA,UACP,SAAS;AAAA,YACP,EAAE,OAAO,cAAc,OAAO,mBAAmB;AAAA,YACjD,EAAE,OAAO,aAAa,OAAO,kBAAkB;AAAA,UACjD;AAAA,QACF,CAAC;AAAA,QACD,yBAAyB,~~MAAM,~~gBAAgB,CAAC,OAAO,WAAW;~~AAChE~~,gBAAM,sBAAsB,MAAM;~~AAClC~~,gBAAM,SAAS,CAAC;AAAA,YACd,QAAQ,eAAe;AAAA,YACvB;AAAA,YACA;AAAA,UACF;AAEA,iBAAO;AAAA,YACL,OAAO;AAAA,YACP,aAAa;AAAA,YACb;AAAA,UACF;AAAA,QACF,CAAC;AAAA,QACD,0BAA0B,~~MAAM,~~gBAAgB,CAAC,OAAO,WAAW;~~AACjE~~,gBAAM,sBAAsB,MAAM;~~AAClC~~,gBAAM,SAAS,CAAC;AAAA,YACd,QAAQ,eAAe;AAAA,YACvB;AAAA,YACA;AAAA,UACF;AAEA,iBAAO;AAAA,YACL,OAAO;AAAA,YACP,aAAa;AAAA,YACb;AAAA,UACF;AAAA,QACF,CAAC;AAAA,QACD,2BAA2B,~~MAAM,~~gBAAgB,CAAC,OAAO,WAAW;~~AAClE~~,gBAAM,sBAAsB,MAAM;~~AAClC~~,gBAAM,SAAS,CAAC;AAAA,YACd,QAAQ,eAAe;AAAA,YACvB;AAAA,YACA;AAAA,UACF;AAEA,iBAAO;AAAA,YACL,OAAO;AAAA,YACP,aAAa;AAAA,YACb;AAAA,UACF;AAAA,QACF,CAAC;AAAA,QACD,OAAO,MAAM~~,MAAM~~;AAAA,~~UACjB~~,QAAQ,MAAM,~~MAAM,~~OAAO;AAAA,~~UAC3B~~,cAAc,EAAE,OAAO,KAAK,MAAM,IAAI;AAAA,QACxC,CAAC;AAAA,QACD,QAAQ,~~MAAM,~~OAAO,EAAE,QAAQ,~~MAAM,~~OAAO,OAAO,UAAU,CAAC;AAAA,~~MAChE~~;AAAA,IACF;AAAA,EACF;AACF;","names":[]}
1	+ {"version":3,"sources":["../../../../../src/components/builtin/Navigation/register.ts"],"sourcesContent":["import { Props } from '../../../prop-controllers'\nimport { NavigationLinksValue, ResponsiveSelectValue } from '../../../prop-controllers/descriptors'\nimport { ReactRuntime } from '../../../runtimes/react'\nimport { findBreakpointOverride, getBaseBreakpoint } from '../../../state/modules/breakpoints'\nimport { MakeswiftComponentType } from '../constants'\nimport { ComponentIcon } from '../../../state/modules/components-meta'\nimport { lazy } from 'react'\nimport {\n ControlDataTypeKey,\n Checkbox,\n Link,\n ResponsiveColor,\n ResponsiveLength,\n ResponsiveLengthPropControllerDataV1Type,\n checkboxPropControllerDataSchema,\n getCheckboxPropControllerDataBoolean,\n Margin,\n Width,\n} from '@makeswift/prop-controllers'\n\nexport function registerComponent(runtime: ReactRuntime) {\n return runtime.registerComponent(\n lazy(() => import('./Navigation')),\n {\n type: MakeswiftComponentType.Navigation,\n label: 'Navigation',\n icon: ComponentIcon.Navigation,\n props: {\n id: Props.ElementID(),\n links: Props.NavigationLinks(),\n linkTextStyle: Props.TextStyle(props => {\n const links = props.links as NavigationLinksValue \| undefined\n\n return {\n label: 'Link text style',\n hidden: links == null \|\| links.length === 0,\n }\n }),\n showLogo: Checkbox({ preset: true, label: 'Show logo' }),\n logoFile: Props.Image(props => ({\n label: 'Logo',\n hidden:\n getCheckboxPropControllerDataBoolean(\n checkboxPropControllerDataSchema.optional().catch(undefined).parse(props.showLogo),\n ) === false,\n })),\n logoWidth: ResponsiveLength(props => ({\n // TODO(miguel): We're manually constructing the data here but should be using a factory\n // function instead. This is because the factory function currently expects a definition\n // but we don't have one to pass here. Perhaps we should make the factory function not\n // require the definition and use the latest version when a definition isn't provided.\n preset: {\n [ControlDataTypeKey]: ResponsiveLengthPropControllerDataV1Type,\n value: [\n {\n deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,\n value: { value: 100, unit: 'px' },\n },\n ],\n },\n label: 'Logo width',\n min: 0,\n max: 1000,\n // TODO: This is hardcoded value, import it from LengthInputOptions\n options: [{ value: 'px', label: 'Pixels', icon: 'Px16' }],\n hidden:\n getCheckboxPropControllerDataBoolean(\n checkboxPropControllerDataSchema.optional().catch(undefined).parse(props.showLogo),\n ) === false,\n })),\n logoAltText: Props.TextInput(props => ({\n label: 'Logo alt text',\n hidden:\n getCheckboxPropControllerDataBoolean(\n checkboxPropControllerDataSchema.optional().catch(undefined).parse(props.showLogo),\n ) === false,\n })),\n logoLink: Link(props => ({\n label: 'Logo on click',\n hidden:\n getCheckboxPropControllerDataBoolean(\n checkboxPropControllerDataSchema.optional().catch(undefined).parse(props.showLogo),\n ) === false,\n })),\n alignment: Props.ResponsiveIconRadioGroup({\n label: 'Alignment',\n options: [\n { label: 'Left', value: 'flex-start', icon: 'AlignLeft16' },\n { label: 'Center', value: 'center', icon: 'AlignCenter16' },\n { label: 'End', value: 'flex-end', icon: 'AlignRight16' },\n ],\n defaultValue: 'flex-end',\n }),\n gutter: Props.GapX({\n preset: [\n {\n deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,\n value: { value: 10, unit: 'px' },\n },\n ],\n label: 'Link gap',\n min: 0,\n max: 100,\n step: 1,\n defaultValue: { value: 0, unit: 'px' },\n }),\n mobileMenuAnimation: Props.ResponsiveSelect({\n label: 'Mobile menu',\n options: [\n { value: 'coverRight', label: 'Cover from right' },\n { value: 'coverLeft', label: 'Cover from left' },\n ],\n }),\n mobileMenuOpenIconColor: ResponsiveColor((props, device) => {\n const mobileMenuAnimation = props.mobileMenuAnimation as\n \| ResponsiveSelectValue<string>\n \| undefined\n const hidden = !findBreakpointOverride(\n runtime.getBreakpoints(),\n mobileMenuAnimation,\n device,\n )\n\n return {\n label: 'Open icon color',\n placeholder: 'rgba(161, 168, 194, 0.5)',\n hidden,\n }\n }),\n mobileMenuCloseIconColor: ResponsiveColor((props, device) => {\n const mobileMenuAnimation = props.mobileMenuAnimation as\n \| ResponsiveSelectValue<string>\n \| undefined\n const hidden = !findBreakpointOverride(\n runtime.getBreakpoints(),\n mobileMenuAnimation,\n device,\n )\n\n return {\n label: 'Close icon color',\n placeholder: 'rgba(161, 168, 194, 0.5)',\n hidden,\n }\n }),\n mobileMenuBackgroundColor: ResponsiveColor((props, device) => {\n const mobileMenuAnimation = props.mobileMenuAnimation as\n \| ResponsiveSelectValue<string>\n \| undefined\n const hidden = !findBreakpointOverride(\n runtime.getBreakpoints(),\n mobileMenuAnimation,\n device,\n )\n\n return {\n label: 'Menu BG color',\n placeholder: 'black',\n hidden,\n }\n }),\n width: Width({\n format: Width.Format.ClassName,\n defaultValue: { value: 100, unit: '%' },\n }),\n margin: Margin({ format: Margin.Format.ClassName }),\n },\n },\n )\n}\n"],"mappings":"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","names":[]}

package/dist/esm/components/builtin/SocialLinks/SocialLinks.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/components/builtin/SocialLinks/SocialLinks.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, Ref } from 'react'\n\nimport { Link } from '../../shared/Link'\nimport { colorToString } from '../../utils/colorToString'\nimport { ColorValue as Color } from '../../utils/types'\nimport { SocialLinksOptions, SocialLinksOptionType } from './options'\nimport GutterContainer from '../../shared/GutterContainer'\nimport SocialLinksPlaceholder from './components/SocialLinksPlaceholder'\nimport {\n ~~ResponsiveValue,\n~~ ElementIDValue,\n ResponsiveIconRadioGroupValue,\n ResponsiveSelectValue,\n GapXValue,\n} from '../../../prop-controllers/descriptors'\nimport { ResponsiveColor } from '../../../runtimes/react/controls'\nimport { cx } from '@emotion/css'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useResponsiveStyle } from '../../utils/responsive-style'\n\ntype Props = {\n id?: ElementIDValue\n links?: {\n links: { id: string; payload: { type: SocialLinksOptionType; url: string } }[]\n openInNewTab: boolean\n }\n shape?: ResponsiveIconRadioGroupValue<'naked' \| 'circle' \| 'rounded' \| 'square'>\n size?: ResponsiveIconRadioGroupValue<'small' \| 'medium' \| 'large'>\n hoverStyle?: ResponsiveSelectValue<'none' \| 'grow' \| 'shrink' \| 'fade'>\n fill?: ResponsiveColor \| null\n backgroundColor?: ResponsiveColor \| null\n alignment?: ResponsiveIconRadioGroupValue<'flex-start' \| 'center' \| 'flex-end'>\n gutter?: GapXValue\n width?: string\n margin?: string\n}\n\nconst SocialLinks = forwardRef(function SocialLinks(\n {\n id,\n links: { links, openInNewTab } = { links: [], openInNewTab: false },\n shape,\n size,\n hoverStyle,\n fill,\n backgroundColor,\n alignment,\n gutter,\n width,\n margin,\n }: Props,\n ref: Ref<HTMLDivElement>,\n) {\n return (\n <div\n ref={ref}\n id={id}\n className={cx(\n useStyle({ display: 'flex', flexDirection: 'row', flexWrap: 'wrap' }),\n width,\n margin,\n useStyle(\n useResponsiveStyle([alignment] as const, ([alignment = 'center']) => ({\n justifyContent: alignment,\n })),\n ),\n )}\n >\n {links.length > 0 ? (\n links.map((link, i) => {\n const option = SocialLinksOptions.find(o => o.type === link.payload.type)\n\n if (option == null) return null\n\n return (\n <GutterContainer\n key={link.id}\n gutter={gutter}\n first={i === 0}\n last={i === links.length - 1}\n >\n <StyledLink\n backgroundColor={backgroundColor}\n brandColor={option.brandColor}\n fill={fill}\n hoverStyle={hoverStyle}\n link={{ type: 'OPEN_URL', payload: { url: link.payload.url, openInNewTab } }}\n shape={shape}\n size={size}\n >\n {option.icon}\n </StyledLink>\n </GutterContainer>\n )\n })\n ) : (\n <SocialLinksPlaceholder gutter={gutter} />\n )}\n </div>\n )\n})\n\nexport default SocialLinks\n\ntype StyledLinkProps = ComponentPropsWithoutRef<typeof Link> & {\n brandColor: string\n shape: Props['shape']\n size: Props['size']\n hoverStyle: Props['hoverStyle']\n fill: ResponsiveValue<Color> \| null \| undefined\n backgroundColor: ResponsiveValue<Color> \| null \| undefined\n}\n\nfunction StyledLink({\n className,\n brandColor,\n shape,\n size,\n hoverStyle,\n fill,\n backgroundColor,\n ...restOfProps\n}: StyledLinkProps) {\n return (\n <Link\n {...restOfProps}\n className={cx(\n useStyle({\n display: 'block',\n color: brandColor,\n transition: 'transform, opacity 0.18s',\n svg: { display: 'block' },\n }),\n useStyle(\n useResponsiveStyle(\n [shape, size, hoverStyle, fill, backgroundColor] as const,\n ([shape = 'naked', size = 'medium', hoverStyle = 'none', fill, backgroundColor]) => ({\n padding: shape === 'naked' ? 0 : { small: 10, medium: 12, large: 14 }[size],\n borderRadius: { circle: '50%', rounded: '8px', naked: 0, square: 0 }[shape],\n background:\n shape === 'naked'\n ? 'transparent'\n : backgroundColor == null\n ? 'currentColor'\n : colorToString(backgroundColor),\n\n ':hover': {\n none: {},\n grow: { transform: 'scale(1.1)' },\n shrink: { transform: 'scale(0.9)' },\n fade: { opacity: 0.65 },\n }[hoverStyle],\n\n svg: {\n fill:\n fill == null\n ? shape === 'naked' \|\| backgroundColor != null\n ? 'currentColor'\n : 'white'\n : colorToString(fill),\n width: { small: 16, medium: 20, large: 24 }[size],\n height: { small: 16, medium: 20, large: 24 }[size],\n },\n }),\n ),\n ),\n className,\n )}\n />\n )\n}\n"],"mappings":"AAiFc;AAjFd,SAAmC,kBAAuB;AAE1D,SAAS,YAAY;AACrB,SAAS,qBAAqB;AAE9B,SAAS,0BAAiD;AAC1D,OAAO,qBAAqB;AAC5B,OAAO,4BAA4B;~~AASnC~~,SAAS,UAAU;AACnB,SAAS,gBAAgB;AACzB,SAAS,0BAA0B;~~AAmBnC~~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","names":["SocialLinks","alignment","shape","size","hoverStyle","fill","backgroundColor"]}
1	+ {"version":3,"sources":["../../../../../src/components/builtin/SocialLinks/SocialLinks.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, forwardRef, Ref } from 'react'\n\nimport { Link } from '../../shared/Link'\nimport { colorToString } from '../../utils/colorToString'\nimport { ColorValue as Color } from '../../utils/types'\nimport { SocialLinksOptions, SocialLinksOptionType } from './options'\nimport GutterContainer from '../../shared/GutterContainer'\nimport SocialLinksPlaceholder from './components/SocialLinksPlaceholder'\nimport {\n ElementIDValue,\n ResponsiveIconRadioGroupValue,\n ResponsiveSelectValue,\n GapXValue,\n} from '../../../prop-controllers/descriptors'\nimport { ResponsiveColor } from '../../../runtimes/react/controls'\nimport { cx } from '@emotion/css'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useResponsiveStyle } from '../../utils/responsive-style'\nimport { ResponsiveValue } from '@makeswift/prop-controllers'\n\ntype Props = {\n id?: ElementIDValue\n links?: {\n links: { id: string; payload: { type: SocialLinksOptionType; url: string } }[]\n openInNewTab: boolean\n }\n shape?: ResponsiveIconRadioGroupValue<'naked' \| 'circle' \| 'rounded' \| 'square'>\n size?: ResponsiveIconRadioGroupValue<'small' \| 'medium' \| 'large'>\n hoverStyle?: ResponsiveSelectValue<'none' \| 'grow' \| 'shrink' \| 'fade'>\n fill?: ResponsiveColor \| null\n backgroundColor?: ResponsiveColor \| null\n alignment?: ResponsiveIconRadioGroupValue<'flex-start' \| 'center' \| 'flex-end'>\n gutter?: GapXValue\n width?: string\n margin?: string\n}\n\nconst SocialLinks = forwardRef(function SocialLinks(\n {\n id,\n links: { links, openInNewTab } = { links: [], openInNewTab: false },\n shape,\n size,\n hoverStyle,\n fill,\n backgroundColor,\n alignment,\n gutter,\n width,\n margin,\n }: Props,\n ref: Ref<HTMLDivElement>,\n) {\n return (\n <div\n ref={ref}\n id={id}\n className={cx(\n useStyle({ display: 'flex', flexDirection: 'row', flexWrap: 'wrap' }),\n width,\n margin,\n useStyle(\n useResponsiveStyle([alignment] as const, ([alignment = 'center']) => ({\n justifyContent: alignment,\n })),\n ),\n )}\n >\n {links.length > 0 ? (\n links.map((link, i) => {\n const option = SocialLinksOptions.find(o => o.type === link.payload.type)\n\n if (option == null) return null\n\n return (\n <GutterContainer\n key={link.id}\n gutter={gutter}\n first={i === 0}\n last={i === links.length - 1}\n >\n <StyledLink\n backgroundColor={backgroundColor}\n brandColor={option.brandColor}\n fill={fill}\n hoverStyle={hoverStyle}\n link={{ type: 'OPEN_URL', payload: { url: link.payload.url, openInNewTab } }}\n shape={shape}\n size={size}\n >\n {option.icon}\n </StyledLink>\n </GutterContainer>\n )\n })\n ) : (\n <SocialLinksPlaceholder gutter={gutter} />\n )}\n </div>\n )\n})\n\nexport default SocialLinks\n\ntype StyledLinkProps = ComponentPropsWithoutRef<typeof Link> & {\n brandColor: string\n shape: Props['shape']\n size: Props['size']\n hoverStyle: Props['hoverStyle']\n fill: ResponsiveValue<Color> \| null \| undefined\n backgroundColor: ResponsiveValue<Color> \| null \| undefined\n}\n\nfunction StyledLink({\n className,\n brandColor,\n shape,\n size,\n hoverStyle,\n fill,\n backgroundColor,\n ...restOfProps\n}: StyledLinkProps) {\n return (\n <Link\n {...restOfProps}\n className={cx(\n useStyle({\n display: 'block',\n color: brandColor,\n transition: 'transform, opacity 0.18s',\n svg: { display: 'block' },\n }),\n useStyle(\n useResponsiveStyle(\n [shape, size, hoverStyle, fill, backgroundColor] as const,\n ([shape = 'naked', size = 'medium', hoverStyle = 'none', fill, backgroundColor]) => ({\n padding: shape === 'naked' ? 0 : { small: 10, medium: 12, large: 14 }[size],\n borderRadius: { circle: '50%', rounded: '8px', naked: 0, square: 0 }[shape],\n background:\n shape === 'naked'\n ? 'transparent'\n : backgroundColor == null\n ? 'currentColor'\n : colorToString(backgroundColor),\n\n ':hover': {\n none: {},\n grow: { transform: 'scale(1.1)' },\n shrink: { transform: 'scale(0.9)' },\n fade: { opacity: 0.65 },\n }[hoverStyle],\n\n svg: {\n fill:\n fill == null\n ? shape === 'naked' \|\| backgroundColor != null\n ? 'currentColor'\n : 'white'\n : colorToString(fill),\n width: { small: 16, medium: 20, large: 24 }[size],\n height: { small: 16, medium: 20, large: 24 }[size],\n },\n }),\n ),\n ),\n className,\n )}\n />\n )\n}\n"],"mappings":"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","names":["SocialLinks","alignment","shape","size","hoverStyle","fill","backgroundColor"]}

package/dist/esm/components/builtin/SocialLinks/components/SocialLinksPlaceholder/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../src/components/builtin/SocialLinks/components/SocialLinksPlaceholder/index.tsx"],"sourcesContent":["import { ~~ResponsiveValue~~, ~~Length~~ } from '~~../../../../../~~prop-controllers~~/descriptors~~'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\n\nimport GutterContainer from '../../../../shared/GutterContainer'\n\nconst links = [{ id: '1' }, { id: '2' }, { id: '3' }]\n\ntype Props = { gutter?: ResponsiveValue<~~Length~~> }\n\nexport default function SocialLinksPlaceholder({ gutter }: Props): JSX.Element {\n return (\n <>\n {links.map((link, i) => (\n <GutterContainer\n key={link.id}\n gutter={gutter}\n first={i === 0}\n last={i === links.length - 1}\n >\n <PlaceholderLink />\n </GutterContainer>\n ))}\n </>\n )\n}\n\nfunction PlaceholderLink() {\n return (\n <div\n className={useStyle({\n width: 44,\n height: 44,\n borderRadius: '50%',\n backgroundColor: 'rgba(161, 168, 194, 0.4)',\n })}\n />\n )\n}\n"],"mappings":"AAWI,mBAQM,WARN;AAVJ,SAAS,gBAAgB;AAEzB,OAAO,qBAAqB;AAE5B,MAAM,QAAQ,CAAC,EAAE,IAAI,IAAI,GAAG,EAAE,IAAI,IAAI,GAAG,EAAE,IAAI,IAAI,CAAC;AAIrC,SAAR,uBAAwC,EAAE,OAAO,GAAuB;AAC7E,SACE,gCACG,gBAAM,IAAI,CAAC,MAAM,MAChB;AAAA,IAAC;AAAA;AAAA,MAEC;AAAA,MACA,OAAO,MAAM;AAAA,MACb,MAAM,MAAM,MAAM,SAAS;AAAA,MAE3B,8BAAC,mBAAgB;AAAA;AAAA,IALZ,KAAK;AAAA,EAMZ,CACD,GACH;AAEJ;AAEA,SAAS,kBAAkB;AACzB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,SAAS;AAAA,QAClB,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,cAAc;AAAA,QACd,iBAAiB;AAAA,MACnB,CAAC;AAAA;AAAA,EACH;AAEJ;","names":[]}
1	+ {"version":3,"sources":["../../../../../../../src/components/builtin/SocialLinks/components/SocialLinksPlaceholder/index.tsx"],"sourcesContent":["import { LengthData, ResponsiveValue } from '@makeswift/prop-controllers'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\n\nimport GutterContainer from '../../../../shared/GutterContainer'\n\nconst links = [{ id: '1' }, { id: '2' }, { id: '3' }]\n\ntype Props = { gutter?: ResponsiveValue<LengthData> }\n\nexport default function SocialLinksPlaceholder({ gutter }: Props): JSX.Element {\n return (\n <>\n {links.map((link, i) => (\n <GutterContainer\n key={link.id}\n gutter={gutter}\n first={i === 0}\n last={i === links.length - 1}\n >\n <PlaceholderLink />\n </GutterContainer>\n ))}\n </>\n )\n}\n\nfunction PlaceholderLink() {\n return (\n <div\n className={useStyle({\n width: 44,\n height: 44,\n borderRadius: '50%',\n backgroundColor: 'rgba(161, 168, 194, 0.4)',\n })}\n />\n )\n}\n"],"mappings":"AAWI,mBAQM,WARN;AAVJ,SAAS,gBAAgB;AAEzB,OAAO,qBAAqB;AAE5B,MAAM,QAAQ,CAAC,EAAE,IAAI,IAAI,GAAG,EAAE,IAAI,IAAI,GAAG,EAAE,IAAI,IAAI,CAAC;AAIrC,SAAR,uBAAwC,EAAE,OAAO,GAAuB;AAC7E,SACE,gCACG,gBAAM,IAAI,CAAC,MAAM,MAChB;AAAA,IAAC;AAAA;AAAA,MAEC;AAAA,MACA,OAAO,MAAM;AAAA,MACb,MAAM,MAAM,MAAM,SAAS;AAAA,MAE3B,8BAAC,mBAAgB;AAAA;AAAA,IALZ,KAAK;AAAA,EAMZ,CACD,GACH;AAEJ;AAEA,SAAS,kBAAkB;AACzB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,SAAS;AAAA,QAClB,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,cAAc;AAAA,QACd,iBAAiB;AAAA,MACnB,CAAC;AAAA;AAAA,EACH;AAEJ;","names":[]}

package/dist/esm/components/builtin/SocialLinks/register.js CHANGED Viewed

@@ -3,6 +3,7 @@ import { getBaseBreakpoint } from "../../../state/modules/breakpoints";
 import { MakeswiftComponentType } from "../constants";
 import { ComponentIcon } from "../../../state/modules/components-meta";
 import { lazy } from "react";
+import { Margin, ResponsiveColor, Width } from "@makeswift/prop-controllers";
 function registerComponent(runtime) {
   return runtime.registerComponent(
     lazy(() => import("./SocialLinks")),
@@ -74,7 +75,7 @@ function registerComponent(runtime) {
             hidden
           };
         }),
-        fill: Props.ResponsiveColor((props) => {
+        fill: ResponsiveColor((props) => {
           const links = props.links;
           const hidden = links == null || links.links.length === 0;
           return {
@@ -82,7 +83,7 @@ function registerComponent(runtime) {
             hidden
           };
         }),
-        backgroundColor: Props.ResponsiveColor((props) => {
+        backgroundColor: ResponsiveColor((props) => {
           const links = props.links;
           const hidden = links == null || links.links.length === 0;
           return {
@@ -112,12 +113,12 @@ function registerComponent(runtime) {
           step: 1,
           defaultValue: { value: 0, unit: "px" }
         }),
-        width: Props.Width({
-          format: Props.Width.Format.ClassName,
+        width: Width({
+          format: Width.Format.ClassName,
           defaultValue: { value: 100, unit: "%" }
         }),
-        margin: Props.Margin({
-          format: Props.Margin.Format.ClassName,
+        margin: Margin({
+          format: Margin.Format.ClassName,
           preset: [
             {
               deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,

package/dist/esm/components/builtin/SocialLinks/register.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/components/builtin/SocialLinks/register.ts"],"sourcesContent":["import { Props } from '../../../prop-controllers'\nimport { SocialLinksValue } from '../../../prop-controllers/descriptors'\nimport { ReactRuntime } from '../../../runtimes/react'\nimport { getBaseBreakpoint } from '../../../state/modules/breakpoints'\nimport { MakeswiftComponentType } from '../constants'\nimport { ComponentIcon } from '../../../state/modules/components-meta'\nimport { lazy } from 'react'\n\nexport function registerComponent(runtime: ReactRuntime) {\n return runtime.registerComponent(\n lazy(() => import('./SocialLinks')),\n {\n type: MakeswiftComponentType.SocialLinks,\n label: 'Social Links',\n icon: ComponentIcon.SocialLinks,\n props: {\n id: Props.ElementID(),\n links: Props.SocialLinks({\n preset: {\n links: [\n {\n id: 'facebook',\n payload: { type: 'facebook', url: 'https://www.facebook.com' },\n },\n {\n id: 'instagram',\n payload: { type: 'instagram', url: 'https://www.instagram.com' },\n },\n {\n id: 'twitter',\n payload: { type: 'twitter', url: 'https://www.twitter.com' },\n },\n ],\n openInNewTab: false,\n },\n }),\n shape: Props.ResponsiveIconRadioGroup(props => {\n const links = props.links as SocialLinksValue\n\n return {\n label: 'Shape',\n options: [\n { label: 'Naked', value: 'naked', icon: 'Star16' },\n { label: 'Circle', value: 'circle', icon: 'StarCircle16' },\n { label: 'Rounded', value: 'rounded', icon: 'StarRoundedSquare16' },\n { label: 'Square', value: 'square', icon: 'StarSquare16' },\n ],\n defaultValue: 'naked',\n hidden: links == null \|\| links.links.length === 0,\n }\n }),\n size: Props.ResponsiveIconRadioGroup(props => {\n const links = props.links as SocialLinksValue\n\n return {\n label: 'Size',\n options: [\n { label: 'Small', value: 'small', icon: 'SizeSmall16' },\n { label: 'Medium', value: 'medium', icon: 'SizeMedium16' },\n { label: 'Large', value: 'large', icon: 'SizeLarge16' },\n ],\n defaultValue: 'medium',\n hidden: links == null \|\| links.links.length === 0,\n }\n }),\n hoverStyle: Props.ResponsiveSelect(props => {\n const links = props.links as SocialLinksValue\n const hidden = links == null \|\| links.links.length === 0\n\n return {\n label: 'On hover',\n options: [\n { value: 'none', label: 'None' },\n { value: 'grow', label: 'Grow' },\n { value: 'shrink', label: 'Shrink' },\n { value: 'fade', label: 'Fade' },\n ],\n defaultValue: 'none',\n labelOrientation: 'horizontal',\n hidden,\n }\n }),\n fill: ~~Props.~~ResponsiveColor(props => {\n const links = props.links as SocialLinksValue\n const hidden = links == null \|\| links.links.length === 0\n\n return {\n label: 'Icon color',\n hidden,\n }\n }),\n backgroundColor: ~~Props.~~ResponsiveColor(props => {\n const links = props.links as SocialLinksValue\n const hidden = links == null \|\| links.links.length === 0\n\n return {\n label: 'Shape color',\n hidden,\n }\n }),\n alignment: Props.ResponsiveIconRadioGroup({\n label: 'Alignment',\n options: [\n { label: 'flex-start', value: 'flex-start', icon: 'AlignLeft16' },\n { label: 'center', value: 'center', icon: 'AlignCenter16' },\n { label: 'flex-end', value: 'flex-end', icon: 'AlignRight16' },\n ],\n defaultValue: 'center',\n }),\n gutter: Props.GapX({\n preset: [\n {\n deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,\n value: { value: 10, unit: 'px' },\n },\n ],\n label: 'Link gap',\n min: 0,\n max: 100,\n step: 1,\n defaultValue: { value: 0, unit: 'px' },\n }),\n width: ~~Props.~~Width({\n format: ~~Props.~~Width.Format.ClassName,\n defaultValue: { value: 100, unit: '%' },\n }),\n margin: ~~Props.~~Margin({\n format: ~~Props.~~Margin.Format.ClassName,\n preset: [\n {\n deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,\n value: {\n marginTop: { value: 10, unit: 'px' },\n marginRight: 'auto',\n marginBottom: { value: 10, unit: 'px' },\n marginLeft: 'auto',\n },\n },\n ],\n }),\n },\n },\n )\n}\n"],"mappings":"AAAA,SAAS,aAAa;AAGtB,SAAS,yBAAyB;AAClC,SAAS,8BAA8B;AACvC,SAAS,qBAAqB;AAC9B,SAAS,YAAY;~~AAEd~~,SAAS,kBAAkB,SAAuB;AACvD,SAAO,QAAQ;AAAA,IACb,KAAK,MAAM,OAAO,eAAe,CAAC;AAAA,IAClC;AAAA,MACE,MAAM,uBAAuB;AAAA,MAC7B,OAAO;AAAA,MACP,MAAM,cAAc;AAAA,MACpB,OAAO;AAAA,QACL,IAAI,MAAM,UAAU;AAAA,QACpB,OAAO,MAAM,YAAY;AAAA,UACvB,QAAQ;AAAA,YACN,OAAO;AAAA,cACL;AAAA,gBACE,IAAI;AAAA,gBACJ,SAAS,EAAE,MAAM,YAAY,KAAK,2BAA2B;AAAA,cAC/D;AAAA,cACA;AAAA,gBACE,IAAI;AAAA,gBACJ,SAAS,EAAE,MAAM,aAAa,KAAK,4BAA4B;AAAA,cACjE;AAAA,cACA;AAAA,gBACE,IAAI;AAAA,gBACJ,SAAS,EAAE,MAAM,WAAW,KAAK,0BAA0B;AAAA,cAC7D;AAAA,YACF;AAAA,YACA,cAAc;AAAA,UAChB;AAAA,QACF,CAAC;AAAA,QACD,OAAO,MAAM,yBAAyB,WAAS;AAC7C,gBAAM,QAAQ,MAAM;AAEpB,iBAAO;AAAA,YACL,OAAO;AAAA,YACP,SAAS;AAAA,cACP,EAAE,OAAO,SAAS,OAAO,SAAS,MAAM,SAAS;AAAA,cACjD,EAAE,OAAO,UAAU,OAAO,UAAU,MAAM,eAAe;AAAA,cACzD,EAAE,OAAO,WAAW,OAAO,WAAW,MAAM,sBAAsB;AAAA,cAClE,EAAE,OAAO,UAAU,OAAO,UAAU,MAAM,eAAe;AAAA,YAC3D;AAAA,YACA,cAAc;AAAA,YACd,QAAQ,SAAS,QAAQ,MAAM,MAAM,WAAW;AAAA,UAClD;AAAA,QACF,CAAC;AAAA,QACD,MAAM,MAAM,yBAAyB,WAAS;AAC5C,gBAAM,QAAQ,MAAM;AAEpB,iBAAO;AAAA,YACL,OAAO;AAAA,YACP,SAAS;AAAA,cACP,EAAE,OAAO,SAAS,OAAO,SAAS,MAAM,cAAc;AAAA,cACtD,EAAE,OAAO,UAAU,OAAO,UAAU,MAAM,eAAe;AAAA,cACzD,EAAE,OAAO,SAAS,OAAO,SAAS,MAAM,cAAc;AAAA,YACxD;AAAA,YACA,cAAc;AAAA,YACd,QAAQ,SAAS,QAAQ,MAAM,MAAM,WAAW;AAAA,UAClD;AAAA,QACF,CAAC;AAAA,QACD,YAAY,MAAM,iBAAiB,WAAS;AAC1C,gBAAM,QAAQ,MAAM;AACpB,gBAAM,SAAS,SAAS,QAAQ,MAAM,MAAM,WAAW;AAEvD,iBAAO;AAAA,YACL,OAAO;AAAA,YACP,SAAS;AAAA,cACP,EAAE,OAAO,QAAQ,OAAO,OAAO;AAAA,cAC/B,EAAE,OAAO,QAAQ,OAAO,OAAO;AAAA,cAC/B,EAAE,OAAO,UAAU,OAAO,SAAS;AAAA,cACnC,EAAE,OAAO,QAAQ,OAAO,OAAO;AAAA,YACjC;AAAA,YACA,cAAc;AAAA,YACd,kBAAkB;AAAA,YAClB;AAAA,UACF;AAAA,QACF,CAAC;AAAA,QACD,MAAM,~~MAAM,~~gBAAgB,WAAS;~~AACnC~~,gBAAM,QAAQ,MAAM;AACpB,gBAAM,SAAS,SAAS,QAAQ,MAAM,MAAM,WAAW;AAEvD,iBAAO;AAAA,YACL,OAAO;AAAA,YACP;AAAA,UACF;AAAA,QACF,CAAC;AAAA,QACD,iBAAiB,~~MAAM,~~gBAAgB,WAAS;~~AAC9C~~,gBAAM,QAAQ,MAAM;AACpB,gBAAM,SAAS,SAAS,QAAQ,MAAM,MAAM,WAAW;AAEvD,iBAAO;AAAA,YACL,OAAO;AAAA,YACP;AAAA,UACF;AAAA,QACF,CAAC;AAAA,QACD,WAAW,MAAM,yBAAyB;AAAA,UACxC,OAAO;AAAA,UACP,SAAS;AAAA,YACP,EAAE,OAAO,cAAc,OAAO,cAAc,MAAM,cAAc;AAAA,YAChE,EAAE,OAAO,UAAU,OAAO,UAAU,MAAM,gBAAgB;AAAA,YAC1D,EAAE,OAAO,YAAY,OAAO,YAAY,MAAM,eAAe;AAAA,UAC/D;AAAA,UACA,cAAc;AAAA,QAChB,CAAC;AAAA,QACD,QAAQ,MAAM,KAAK;AAAA,UACjB,QAAQ;AAAA,YACN;AAAA,cACE,UAAU,kBAAkB,QAAQ,eAAe,CAAC,EAAE;AAAA,cACtD,OAAO,EAAE,OAAO,IAAI,MAAM,KAAK;AAAA,YACjC;AAAA,UACF;AAAA,UACA,OAAO;AAAA,UACP,KAAK;AAAA,UACL,KAAK;AAAA,UACL,MAAM;AAAA,UACN,cAAc,EAAE,OAAO,GAAG,MAAM,KAAK;AAAA,QACvC,CAAC;AAAA,QACD,OAAO,MAAM~~,MAAM~~;AAAA,~~UACjB~~,QAAQ,MAAM,~~MAAM,~~OAAO;AAAA,~~UAC3B~~,cAAc,EAAE,OAAO,KAAK,MAAM,IAAI;AAAA,QACxC,CAAC;AAAA,QACD,QAAQ,~~MAAM,~~OAAO;AAAA,~~UACnB~~,QAAQ,~~MAAM,~~OAAO,OAAO;AAAA,~~UAC5B~~,QAAQ;AAAA,YACN;AAAA,cACE,UAAU,kBAAkB,QAAQ,eAAe,CAAC,EAAE;AAAA,cACtD,OAAO;AAAA,gBACL,WAAW,EAAE,OAAO,IAAI,MAAM,KAAK;AAAA,gBACnC,aAAa;AAAA,gBACb,cAAc,EAAE,OAAO,IAAI,MAAM,KAAK;AAAA,gBACtC,YAAY;AAAA,cACd;AAAA,YACF;AAAA,UACF;AAAA,QACF,CAAC;AAAA,MACH;AAAA,IACF;AAAA,EACF;AACF;","names":[]}
1	+ {"version":3,"sources":["../../../../../src/components/builtin/SocialLinks/register.ts"],"sourcesContent":["import { Props } from '../../../prop-controllers'\nimport { SocialLinksValue } from '../../../prop-controllers/descriptors'\nimport { ReactRuntime } from '../../../runtimes/react'\nimport { getBaseBreakpoint } from '../../../state/modules/breakpoints'\nimport { MakeswiftComponentType } from '../constants'\nimport { ComponentIcon } from '../../../state/modules/components-meta'\nimport { lazy } from 'react'\nimport { Margin, ResponsiveColor, Width } from '@makeswift/prop-controllers'\n\nexport function registerComponent(runtime: ReactRuntime) {\n return runtime.registerComponent(\n lazy(() => import('./SocialLinks')),\n {\n type: MakeswiftComponentType.SocialLinks,\n label: 'Social Links',\n icon: ComponentIcon.SocialLinks,\n props: {\n id: Props.ElementID(),\n links: Props.SocialLinks({\n preset: {\n links: [\n {\n id: 'facebook',\n payload: { type: 'facebook', url: 'https://www.facebook.com' },\n },\n {\n id: 'instagram',\n payload: { type: 'instagram', url: 'https://www.instagram.com' },\n },\n {\n id: 'twitter',\n payload: { type: 'twitter', url: 'https://www.twitter.com' },\n },\n ],\n openInNewTab: false,\n },\n }),\n shape: Props.ResponsiveIconRadioGroup(props => {\n const links = props.links as SocialLinksValue \| undefined\n\n return {\n label: 'Shape',\n options: [\n { label: 'Naked', value: 'naked', icon: 'Star16' },\n { label: 'Circle', value: 'circle', icon: 'StarCircle16' },\n { label: 'Rounded', value: 'rounded', icon: 'StarRoundedSquare16' },\n { label: 'Square', value: 'square', icon: 'StarSquare16' },\n ],\n defaultValue: 'naked',\n hidden: links == null \|\| links.links.length === 0,\n }\n }),\n size: Props.ResponsiveIconRadioGroup(props => {\n const links = props.links as SocialLinksValue \| undefined\n\n return {\n label: 'Size',\n options: [\n { label: 'Small', value: 'small', icon: 'SizeSmall16' },\n { label: 'Medium', value: 'medium', icon: 'SizeMedium16' },\n { label: 'Large', value: 'large', icon: 'SizeLarge16' },\n ],\n defaultValue: 'medium',\n hidden: links == null \|\| links.links.length === 0,\n }\n }),\n hoverStyle: Props.ResponsiveSelect(props => {\n const links = props.links as SocialLinksValue \| undefined\n const hidden = links == null \|\| links.links.length === 0\n\n return {\n label: 'On hover',\n options: [\n { value: 'none', label: 'None' },\n { value: 'grow', label: 'Grow' },\n { value: 'shrink', label: 'Shrink' },\n { value: 'fade', label: 'Fade' },\n ],\n defaultValue: 'none',\n labelOrientation: 'horizontal',\n hidden,\n }\n }),\n fill: ResponsiveColor(props => {\n const links = props.links as SocialLinksValue \| undefined\n const hidden = links == null \|\| links.links.length === 0\n\n return {\n label: 'Icon color',\n hidden,\n }\n }),\n backgroundColor: ResponsiveColor(props => {\n const links = props.links as SocialLinksValue \| undefined\n const hidden = links == null \|\| links.links.length === 0\n\n return {\n label: 'Shape color',\n hidden,\n }\n }),\n alignment: Props.ResponsiveIconRadioGroup({\n label: 'Alignment',\n options: [\n { label: 'flex-start', value: 'flex-start', icon: 'AlignLeft16' },\n { label: 'center', value: 'center', icon: 'AlignCenter16' },\n { label: 'flex-end', value: 'flex-end', icon: 'AlignRight16' },\n ],\n defaultValue: 'center',\n }),\n gutter: Props.GapX({\n preset: [\n {\n deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,\n value: { value: 10, unit: 'px' },\n },\n ],\n label: 'Link gap',\n min: 0,\n max: 100,\n step: 1,\n defaultValue: { value: 0, unit: 'px' },\n }),\n width: Width({\n format: Width.Format.ClassName,\n defaultValue: { value: 100, unit: '%' },\n }),\n margin: Margin({\n format: Margin.Format.ClassName,\n preset: [\n {\n deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,\n value: {\n marginTop: { value: 10, unit: 'px' },\n marginRight: 'auto',\n marginBottom: { value: 10, unit: 'px' },\n marginLeft: 'auto',\n },\n },\n ],\n }),\n },\n },\n )\n}\n"],"mappings":"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","names":[]}

package/dist/esm/components/builtin/Text/register.js CHANGED Viewed

@@ -3,6 +3,7 @@ import { MakeswiftComponentType } from "../constants";
 import { getBaseBreakpoint } from "../../../state/modules/breakpoints";
 import { RichText } from "../../../controls/rich-text-v2/rich-text-v2";
 import { lazy } from "react";
+import { Margin, Width } from "@makeswift/prop-controllers";
 function registerComponent(runtime) {
   return runtime.registerComponent(
     lazy(() => import("./Text")),
@@ -12,8 +13,8 @@ function registerComponent(runtime) {
       props: {
         id: Props.ElementID(),
         text: RichText(),
-        width: Props.Width({
-          format: Props.Width.Format.ClassName,
+        width: Width({
+          format: Width.Format.ClassName,
           preset: [
             {
               deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,
@@ -22,8 +23,8 @@ function registerComponent(runtime) {
           ],
           defaultValue: { value: 100, unit: "%" }
         }),
-        margin: Props.Margin({
-          format: Props.Margin.Format.ClassName,
+        margin: Margin({
+          format: Margin.Format.ClassName,
           preset: [
             {
               deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,

package/dist/esm/components/builtin/Text/register.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/components/builtin/Text/register.ts"],"sourcesContent":["import { Props } from '../../../prop-controllers'\nimport { ReactRuntime } from '../../../runtimes/react'\nimport { MakeswiftComponentType } from '../constants'\nimport { getBaseBreakpoint } from '../../../state/modules/breakpoints'\nimport { RichText } from '../../../controls/rich-text-v2/rich-text-v2'\nimport { lazy } from 'react'\n\nexport function registerComponent(runtime: ReactRuntime) {\n return runtime.registerComponent(\n lazy(() => import('./Text')),\n {\n type: MakeswiftComponentType.Text,\n label: 'Text',\n props: {\n id: Props.ElementID(),\n text: RichText(),\n width: ~~Props.~~Width({\n format: ~~Props.~~Width.Format.ClassName,\n preset: [\n {\n deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,\n value: { value: 700, unit: 'px' },\n },\n ],\n defaultValue: { value: 100, unit: '%' },\n }),\n margin: ~~Props.~~Margin({\n format: ~~Props.~~Margin.Format.ClassName,\n preset: [\n {\n deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,\n value: {\n marginTop: null,\n marginRight: 'auto',\n marginBottom: { value: 20, unit: 'px' },\n marginLeft: 'auto',\n },\n },\n ],\n }),\n },\n },\n )\n}\n"],"mappings":"AAAA,SAAS,aAAa;AAEtB,SAAS,8BAA8B;AACvC,SAAS,yBAAyB;AAClC,SAAS,gBAAgB;AACzB,SAAS,YAAY;~~AAEd~~,SAAS,kBAAkB,SAAuB;AACvD,SAAO,QAAQ;AAAA,IACb,KAAK,MAAM,OAAO,QAAQ,CAAC;AAAA,IAC3B;AAAA,MACE,MAAM,uBAAuB;AAAA,MAC7B,OAAO;AAAA,MACP,OAAO;AAAA,QACL,IAAI,MAAM,UAAU;AAAA,QACpB,MAAM,SAAS;AAAA,QACf,OAAO,MAAM~~,MAAM~~;AAAA,~~UACjB~~,QAAQ,MAAM,~~MAAM,~~OAAO;AAAA,~~UAC3B~~,QAAQ;AAAA,YACN;AAAA,cACE,UAAU,kBAAkB,QAAQ,eAAe,CAAC,EAAE;AAAA,cACtD,OAAO,EAAE,OAAO,KAAK,MAAM,KAAK;AAAA,YAClC;AAAA,UACF;AAAA,UACA,cAAc,EAAE,OAAO,KAAK,MAAM,IAAI;AAAA,QACxC,CAAC;AAAA,QACD,QAAQ,~~MAAM,~~OAAO;AAAA,~~UACnB~~,QAAQ,~~MAAM,~~OAAO,OAAO;AAAA,~~UAC5B~~,QAAQ;AAAA,YACN;AAAA,cACE,UAAU,kBAAkB,QAAQ,eAAe,CAAC,EAAE;AAAA,cACtD,OAAO;AAAA,gBACL,WAAW;AAAA,gBACX,aAAa;AAAA,gBACb,cAAc,EAAE,OAAO,IAAI,MAAM,KAAK;AAAA,gBACtC,YAAY;AAAA,cACd;AAAA,YACF;AAAA,UACF;AAAA,QACF,CAAC;AAAA,MACH;AAAA,IACF;AAAA,EACF;AACF;","names":[]}
1	+ {"version":3,"sources":["../../../../../src/components/builtin/Text/register.ts"],"sourcesContent":["import { Props } from '../../../prop-controllers'\nimport { ReactRuntime } from '../../../runtimes/react'\nimport { MakeswiftComponentType } from '../constants'\nimport { getBaseBreakpoint } from '../../../state/modules/breakpoints'\nimport { RichText } from '../../../controls/rich-text-v2/rich-text-v2'\nimport { lazy } from 'react'\nimport { Margin, Width } from '@makeswift/prop-controllers'\n\nexport function registerComponent(runtime: ReactRuntime) {\n return runtime.registerComponent(\n lazy(() => import('./Text')),\n {\n type: MakeswiftComponentType.Text,\n label: 'Text',\n props: {\n id: Props.ElementID(),\n text: RichText(),\n width: Width({\n format: Width.Format.ClassName,\n preset: [\n {\n deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,\n value: { value: 700, unit: 'px' },\n },\n ],\n defaultValue: { value: 100, unit: '%' },\n }),\n margin: Margin({\n format: Margin.Format.ClassName,\n preset: [\n {\n deviceId: getBaseBreakpoint(runtime.getBreakpoints()).id,\n value: {\n marginTop: null,\n marginRight: 'auto',\n marginBottom: { value: 20, unit: 'px' },\n marginLeft: 'auto',\n },\n },\n ],\n }),\n },\n },\n )\n}\n"],"mappings":"AAAA,SAAS,aAAa;AAEtB,SAAS,8BAA8B;AACvC,SAAS,yBAAyB;AAClC,SAAS,gBAAgB;AACzB,SAAS,YAAY;AACrB,SAAS,QAAQ,aAAa;AAEvB,SAAS,kBAAkB,SAAuB;AACvD,SAAO,QAAQ;AAAA,IACb,KAAK,MAAM,OAAO,QAAQ,CAAC;AAAA,IAC3B;AAAA,MACE,MAAM,uBAAuB;AAAA,MAC7B,OAAO;AAAA,MACP,OAAO;AAAA,QACL,IAAI,MAAM,UAAU;AAAA,QACpB,MAAM,SAAS;AAAA,QACf,OAAO,MAAM;AAAA,UACX,QAAQ,MAAM,OAAO;AAAA,UACrB,QAAQ;AAAA,YACN;AAAA,cACE,UAAU,kBAAkB,QAAQ,eAAe,CAAC,EAAE;AAAA,cACtD,OAAO,EAAE,OAAO,KAAK,MAAM,KAAK;AAAA,YAClC;AAAA,UACF;AAAA,UACA,cAAc,EAAE,OAAO,KAAK,MAAM,IAAI;AAAA,QACxC,CAAC;AAAA,QACD,QAAQ,OAAO;AAAA,UACb,QAAQ,OAAO,OAAO;AAAA,UACtB,QAAQ;AAAA,YACN;AAAA,cACE,UAAU,kBAAkB,QAAQ,eAAe,CAAC,EAAE;AAAA,cACtD,OAAO;AAAA,gBACL,WAAW;AAAA,gBACX,aAAa;AAAA,gBACb,cAAc,EAAE,OAAO,IAAI,MAAM,KAAK;AAAA,gBACtC,YAAY;AAAA,cACd;AAAA,YACF;AAAA,UACF;AAAA,QACF,CAAC;AAAA,MACH;AAAA,IACF;AAAA,EACF;AACF;","names":[]}

package/dist/esm/components/builtin/Video/Video.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/components/builtin/Video/Video.tsx"],"sourcesContent":["'use client'\n\nimport { cx } from '@emotion/css'\nimport { forwardRef, Ref, useEffect, useState } from 'react'\nimport ReactPlayer from 'react-player'\n\nimport { ElementIDValue, ~~VideoValue~~ } from '../../../prop-controllers/descriptors'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { placeholders } from '../../utils/placeholders'\n\ntype Props = {\n id?: ElementIDValue\n video?: ~~VideoValue~~\n width?: string\n margin?: string\n borderRadius?: string\n}\n\nconst ASPECT_RATIO = 16 / 9\n\nconst Video = forwardRef(function Video(\n { id, video, width, margin, borderRadius }: Props,\n ref: Ref<HTMLDivElement>,\n) {\n const canPlayUrl = video && video.url != null && ReactPlayer.canPlay(video.url)\n /*\n @see https://github.com/cookpete/react-player/issues/1428\n */\n const [shouldRenderReactPlayer, setShouldRenderReactPlayer] = useState(false)\n\n useEffect(() => {\n setShouldRenderReactPlayer(true)\n }, [])\n\n return (\n <div\n ref={ref}\n id={id}\n className={cx(\n useStyle({ display: 'flex', flexDirection: 'column', overflow: 'hidden' }),\n width,\n margin,\n borderRadius,\n )}\n >\n <div style={{ position: 'relative', paddingTop: `${100 / ASPECT_RATIO}%` }}>\n <div style={{ position: 'absolute', top: 0, left: 0, right: 0, bottom: 0 }}>\n {shouldRenderReactPlayer && canPlayUrl === true ? (\n <ReactPlayer\n {...video}\n width=\"100%\"\n height=\"100%\"\n config={{\n vimeo: { playerOptions: { background: video != null && !video.controls } },\n wistia: {\n options: {\n endVideoBehavior: video != null && video.loop === true ? 'loop' : 'default',\n },\n },\n }}\n />\n ) : (\n <img width=\"100%\" src={placeholders.video.src} alt=\"Video Placeholder\" />\n )}\n </div>\n </div>\n </div>\n )\n})\n\nexport default Video\n"],"mappings":";~~AAgDY~~;~~AA9CZ~~,SAAS,UAAU;AACnB,SAAS,YAAiB,WAAW,gBAAgB;AACrD,OAAO,iBAAiB;AAGxB,SAAS,gBAAgB;AACzB,SAAS,oBAAoB;~~AAU7B~~,MAAM,eAAe,KAAK;AAE1B,MAAM,QAAQ,WAAW,SAASA,OAChC,EAAE,IAAI,OAAO,OAAO,QAAQ,aAAa,GACzC,KACA;AACA,QAAM,aAAa,SAAS,MAAM,OAAO,QAAQ,YAAY,QAAQ,MAAM,GAAG;AAI9E,QAAM,CAAC,yBAAyB,0BAA0B,IAAI,SAAS,KAAK;AAE5E,YAAU,MAAM;AACd,+BAA2B,IAAI;AAAA,EACjC,GAAG,CAAC,CAAC;AAEL,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,WAAW;AAAA,QACT,SAAS,EAAE,SAAS,QAAQ,eAAe,UAAU,UAAU,SAAS,CAAC;AAAA,QACzE;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEA,8BAAC,SAAI,OAAO,EAAE,UAAU,YAAY,YAAY,GAAG,MAAM,YAAY,IAAI,GACvE,8BAAC,SAAI,OAAO,EAAE,UAAU,YAAY,KAAK,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,EAAE,GACtE,qCAA2B,eAAe,OACzC;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,UACJ,OAAM;AAAA,UACN,QAAO;AAAA,UACP,QAAQ;AAAA,YACN,OAAO,EAAE,eAAe,EAAE,YAAY,SAAS,QAAQ,CAAC,MAAM,SAAS,EAAE;AAAA,YACzE,QAAQ;AAAA,cACN,SAAS;AAAA,gBACP,kBAAkB,SAAS,QAAQ,MAAM,SAAS,OAAO,SAAS;AAAA,cACpE;AAAA,YACF;AAAA,UACF;AAAA;AAAA,MACF,IAEA,oBAAC,SAAI,OAAM,QAAO,KAAK,aAAa,MAAM,KAAK,KAAI,qBAAoB,GAE3E,GACF;AAAA;AAAA,EACF;AAEJ,CAAC;AAED,IAAO,gBAAQ;","names":["Video"]}
1	+ {"version":3,"sources":["../../../../../src/components/builtin/Video/Video.tsx"],"sourcesContent":["'use client'\n\nimport { cx } from '@emotion/css'\nimport { forwardRef, Ref, useEffect, useState } from 'react'\nimport ReactPlayer from 'react-player'\n\nimport { ElementIDValue } from '../../../prop-controllers/descriptors'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { placeholders } from '../../utils/placeholders'\nimport { VideoData } from '@makeswift/prop-controllers'\n\ntype Props = {\n id?: ElementIDValue\n video?: VideoData\n width?: string\n margin?: string\n borderRadius?: string\n}\n\nconst ASPECT_RATIO = 16 / 9\n\nconst Video = forwardRef(function Video(\n { id, video, width, margin, borderRadius }: Props,\n ref: Ref<HTMLDivElement>,\n) {\n const canPlayUrl = video && video.url != null && ReactPlayer.canPlay(video.url)\n /*\n @see https://github.com/cookpete/react-player/issues/1428\n */\n const [shouldRenderReactPlayer, setShouldRenderReactPlayer] = useState(false)\n\n useEffect(() => {\n setShouldRenderReactPlayer(true)\n }, [])\n\n return (\n <div\n ref={ref}\n id={id}\n className={cx(\n useStyle({ display: 'flex', flexDirection: 'column', overflow: 'hidden' }),\n width,\n margin,\n borderRadius,\n )}\n >\n <div style={{ position: 'relative', paddingTop: `${100 / ASPECT_RATIO}%` }}>\n <div style={{ position: 'absolute', top: 0, left: 0, right: 0, bottom: 0 }}>\n {shouldRenderReactPlayer && canPlayUrl === true ? (\n <ReactPlayer\n {...video}\n width=\"100%\"\n height=\"100%\"\n config={{\n vimeo: { playerOptions: { background: video != null && !video.controls } },\n wistia: {\n options: {\n endVideoBehavior: video != null && video.loop === true ? 'loop' : 'default',\n },\n },\n }}\n />\n ) : (\n <img width=\"100%\" src={placeholders.video.src} alt=\"Video Placeholder\" />\n )}\n </div>\n </div>\n </div>\n )\n})\n\nexport default Video\n"],"mappings":";AAiDY;AA/CZ,SAAS,UAAU;AACnB,SAAS,YAAiB,WAAW,gBAAgB;AACrD,OAAO,iBAAiB;AAGxB,SAAS,gBAAgB;AACzB,SAAS,oBAAoB;AAW7B,MAAM,eAAe,KAAK;AAE1B,MAAM,QAAQ,WAAW,SAASA,OAChC,EAAE,IAAI,OAAO,OAAO,QAAQ,aAAa,GACzC,KACA;AACA,QAAM,aAAa,SAAS,MAAM,OAAO,QAAQ,YAAY,QAAQ,MAAM,GAAG;AAI9E,QAAM,CAAC,yBAAyB,0BAA0B,IAAI,SAAS,KAAK;AAE5E,YAAU,MAAM;AACd,+BAA2B,IAAI;AAAA,EACjC,GAAG,CAAC,CAAC;AAEL,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,WAAW;AAAA,QACT,SAAS,EAAE,SAAS,QAAQ,eAAe,UAAU,UAAU,SAAS,CAAC;AAAA,QACzE;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MAEA,8BAAC,SAAI,OAAO,EAAE,UAAU,YAAY,YAAY,GAAG,MAAM,YAAY,IAAI,GACvE,8BAAC,SAAI,OAAO,EAAE,UAAU,YAAY,KAAK,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ,EAAE,GACtE,qCAA2B,eAAe,OACzC;AAAA,QAAC;AAAA;AAAA,UACE,GAAG;AAAA,UACJ,OAAM;AAAA,UACN,QAAO;AAAA,UACP,QAAQ;AAAA,YACN,OAAO,EAAE,eAAe,EAAE,YAAY,SAAS,QAAQ,CAAC,MAAM,SAAS,EAAE;AAAA,YACzE,QAAQ;AAAA,cACN,SAAS;AAAA,gBACP,kBAAkB,SAAS,QAAQ,MAAM,SAAS,OAAO,SAAS;AAAA,cACpE;AAAA,YACF;AAAA,UACF;AAAA;AAAA,MACF,IAEA,oBAAC,SAAI,OAAM,QAAO,KAAK,aAAa,MAAM,KAAK,KAAI,qBAAoB,GAE3E,GACF;AAAA;AAAA,EACF;AAEJ,CAAC;AAED,IAAO,gBAAQ;","names":["Video"]}

package/dist/esm/components/builtin/Video/register.js CHANGED Viewed

@@ -2,6 +2,7 @@ import { Props } from "../../../prop-controllers";
 import { MakeswiftComponentType } from "../constants";
 import { ComponentIcon } from "../../../state/modules/components-meta";
 import { lazy } from "react";
+import { BorderRadius, Margin, Video, Width } from "@makeswift/prop-controllers";
 function registerComponent(runtime) {
   return runtime.registerComponent(
     lazy(() => import("./Video")),
@@ -11,13 +12,13 @@ function registerComponent(runtime) {
       icon: ComponentIcon.Video,
       props: {
         id: Props.ElementID(),
-        video: Props.Video({ preset: { controls: true } }),
-        width: Props.Width({
-          format: Props.Width.Format.ClassName,
+        video: Video({ preset: { controls: true } }),
+        width: Width({
+          format: Width.Format.ClassName,
           defaultValue: { value: 560, unit: "px" }
         }),
-        margin: Props.Margin({ format: Props.Margin.Format.ClassName }),
-        borderRadius: Props.BorderRadius({ format: Props.BorderRadius.Format.ClassName })
+        margin: Margin({ format: Margin.Format.ClassName }),
+        borderRadius: BorderRadius({ format: BorderRadius.Format.ClassName })
       }
     }
   );

package/dist/esm/components/builtin/Video/register.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/components/builtin/Video/register.ts"],"sourcesContent":["import { Props } from '../../../prop-controllers'\nimport { ReactRuntime } from '../../../runtimes/react'\nimport { MakeswiftComponentType } from '../constants'\nimport { ComponentIcon } from '../../../state/modules/components-meta'\nimport { lazy } from 'react'\n\nexport function registerComponent(runtime: ReactRuntime) {\n return runtime.registerComponent(\n lazy(() => import('./Video')),\n {\n type: MakeswiftComponentType.Video,\n label: 'Video',\n icon: ComponentIcon.Video,\n props: {\n id: Props.ElementID(),\n video: ~~Props.~~Video({ preset: { controls: true } }),\n width: ~~Props.~~Width({\n format: ~~Props.~~Width.Format.ClassName,\n defaultValue: { value: 560, unit: 'px' },\n }),\n margin: ~~Props.~~Margin({ format: ~~Props.~~Margin.Format.ClassName }),\n borderRadius: ~~Props.~~BorderRadius({ format: ~~Props.~~BorderRadius.Format.ClassName }),\n },\n },\n )\n}\n"],"mappings":"AAAA,SAAS,aAAa;AAEtB,SAAS,8BAA8B;AACvC,SAAS,qBAAqB;AAC9B,SAAS,YAAY;~~AAEd~~,SAAS,kBAAkB,SAAuB;AACvD,SAAO,QAAQ;AAAA,IACb,KAAK,MAAM,OAAO,SAAS,CAAC;AAAA,IAC5B;AAAA,MACE,MAAM,uBAAuB;AAAA,MAC7B,OAAO;AAAA,MACP,MAAM,cAAc;AAAA,MACpB,OAAO;AAAA,QACL,IAAI,MAAM,UAAU;AAAA,QACpB,OAAO,MAAM,~~MAAM,~~EAAE,QAAQ,EAAE,UAAU,KAAK,EAAE,CAAC;AAAA,~~QACjD~~,OAAO,MAAM~~,MAAM~~;AAAA,~~UACjB~~,QAAQ,MAAM,~~MAAM,~~OAAO;AAAA,~~UAC3B~~,cAAc,EAAE,OAAO,KAAK,MAAM,KAAK;AAAA,QACzC,CAAC;AAAA,QACD,QAAQ,~~MAAM,~~OAAO,EAAE,QAAQ,~~MAAM,~~OAAO,OAAO,UAAU,CAAC;AAAA,~~QAC9D~~,cAAc,~~MAAM,~~aAAa,EAAE,QAAQ,~~MAAM,~~aAAa,OAAO,UAAU,CAAC;AAAA,~~MAClF~~;AAAA,IACF;AAAA,EACF;AACF;","names":[]}
1	+ {"version":3,"sources":["../../../../../src/components/builtin/Video/register.ts"],"sourcesContent":["import { Props } from '../../../prop-controllers'\nimport { ReactRuntime } from '../../../runtimes/react'\nimport { MakeswiftComponentType } from '../constants'\nimport { ComponentIcon } from '../../../state/modules/components-meta'\nimport { lazy } from 'react'\nimport { BorderRadius, Margin, Video, Width } from '@makeswift/prop-controllers'\n\nexport function registerComponent(runtime: ReactRuntime) {\n return runtime.registerComponent(\n lazy(() => import('./Video')),\n {\n type: MakeswiftComponentType.Video,\n label: 'Video',\n icon: ComponentIcon.Video,\n props: {\n id: Props.ElementID(),\n video: Video({ preset: { controls: true } }),\n width: Width({\n format: Width.Format.ClassName,\n defaultValue: { value: 560, unit: 'px' },\n }),\n margin: Margin({ format: Margin.Format.ClassName }),\n borderRadius: BorderRadius({ format: BorderRadius.Format.ClassName }),\n },\n },\n )\n}\n"],"mappings":"AAAA,SAAS,aAAa;AAEtB,SAAS,8BAA8B;AACvC,SAAS,qBAAqB;AAC9B,SAAS,YAAY;AACrB,SAAS,cAAc,QAAQ,OAAO,aAAa;AAE5C,SAAS,kBAAkB,SAAuB;AACvD,SAAO,QAAQ;AAAA,IACb,KAAK,MAAM,OAAO,SAAS,CAAC;AAAA,IAC5B;AAAA,MACE,MAAM,uBAAuB;AAAA,MAC7B,OAAO;AAAA,MACP,MAAM,cAAc;AAAA,MACpB,OAAO;AAAA,QACL,IAAI,MAAM,UAAU;AAAA,QACpB,OAAO,MAAM,EAAE,QAAQ,EAAE,UAAU,KAAK,EAAE,CAAC;AAAA,QAC3C,OAAO,MAAM;AAAA,UACX,QAAQ,MAAM,OAAO;AAAA,UACrB,cAAc,EAAE,OAAO,KAAK,MAAM,KAAK;AAAA,QACzC,CAAC;AAAA,QACD,QAAQ,OAAO,EAAE,QAAQ,OAAO,OAAO,UAAU,CAAC;AAAA,QAClD,cAAc,aAAa,EAAE,QAAQ,aAAa,OAAO,UAAU,CAAC;AAAA,MACtE;AAAA,IACF;AAAA,EACF;AACF;","names":[]}

package/dist/esm/components/hooks/index.js CHANGED Viewed

@@ -3,5 +3,10 @@ export * from "./useBorder";
 export * from "./useBoxShadow";
 export * from "./useResponsiveColor";
 export * from "./useMediaQuery";
-export * from "./usePropControllerLinkData";
+export * from "./useLinkPropControllerData";
+export * from "./useCheckboxPropControllerData";
+export * from "./useDatePropControllerData";
+export * from "./useFontPropControllerData";
+export * from "./useVideoPropControllerData";
+export * from "./useTablePropControllerData";
 //# sourceMappingURL=index.js.map

package/dist/esm/components/hooks/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/hooks/index.ts"],"sourcesContent":["export * from './useBackgrounds'\nexport * from './useBorder'\nexport * from './useBoxShadow'\nexport * from './useResponsiveColor'\nexport * from './useMediaQuery'\nexport * from './~~usePropControllerLinkData~~'\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}
1	+ {"version":3,"sources":["../../../../src/components/hooks/index.ts"],"sourcesContent":["export * from './useBackgrounds'\nexport * from './useBorder'\nexport * from './useBoxShadow'\nexport * from './useResponsiveColor'\nexport * from './useMediaQuery'\nexport * from './useLinkPropControllerData'\nexport * from './useCheckboxPropControllerData'\nexport * from './useDatePropControllerData'\nexport * from './useFontPropControllerData'\nexport * from './useVideoPropControllerData'\nexport * from './useTablePropControllerData'\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}

package/dist/esm/components/hooks/useBorder.js CHANGED Viewed

@@ -1,4 +1,6 @@
-import { getBorderSwatchIds } from "../../prop-controllers/introspection";
+import {
+  getBorderPropControllerDataSwatchIds
+} from "@makeswift/prop-controllers";
 import { useSwatches } from "../../runtimes/react/hooks/makeswift-api";
 import { isNonNullable } from "../utils/isNonNullable";
 function mapSideColor(swatches, { color, ...restOfSide }) {
@@ -11,10 +13,10 @@ function mapSideColor(swatches, { color, ...restOfSide }) {
   };
 }
 function useBorder(value) {
-  const swatchIds = getBorderSwatchIds(value);
+  const swatchIds = getBorderPropControllerDataSwatchIds(value);
   const swatches = useSwatches(swatchIds);
   if (value == null)
-    return null;
+    return void 0;
   return value.map(({ value: { borderTop, borderBottom, borderLeft, borderRight }, ...rest }) => ({
     ...rest,
     value: {

package/dist/esm/components/hooks/useBorder.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/hooks/useBorder.ts"],"sourcesContent":["import { BorderStyleProperty } from 'csstype'\n\nimport type { ColorValue as Color } from '../utils/types'\nimport { ResponsiveValue } from '../../prop-controllers'\nimport {\n ~~BorderValue as ResponsiveBorderValue~~,\n ~~BorderSide as BorderValueSide~~,\n} from '~~../../prop-controllers~~/~~descriptors'\nimport { getBorderSwatchIds } from '../../~~prop-controllers~~/introspection~~'\nimport { useSwatches } from '../../runtimes/react/hooks/makeswift-api'\nimport { Swatch } from '../../api'\nimport { isNonNullable } from '../utils/isNonNullable'\n\nfunction mapSideColor(swatches: (Swatch \| null)[], { color, ...restOfSide }: ~~BorderValueSide~~) {\n return {\n ...restOfSide,\n color: color && {\n alpha: color.alpha,\n swatch: swatches.filter(isNonNullable).find(s => s && s.id === color.swatchId),\n },\n }\n}\n\nexport type BorderSide = {\n width: number \| null \| undefined\n style: BorderStyleProperty\n color: Color \| null \| undefined\n}\n\ntype BorderData = {\n borderTop: BorderSide \| null \| undefined\n borderRight: BorderSide \| null \| undefined\n borderBottom: BorderSide \| null \| undefined\n borderLeft: BorderSide \| null \| undefined\n}\n\nexport type BorderPropControllerData = ResponsiveValue<BorderData>\n\nexport function useBorder(\n value: ~~ResponsiveBorderValue~~ \| ~~null \|~~ undefined,\n): BorderPropControllerData \| ~~null \|~~ undefined {\n const swatchIds = ~~getBorderSwatchIds~~(value)\n const swatches = useSwatches(swatchIds)\n\n if (value == null) return ~~null~~\n\n return value.map(({ value: { borderTop, borderBottom, borderLeft, borderRight }, ...rest }) => ({\n ...rest,\n value: {\n borderTop: borderTop && mapSideColor(swatches, borderTop),\n borderBottom: borderBottom && mapSideColor(swatches, borderBottom),\n borderLeft: borderLeft && mapSideColor(swatches, borderLeft),\n borderRight: borderRight && mapSideColor(swatches, borderRight),\n },\n }))\n}\n"],"mappings":"~~AAQA~~,~~SAAS~~,~~0BAA0B~~;~~AACnC~~,SAAS,mBAAmB;AAE5B,SAAS,qBAAqB;AAE9B,SAAS,aAAa,UAA6B,EAAE,OAAO,GAAG,WAAW,~~GAAoB~~;~~AAC5F~~,SAAO;AAAA,IACL,GAAG;AAAA,IACH,OAAO,SAAS;AAAA,MACd,OAAO,MAAM;AAAA,MACb,QAAQ,SAAS,OAAO,aAAa,EAAE,KAAK,OAAK,KAAK,EAAE,OAAO,MAAM,QAAQ;AAAA,IAC/E;AAAA,EACF;AACF;AAiBO,SAAS,UACd,~~OAC6C~~;~~AAC7C~~,QAAM,YAAY,~~mBAAmB~~,KAAK;~~AAC1C~~,QAAM,WAAW,YAAY,SAAS;AAEtC,MAAI,SAAS;AAAM,WAAO;AAE1B,SAAO,MAAM,IAAI,CAAC,EAAE,OAAO,EAAE,WAAW,cAAc,YAAY,YAAY,GAAG,GAAG,KAAK,OAAO;AAAA,IAC9F,GAAG;AAAA,IACH,OAAO;AAAA,MACL,WAAW,aAAa,aAAa,UAAU,SAAS;AAAA,MACxD,cAAc,gBAAgB,aAAa,UAAU,YAAY;AAAA,MACjE,YAAY,cAAc,aAAa,UAAU,UAAU;AAAA,MAC3D,aAAa,eAAe,aAAa,UAAU,WAAW;AAAA,IAChE;AAAA,EACF,EAAE;AACJ;","names":[]}
1	+ {"version":3,"sources":["../../../../src/components/hooks/useBorder.ts"],"sourcesContent":["import { BorderStyleProperty } from 'csstype'\n\nimport type { ColorValue as Color } from '../utils/types'\nimport { ResponsiveValue } from '../../prop-controllers'\nimport {\n ResponsiveBorderData,\n BorderSideData,\n getBorderPropControllerDataSwatchIds,\n} from '@makeswift/prop-controllers'\nimport { useSwatches } from '../../runtimes/react/hooks/makeswift-api'\nimport { Swatch } from '../../api'\nimport { isNonNullable } from '../utils/isNonNullable'\n\nfunction mapSideColor(swatches: (Swatch \| null)[], { color, ...restOfSide }: BorderSideData) {\n return {\n ...restOfSide,\n color: color && {\n alpha: color.alpha,\n swatch: swatches.filter(isNonNullable).find(s => s && s.id === color.swatchId),\n },\n }\n}\n\nexport type BorderSide = {\n width: number \| null \| undefined\n style: BorderStyleProperty\n color: Color \| null \| undefined\n}\n\ntype BorderData = {\n borderTop: BorderSide \| null \| undefined\n borderRight: BorderSide \| null \| undefined\n borderBottom: BorderSide \| null \| undefined\n borderLeft: BorderSide \| null \| undefined\n}\n\nexport type BorderPropControllerData = ResponsiveValue<BorderData>\n\nexport function useBorder(\n value: ResponsiveBorderData \| undefined,\n): BorderPropControllerData \| undefined {\n const swatchIds = getBorderPropControllerDataSwatchIds(value)\n const swatches = useSwatches(swatchIds)\n\n if (value == null) return undefined\n\n return value.map(({ value: { borderTop, borderBottom, borderLeft, borderRight }, ...rest }) => ({\n ...rest,\n value: {\n borderTop: borderTop && mapSideColor(swatches, borderTop),\n borderBottom: borderBottom && mapSideColor(swatches, borderBottom),\n borderLeft: borderLeft && mapSideColor(swatches, borderLeft),\n borderRight: borderRight && mapSideColor(swatches, borderRight),\n },\n }))\n}\n"],"mappings":"AAIA;AAAA,EAGE;AAAA,OACK;AACP,SAAS,mBAAmB;AAE5B,SAAS,qBAAqB;AAE9B,SAAS,aAAa,UAA6B,EAAE,OAAO,GAAG,WAAW,GAAmB;AAC3F,SAAO;AAAA,IACL,GAAG;AAAA,IACH,OAAO,SAAS;AAAA,MACd,OAAO,MAAM;AAAA,MACb,QAAQ,SAAS,OAAO,aAAa,EAAE,KAAK,OAAK,KAAK,EAAE,OAAO,MAAM,QAAQ;AAAA,IAC/E;AAAA,EACF;AACF;AAiBO,SAAS,UACd,OACsC;AACtC,QAAM,YAAY,qCAAqC,KAAK;AAC5D,QAAM,WAAW,YAAY,SAAS;AAEtC,MAAI,SAAS;AAAM,WAAO;AAE1B,SAAO,MAAM,IAAI,CAAC,EAAE,OAAO,EAAE,WAAW,cAAc,YAAY,YAAY,GAAG,GAAG,KAAK,OAAO;AAAA,IAC9F,GAAG;AAAA,IACH,OAAO;AAAA,MACL,WAAW,aAAa,aAAa,UAAU,SAAS;AAAA,MACxD,cAAc,gBAAgB,aAAa,UAAU,YAAY;AAAA,MACjE,YAAY,cAAc,aAAa,UAAU,UAAU;AAAA,MAC3D,aAAa,eAAe,aAAa,UAAU,WAAW;AAAA,IAChE;AAAA,EACF,EAAE;AACJ;","names":[]}

package/dist/esm/components/hooks/useBoxShadow.js CHANGED Viewed

@@ -1,6 +1,9 @@
 import { isNonNullable } from "../utils/isNonNullable";
-import { getBoxShadowsSwatchIds } from "../../prop-controllers/introspection";
 import { useSwatches } from "../../runtimes/react/hooks/makeswift-api";
+import {
+  getShadowsPropControllerDataResponsiveShadowsData,
+  getShadowsPropControllerDataSwatchIds
+} from "@makeswift/prop-controllers";
 const ShadowDefaultValue = {
   inset: false,
   offsetX: 0,
@@ -9,12 +12,13 @@ const ShadowDefaultValue = {
   spreadRadius: 0,
   color: null
 };
-function useBoxShadow(value) {
-  const swatchIds = getBoxShadowsSwatchIds(value);
+function useBoxShadow(data) {
+  const swatchIds = getShadowsPropControllerDataSwatchIds(data);
   const swatches = useSwatches(swatchIds);
-  if (value == null)
+  const responsiveShadowsData = getShadowsPropControllerDataResponsiveShadowsData(data);
+  if (responsiveShadowsData == null)
     return null;
-  return value.map(({ value: shadows, ...restOfValue }) => ({
+  return responsiveShadowsData.map(({ value: shadows, ...restOfValue }) => ({
     ...restOfValue,
     value: shadows.map(
       ({

package/dist/esm/components/hooks/useBoxShadow.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/hooks/useBoxShadow.ts"],"sourcesContent":["import { isNonNullable } from '../utils/isNonNullable'\nimport type { ColorValue as Color } from '../utils/types'\nimport type { ResponsiveValue } from '../../prop-controllers'\nimport ~~type~~ { ~~ShadowsValue~~ ~~as ResponsiveShadowsValue~~ } from '../../~~prop~~-~~controllers/descriptors~~'\nimport { ~~getBoxShadowsSwatchIds~~ } from '~~../../~~prop-controllers~~/introspection~~'\~~nimport { useSwatches } from '../../runtimes/react/hooks/makeswift-api'\~~n\ntype ~~ShadowData~~ = {\n ~~id: string\n payload: {\n~~ inset: boolean\n offsetX: number\n offsetY: number\n blurRadius: number\n spreadRadius: number\n color: Color \| null \| undefined\n }\n}\n\nconst ShadowDefaultValue = {\n inset: false,\n offsetX: 0,\n offsetY: 2,\n blurRadius: 4,\n spreadRadius: 0,\n color: null,\n} as const\n\nexport type ~~BoxShadowData~~ = ~~Array<ShadowData>\~~n\nexport type ~~BoxShadowPropControllerData~~ = ResponsiveValue<~~BoxShadowData~~>\n\nexport function useBoxShadow(\n ~~value~~: ~~ResponsiveShadowsValue~~ \| null \| undefined,\n): ~~BoxShadowPropControllerData~~ \| null \| undefined {\n const swatchIds = ~~getBoxShadowsSwatchIds~~(~~value~~)\n const swatches = useSwatches(swatchIds)\n\n if (~~value~~ == null) return null\n\n return ~~value~~.map(({ value: shadows, ...restOfValue }) => ({\n ...restOfValue,\n value: shadows.map(\n ({\n payload: { color, inset, offsetX, offsetY, blurRadius, spreadRadius },\n ...restOfShadow\n }) => ({\n ...restOfShadow,\n payload: {\n color:\n color != null\n ? {\n swatch: swatches.filter(isNonNullable).find(s => s && s.id === color.swatchId),\n alpha: color.alpha,\n }\n : null,\n inset: inset ?? ShadowDefaultValue.inset,\n offsetX: offsetX ?? ShadowDefaultValue.offsetX,\n offsetY: offsetY ?? ShadowDefaultValue.offsetY,\n blurRadius: blurRadius ?? ShadowDefaultValue.blurRadius,\n spreadRadius: spreadRadius ?? ShadowDefaultValue.spreadRadius,\n },\n }),\n ),\n }))\n}\n"],"mappings":"AAAA,SAAS,qBAAqB;~~AAI9B~~,SAAS,~~8BAA8B~~;~~AACvC~~,~~SAAS~~,~~mBAAmB~~;~~AAc5B~~,MAAM,~~qBAAqB~~;AAAA,~~EACzB~~,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,OAAO;AACT;AAMO,SAAS,aACd,~~OACgD~~;~~AAChD~~,QAAM,YAAY,~~uBAAuB~~,~~KAAK~~;~~AAC9C~~,QAAM,WAAW,YAAY,SAAS;~~AAEtC~~,MAAI,~~SAAS~~;AAAM,WAAO;~~AAE1B~~,SAAO,~~MAAM~~,IAAI,CAAC,EAAE,OAAO,SAAS,GAAG,YAAY,OAAO;AAAA,~~IACxD~~,GAAG;AAAA,IACH,OAAO,QAAQ;AAAA,MACb,CAAC;AAAA,QACC,SAAS,EAAE,OAAO,OAAO,SAAS,SAAS,YAAY,aAAa;AAAA,QACpE,GAAG;AAAA,MACL,OAAO;AAAA,QACL,GAAG;AAAA,QACH,SAAS;AAAA,UACP,OACE,SAAS,OACL;AAAA,YACE,QAAQ,SAAS,OAAO,aAAa,EAAE,KAAK,OAAK,KAAK,EAAE,OAAO,MAAM,QAAQ;AAAA,YAC7E,OAAO,MAAM;AAAA,UACf,IACA;AAAA,UACN,OAAO,SAAS,mBAAmB;AAAA,UACnC,SAAS,WAAW,mBAAmB;AAAA,UACvC,SAAS,WAAW,mBAAmB;AAAA,UACvC,YAAY,cAAc,mBAAmB;AAAA,UAC7C,cAAc,gBAAgB,mBAAmB;AAAA,QACnD;AAAA,MACF;AAAA,IACF;AAAA,EACF,EAAE;AACJ;","names":[]}
1	+ {"version":3,"sources":["../../../../src/components/hooks/useBoxShadow.ts"],"sourcesContent":["import { isNonNullable } from '../utils/isNonNullable'\nimport type { ColorValue as Color } from '../utils/types'\nimport type { ResponsiveValue } from '../../prop-controllers'\nimport { useSwatches } from '../../runtimes/react/hooks/makeswift-api'\nimport {\n ShadowsPropControllerData,\n getShadowsPropControllerDataResponsiveShadowsData,\n getShadowsPropControllerDataSwatchIds,\n} from '@makeswift/prop-controllers'\n\ntype ShadowValue = {\n inset: boolean\n offsetX: number\n offsetY: number\n blurRadius: number\n spreadRadius: number\n color: Color \| null \| undefined\n}\n\nconst ShadowDefaultValue: ShadowValue = {\n inset: false,\n offsetX: 0,\n offsetY: 2,\n blurRadius: 4,\n spreadRadius: 0,\n color: null,\n} as const\n\nexport type BoxShadow = { id: string; payload: ShadowValue }[]\n\nexport type ResponsiveBoxShadow = ResponsiveValue<BoxShadow>\n\nexport function useBoxShadow(\n data: ShadowsPropControllerData \| null \| undefined,\n): ResponsiveBoxShadow \| null \| undefined {\n const swatchIds = getShadowsPropControllerDataSwatchIds(data)\n const swatches = useSwatches(swatchIds)\n const responsiveShadowsData = getShadowsPropControllerDataResponsiveShadowsData(data)\n\n if (responsiveShadowsData == null) return null\n\n return responsiveShadowsData.map(({ value: shadows, ...restOfValue }) => ({\n ...restOfValue,\n value: shadows.map(\n ({\n payload: { color, inset, offsetX, offsetY, blurRadius, spreadRadius },\n ...restOfShadow\n }) => ({\n ...restOfShadow,\n payload: {\n color:\n color != null\n ? {\n swatch: swatches.filter(isNonNullable).find(s => s && s.id === color.swatchId),\n alpha: color.alpha,\n }\n : null,\n inset: inset ?? ShadowDefaultValue.inset,\n offsetX: offsetX ?? ShadowDefaultValue.offsetX,\n offsetY: offsetY ?? ShadowDefaultValue.offsetY,\n blurRadius: blurRadius ?? ShadowDefaultValue.blurRadius,\n spreadRadius: spreadRadius ?? ShadowDefaultValue.spreadRadius,\n },\n }),\n ),\n }))\n}\n"],"mappings":"AAAA,SAAS,qBAAqB;AAG9B,SAAS,mBAAmB;AAC5B;AAAA,EAEE;AAAA,EACA;AAAA,OACK;AAWP,MAAM,qBAAkC;AAAA,EACtC,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,cAAc;AAAA,EACd,OAAO;AACT;AAMO,SAAS,aACd,MACwC;AACxC,QAAM,YAAY,sCAAsC,IAAI;AAC5D,QAAM,WAAW,YAAY,SAAS;AACtC,QAAM,wBAAwB,kDAAkD,IAAI;AAEpF,MAAI,yBAAyB;AAAM,WAAO;AAE1C,SAAO,sBAAsB,IAAI,CAAC,EAAE,OAAO,SAAS,GAAG,YAAY,OAAO;AAAA,IACxE,GAAG;AAAA,IACH,OAAO,QAAQ;AAAA,MACb,CAAC;AAAA,QACC,SAAS,EAAE,OAAO,OAAO,SAAS,SAAS,YAAY,aAAa;AAAA,QACpE,GAAG;AAAA,MACL,OAAO;AAAA,QACL,GAAG;AAAA,QACH,SAAS;AAAA,UACP,OACE,SAAS,OACL;AAAA,YACE,QAAQ,SAAS,OAAO,aAAa,EAAE,KAAK,OAAK,KAAK,EAAE,OAAO,MAAM,QAAQ;AAAA,YAC7E,OAAO,MAAM;AAAA,UACf,IACA;AAAA,UACN,OAAO,SAAS,mBAAmB;AAAA,UACnC,SAAS,WAAW,mBAAmB;AAAA,UACvC,SAAS,WAAW,mBAAmB;AAAA,UACvC,YAAY,cAAc,mBAAmB;AAAA,UAC7C,cAAc,gBAAgB,mBAAmB;AAAA,QACnD;AAAA,MACF;AAAA,IACF;AAAA,EACF,EAAE;AACJ;","names":[]}

package/dist/esm/components/hooks/useCheckboxPropControllerData.js ADDED Viewed

@@ -0,0 +1,12 @@
+import {
+  getCheckboxPropControllerDataBoolean
+} from "@makeswift/prop-controllers";
+function useCheckboxPropControllerData(data) {
+  if (data == null)
+    return data;
+  return getCheckboxPropControllerDataBoolean(data);
+}
+export {
+  useCheckboxPropControllerData
+};
+//# sourceMappingURL=useCheckboxPropControllerData.js.map

package/dist/esm/components/hooks/useCheckboxPropControllerData.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../../src/components/hooks/useCheckboxPropControllerData.ts"],"sourcesContent":["import {\n CheckboxPropControllerData,\n getCheckboxPropControllerDataBoolean,\n} from '@makeswift/prop-controllers'\n\nexport function useCheckboxPropControllerData(\n data: CheckboxPropControllerData | undefined,\n): boolean | undefined {\n if (data == null) return data\n\n return getCheckboxPropControllerDataBoolean(data)\n}\n"],"mappings":"AAAA;AAAA,EAEE;AAAA,OACK;AAEA,SAAS,8BACd,MACqB;AACrB,MAAI,QAAQ;AAAM,WAAO;AAEzB,SAAO,qCAAqC,IAAI;AAClD;","names":[]}

package/dist/esm/components/hooks/useDatePropControllerData.js ADDED Viewed

@@ -0,0 +1,12 @@
+import {
+  getDatePropControllerDataString
+} from "@makeswift/prop-controllers";
+function useDatePropControllerData(data) {
+  if (data == null)
+    return data;
+  return getDatePropControllerDataString(data);
+}
+export {
+  useDatePropControllerData
+};
+//# sourceMappingURL=useDatePropControllerData.js.map

package/dist/esm/components/hooks/useDatePropControllerData.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../../src/components/hooks/useDatePropControllerData.ts"],"sourcesContent":["import {\n DatePropControllerData,\n getDatePropControllerDataString,\n} from '@makeswift/prop-controllers'\n\nexport function useDatePropControllerData(\n data: DatePropControllerData | undefined,\n): string | undefined {\n if (data == null) return data\n\n return getDatePropControllerDataString(data)\n}\n"],"mappings":"AAAA;AAAA,EAEE;AAAA,OACK;AAEA,SAAS,0BACd,MACoB;AACpB,MAAI,QAAQ;AAAM,WAAO;AAEzB,SAAO,gCAAgC,IAAI;AAC7C;","names":[]}

package/dist/esm/components/hooks/useFontPropControllerData.js ADDED Viewed

@@ -0,0 +1,12 @@
+import {
+  getFontPropControllerDataResponsiveFontData
+} from "@makeswift/prop-controllers";
+function useFontPropControllerData(data) {
+  if (data == null)
+    return data;
+  return getFontPropControllerDataResponsiveFontData(data);
+}
+export {
+  useFontPropControllerData
+};
+//# sourceMappingURL=useFontPropControllerData.js.map

package/dist/esm/components/hooks/useFontPropControllerData.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["../../../../src/components/hooks/useFontPropControllerData.ts"],"sourcesContent":["import {\n FontPropControllerData,\n ResponsiveFontData,\n getFontPropControllerDataResponsiveFontData,\n} from '@makeswift/prop-controllers'\n\nexport function useFontPropControllerData(\n data: FontPropControllerData | undefined,\n): ResponsiveFontData | undefined {\n if (data == null) return data\n\n return getFontPropControllerDataResponsiveFontData(data)\n}\n"],"mappings":"AAAA;AAAA,EAGE;AAAA,OACK;AAEA,SAAS,0BACd,MACgC;AAChC,MAAI,QAAQ;AAAM,WAAO;AAEzB,SAAO,4CAA4C,IAAI;AACzD;","names":[]}

package/dist/esm/components/hooks/{usePropControllerLinkData.js → useLinkPropControllerData.js} RENAMED Viewed

@@ -1,12 +1,12 @@
 import {
   getLinkPropControllerValue
 } from "@makeswift/prop-controllers";
-function usePropControllerLinkData(data) {
+function useLinkPropControllerData(data) {
   if (data == null)
     return data;
   return getLinkPropControllerValue(data);
 }
 export {
-  usePropControllerLinkData
+  useLinkPropControllerData
 };
-//# sourceMappingURL=usePropControllerLinkData.js.map
+//# sourceMappingURL=useLinkPropControllerData.js.map

package/dist/esm/components/hooks/{usePropControllerLinkData.js.map → useLinkPropControllerData.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/hooks/~~usePropControllerLinkData~~.ts"],"sourcesContent":["import {\n LinkPropControllerData,\n LinkPropControllerValue,\n getLinkPropControllerValue,\n} from '@makeswift/prop-controllers'\n\nexport function ~~usePropControllerLinkData~~(\n data: LinkPropControllerData \| undefined \| null,\n): LinkPropControllerValue \| undefined \| null {\n if (data == null) return data\n\n return getLinkPropControllerValue(data)\n}\n"],"mappings":"AAAA;AAAA,EAGE;AAAA,OACK;AAEA,SAAS,0BACd,MAC4C;AAC5C,MAAI,QAAQ;AAAM,WAAO;AAEzB,SAAO,2BAA2B,IAAI;AACxC;","names":[]}
1	+ {"version":3,"sources":["../../../../src/components/hooks/useLinkPropControllerData.ts"],"sourcesContent":["import {\n LinkPropControllerData,\n LinkPropControllerValue,\n getLinkPropControllerValue,\n} from '@makeswift/prop-controllers'\n\nexport function useLinkPropControllerData(\n data: LinkPropControllerData \| undefined \| null,\n): LinkPropControllerValue \| undefined \| null {\n if (data == null) return data\n\n return getLinkPropControllerValue(data)\n}\n"],"mappings":"AAAA;AAAA,EAGE;AAAA,OACK;AAEA,SAAS,0BACd,MAC4C;AAC5C,MAAI,QAAQ;AAAM,WAAO;AAEzB,SAAO,2BAA2B,IAAI;AACxC;","names":[]}