npm - @makeswift/runtime - Versions diffs - 0.15.0 → 0.16.0-canary.1 - Mend

@makeswift/runtime 0.15.0 → 0.16.0-canary.1

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

package/dist/cjs/components/builtin/Navigation/components/MobileMenu/components/MobileDropDownButton/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../../../src/components/builtin/Navigation/components/MobileMenu/components/MobileDropDownButton/index.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, useState } from 'react'\n\nimport {~~\n ResponsiveColorValue,\n~~ TextStyleValue~~,\n LinkValue,\n~~} from '../../../../../../../prop-controllers/descriptors'\nimport { colorToString } from '../../../../../../utils/colorToString'\nimport { useResponsiveColor } from '../../../../../../hooks'\n\nimport { CaretDown8 } from '../../../../../../icons/CaretDown8'\nimport { Plus8 } from '../../../../../../icons/Plus8'\nimport { ArrowDown8 } from '../../../../../../icons/ArrowDown8'\nimport { ChevronDown8 } from '../../../../../../icons/ChevronDown8'\n\nimport { Link } from '../../../../../../shared/Link'\nimport Button from '../../../../../Button'\nimport { cx } from '@emotion/css'\nimport { useStyle } from '../../../../../../../runtimes/react/use-style'\nimport {\n useResponsiveStyle,\n useResponsiveTextStyle,\n} from '../../../../../../utils/responsive-style'\n\ntype DropDownMenuBaseProps = {\n className?: string\n open: boolean\n}\n\ntype DropDownMenuProps = DropDownMenuBaseProps &\n Omit<ComponentPropsWithoutRef<'div'>, keyof DropDownMenuBaseProps>\n\nfunction DropDownMenu({ className, open, ...restOfProps }: DropDownMenuProps) {\n return (\n <div\n {...restOfProps}\n className={cx(\n useStyle({ display: open ? 'flex' : 'none', flexDirection: 'column', padding: 8 }),\n className,\n )}\n />\n )\n}\n\ntype ButtonLinkBaseProps = {\n className?: string\n}\n\ntype ButtonLinkProps = ButtonLinkBaseProps &\n Omit<ComponentPropsWithoutRef<typeof Button>, keyof ButtonLinkBaseProps>\n\nfunction ButtonLink({ className, ...restOfProps }: ButtonLinkProps) {\n return <Button {...restOfProps} className={cx(useStyle({ margin: '8px 0' }), className)} />\n}\n\ntype BaseDropDownItemProps = {\n className?: string\n color?: ~~ResponsiveColorValue~~\n textStyle?: TextStyleValue\n}\n\ntype DropDownItemProps = BaseDropDownItemProps &\n Omit<ComponentPropsWithoutRef<typeof Link>, keyof BaseDropDownItemProps>\n\nfunction DropDownItem({ color, className, textStyle, ...restOfProps }: DropDownItemProps) {\n const colorData = useResponsiveColor(color)\n\n return (\n <Link\n {...restOfProps}\n className={cx(\n useStyle({\n textDecoration: 'none',\n lineHeight: 1.4,\n padding: '8px 16px',\n color: 'black',\n }),\n useStyle(useResponsiveTextStyle(textStyle)),\n useStyle(\n useResponsiveStyle([colorData] as const, ([color]) => ({\n color: color == null ? 'black' : colorToString(color),\n })),\n ),\n className,\n )}\n />\n )\n}\n\ntype Props = Omit<ComponentPropsWithoutRef<typeof Button>, 'textColor' \| 'color'> & {\n label: string\n links?: Array<{\n id: string\n payload: ComponentPropsWithoutRef<typeof DropDownItem> & {\n link?: ~~LinkValue~~\n label: string\n }\n }>\n onClose?: () => unknown\n caret?: string\n textColor?: ~~ResponsiveColorValue~~\n color?: ~~ResponsiveColorValue~~\n}\n\nexport default function MobileDropDownButton({\n label,\n caret,\n links = [],\n onClose = () => {},\n color,\n textColor,\n ...restOfProps\n}: Props): JSX.Element {\n const [isOpen, setIsOpen] = useState(false)\n return (\n <>\n <ButtonLink\n {...restOfProps}\n textColor={useResponsiveColor(textColor)}\n color={useResponsiveColor(color)}\n onPointerDown={() => setIsOpen(prev => !prev)}\n >\n <div style={{ display: 'flex', alignItems: 'center' }}>\n <span style={{ marginRight: 6 }}>{label}</span>\n <span style={{ display: 'inline-flex', fill: 'currentColor' }}>\n <>\n {caret === 'caret' && <CaretDown8 />}\n {caret === 'plus' && <Plus8 />}\n {caret === 'arrow-down' && <ArrowDown8 />}\n {caret === 'chevron-down' && <ChevronDown8 />}\n </>\n </span>\n </div>\n </ButtonLink>\n <DropDownMenu open={isOpen}>\n {links.map(({ id, payload }) => (\n <DropDownItem {...payload} key={id} onClick={onClose}>\n {payload.label}\n </DropDownItem>\n ))}\n </DropDownMenu>\n </>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;~~AAkCI~~;AAsGM;~~AAxIV~~,IAAAA,gBAAmD;~~AAOnD~~,2BAA8B;AAC9B,mBAAmC;AAEnC,wBAA2B;AAC3B,mBAAsB;AACtB,wBAA2B;AAC3B,0BAA6B;AAE7B,kBAAqB;AACrB,oBAAmB;AACnB,iBAAmB;AACnB,uBAAyB;AACzB,8BAGO;AAUP,SAAS,aAAa,EAAE,WAAW,MAAM,GAAG,YAAY,GAAsB;AAC5E,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,eAAW;AAAA,YACT,2BAAS,EAAE,SAAS,OAAO,SAAS,QAAQ,eAAe,UAAU,SAAS,EAAE,CAAC;AAAA,QACjF;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AASA,SAAS,WAAW,EAAE,WAAW,GAAG,YAAY,GAAoB;AAClE,SAAO,4CAAC,cAAAC,SAAA,EAAQ,GAAG,aAAa,eAAW,mBAAG,2BAAS,EAAE,QAAQ,QAAQ,CAAC,GAAG,SAAS,GAAG;AAC3F;AAWA,SAAS,aAAa,EAAE,OAAO,WAAW,WAAW,GAAG,YAAY,GAAsB;AACxF,QAAM,gBAAY,iCAAmB,KAAK;AAE1C,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,eAAW;AAAA,YACT,2BAAS;AAAA,UACP,gBAAgB;AAAA,UAChB,YAAY;AAAA,UACZ,SAAS;AAAA,UACT,OAAO;AAAA,QACT,CAAC;AAAA,YACD,+BAAS,gDAAuB,SAAS,CAAC;AAAA,YAC1C;AAAA,cACE,4CAAmB,CAAC,SAAS,GAAY,CAAC,CAACC,MAAK,OAAO;AAAA,YACrD,OAAOA,UAAS,OAAO,cAAU,oCAAcA,MAAK;AAAA,UACtD,EAAE;AAAA,QACJ;AAAA,QACA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAiBe,SAAR,qBAAsC;AAAA,EAC3C;AAAA,EACA;AAAA,EACA,QAAQ,CAAC;AAAA,EACT,UAAU,MAAM;AAAA,EAAC;AAAA,EACjB;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAuB;AACrB,QAAM,CAAC,QAAQ,SAAS,QAAI,wBAAS,KAAK;AAC1C,SACE,4EACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,eAAW,iCAAmB,SAAS;AAAA,QACvC,WAAO,iCAAmB,KAAK;AAAA,QAC/B,eAAe,MAAM,UAAU,UAAQ,CAAC,IAAI;AAAA,QAE5C,uDAAC,SAAI,OAAO,EAAE,SAAS,QAAQ,YAAY,SAAS,GAClD;AAAA,sDAAC,UAAK,OAAO,EAAE,aAAa,EAAE,GAAI,iBAAM;AAAA,UACxC,4CAAC,UAAK,OAAO,EAAE,SAAS,eAAe,MAAM,eAAe,GAC1D,sFACG;AAAA,sBAAU,WAAW,4CAAC,gCAAW;AAAA,YACjC,UAAU,UAAU,4CAAC,sBAAM;AAAA,YAC3B,UAAU,gBAAgB,4CAAC,gCAAW;AAAA,YACtC,UAAU,kBAAkB,4CAAC,oCAAa;AAAA,aAC7C,GACF;AAAA,WACF;AAAA;AAAA,IACF;AAAA,IACA,4CAAC,gBAAa,MAAM,QACjB,gBAAM,IAAI,CAAC,EAAE,IAAI,QAAQ,MACxB,gDAAC,gBAAc,GAAG,SAAS,KAAK,IAAI,SAAS,WAC1C,QAAQ,KACX,CACD,GACH;AAAA,KACF;AAEJ;","names":["import_react","Button","color"]}
1	+ {"version":3,"sources":["../../../../../../../../../src/components/builtin/Navigation/components/MobileMenu/components/MobileDropDownButton/index.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, useState } from 'react'\n\nimport { TextStyleValue } from '../../../../../../../prop-controllers/descriptors'\nimport { LinkData, ResponsiveColorData } from '@makeswift/prop-controllers'\n\nimport { colorToString } from '../../../../../../utils/colorToString'\nimport { useResponsiveColor } from '../../../../../../hooks'\n\nimport { CaretDown8 } from '../../../../../../icons/CaretDown8'\nimport { Plus8 } from '../../../../../../icons/Plus8'\nimport { ArrowDown8 } from '../../../../../../icons/ArrowDown8'\nimport { ChevronDown8 } from '../../../../../../icons/ChevronDown8'\n\nimport { Link } from '../../../../../../shared/Link'\nimport Button from '../../../../../Button'\nimport { cx } from '@emotion/css'\nimport { useStyle } from '../../../../../../../runtimes/react/use-style'\nimport {\n useResponsiveStyle,\n useResponsiveTextStyle,\n} from '../../../../../../utils/responsive-style'\n\ntype DropDownMenuBaseProps = {\n className?: string\n open: boolean\n}\n\ntype DropDownMenuProps = DropDownMenuBaseProps &\n Omit<ComponentPropsWithoutRef<'div'>, keyof DropDownMenuBaseProps>\n\nfunction DropDownMenu({ className, open, ...restOfProps }: DropDownMenuProps) {\n return (\n <div\n {...restOfProps}\n className={cx(\n useStyle({ display: open ? 'flex' : 'none', flexDirection: 'column', padding: 8 }),\n className,\n )}\n />\n )\n}\n\ntype ButtonLinkBaseProps = {\n className?: string\n}\n\ntype ButtonLinkProps = ButtonLinkBaseProps &\n Omit<ComponentPropsWithoutRef<typeof Button>, keyof ButtonLinkBaseProps>\n\nfunction ButtonLink({ className, ...restOfProps }: ButtonLinkProps) {\n return <Button {...restOfProps} className={cx(useStyle({ margin: '8px 0' }), className)} />\n}\n\ntype BaseDropDownItemProps = {\n className?: string\n color?: ResponsiveColorData\n textStyle?: TextStyleValue\n}\n\ntype DropDownItemProps = BaseDropDownItemProps &\n Omit<ComponentPropsWithoutRef<typeof Link>, keyof BaseDropDownItemProps>\n\nfunction DropDownItem({ color, className, textStyle, ...restOfProps }: DropDownItemProps) {\n const colorData = useResponsiveColor(color)\n\n return (\n <Link\n {...restOfProps}\n className={cx(\n useStyle({\n textDecoration: 'none',\n lineHeight: 1.4,\n padding: '8px 16px',\n color: 'black',\n }),\n useStyle(useResponsiveTextStyle(textStyle)),\n useStyle(\n useResponsiveStyle([colorData] as const, ([color]) => ({\n color: color == null ? 'black' : colorToString(color),\n })),\n ),\n className,\n )}\n />\n )\n}\n\ntype Props = Omit<ComponentPropsWithoutRef<typeof Button>, 'textColor' \| 'color'> & {\n label: string\n links?: Array<{\n id: string\n payload: ComponentPropsWithoutRef<typeof DropDownItem> & {\n link?: LinkData\n label: string\n }\n }>\n onClose?: () => unknown\n caret?: string\n textColor?: ResponsiveColorData\n color?: ResponsiveColorData\n}\n\nexport default function MobileDropDownButton({\n label,\n caret,\n links = [],\n onClose = () => {},\n color,\n textColor,\n ...restOfProps\n}: Props): JSX.Element {\n const [isOpen, setIsOpen] = useState(false)\n return (\n <>\n <ButtonLink\n {...restOfProps}\n textColor={useResponsiveColor(textColor)}\n color={useResponsiveColor(color)}\n onPointerDown={() => setIsOpen(prev => !prev)}\n >\n <div style={{ display: 'flex', alignItems: 'center' }}>\n <span style={{ marginRight: 6 }}>{label}</span>\n <span style={{ display: 'inline-flex', fill: 'currentColor' }}>\n <>\n {caret === 'caret' && <CaretDown8 />}\n {caret === 'plus' && <Plus8 />}\n {caret === 'arrow-down' && <ArrowDown8 />}\n {caret === 'chevron-down' && <ChevronDown8 />}\n </>\n </span>\n </div>\n </ButtonLink>\n <DropDownMenu open={isOpen}>\n {links.map(({ id, payload }) => (\n <DropDownItem {...payload} key={id} onClick={onClose}>\n {payload.label}\n </DropDownItem>\n ))}\n </DropDownMenu>\n </>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgCI;AAsGM;AAtIV,IAAAA,gBAAmD;AAKnD,2BAA8B;AAC9B,mBAAmC;AAEnC,wBAA2B;AAC3B,mBAAsB;AACtB,wBAA2B;AAC3B,0BAA6B;AAE7B,kBAAqB;AACrB,oBAAmB;AACnB,iBAAmB;AACnB,uBAAyB;AACzB,8BAGO;AAUP,SAAS,aAAa,EAAE,WAAW,MAAM,GAAG,YAAY,GAAsB;AAC5E,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,eAAW;AAAA,YACT,2BAAS,EAAE,SAAS,OAAO,SAAS,QAAQ,eAAe,UAAU,SAAS,EAAE,CAAC;AAAA,QACjF;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AASA,SAAS,WAAW,EAAE,WAAW,GAAG,YAAY,GAAoB;AAClE,SAAO,4CAAC,cAAAC,SAAA,EAAQ,GAAG,aAAa,eAAW,mBAAG,2BAAS,EAAE,QAAQ,QAAQ,CAAC,GAAG,SAAS,GAAG;AAC3F;AAWA,SAAS,aAAa,EAAE,OAAO,WAAW,WAAW,GAAG,YAAY,GAAsB;AACxF,QAAM,gBAAY,iCAAmB,KAAK;AAE1C,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,eAAW;AAAA,YACT,2BAAS;AAAA,UACP,gBAAgB;AAAA,UAChB,YAAY;AAAA,UACZ,SAAS;AAAA,UACT,OAAO;AAAA,QACT,CAAC;AAAA,YACD,+BAAS,gDAAuB,SAAS,CAAC;AAAA,YAC1C;AAAA,cACE,4CAAmB,CAAC,SAAS,GAAY,CAAC,CAACC,MAAK,OAAO;AAAA,YACrD,OAAOA,UAAS,OAAO,cAAU,oCAAcA,MAAK;AAAA,UACtD,EAAE;AAAA,QACJ;AAAA,QACA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAiBe,SAAR,qBAAsC;AAAA,EAC3C;AAAA,EACA;AAAA,EACA,QAAQ,CAAC;AAAA,EACT,UAAU,MAAM;AAAA,EAAC;AAAA,EACjB;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAuB;AACrB,QAAM,CAAC,QAAQ,SAAS,QAAI,wBAAS,KAAK;AAC1C,SACE,4EACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,eAAW,iCAAmB,SAAS;AAAA,QACvC,WAAO,iCAAmB,KAAK;AAAA,QAC/B,eAAe,MAAM,UAAU,UAAQ,CAAC,IAAI;AAAA,QAE5C,uDAAC,SAAI,OAAO,EAAE,SAAS,QAAQ,YAAY,SAAS,GAClD;AAAA,sDAAC,UAAK,OAAO,EAAE,aAAa,EAAE,GAAI,iBAAM;AAAA,UACxC,4CAAC,UAAK,OAAO,EAAE,SAAS,eAAe,MAAM,eAAe,GAC1D,sFACG;AAAA,sBAAU,WAAW,4CAAC,gCAAW;AAAA,YACjC,UAAU,UAAU,4CAAC,sBAAM;AAAA,YAC3B,UAAU,gBAAgB,4CAAC,gCAAW;AAAA,YACtC,UAAU,kBAAkB,4CAAC,oCAAa;AAAA,aAC7C,GACF;AAAA,WACF;AAAA;AAAA,IACF;AAAA,IACA,4CAAC,gBAAa,MAAM,QACjB,gBAAM,IAAI,CAAC,EAAE,IAAI,QAAQ,MACxB,gDAAC,gBAAc,GAAG,SAAS,KAAK,IAAI,SAAS,WAC1C,QAAQ,KACX,CACD,GACH;AAAA,KACF;AAEJ;","names":["import_react","Button","color"]}

package/dist/cjs/components/builtin/Navigation/components/MobileMenu/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../../../src/components/builtin/Navigation/components/MobileMenu/index.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, Fragment } from 'react'\n\nimport {\n ~~ResponsiveValue,\n~~ NavigationLinksValue,\n NavigationButton as NavigationButtonValue,\n} from '../../../../../prop-controllers/descriptors'\nimport { ColorValue as Color } from '../../../../utils/types'\nimport { colorToString } from '../../../../utils/colorToString'\nimport { Times16 } from '../../../../icons/Times16'\n\nimport Button from '../../../Button'\nimport DropDownButton from './components/MobileDropDownButton'\nimport { ResponsiveColor } from '../../../../../runtimes/react/controls'\nimport { useResponsiveColor } from '../../../../hooks'\nimport { cx } from '@emotion/css'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\nimport { useResponsiveStyle } from '../../../../utils/responsive-style'\n\ntype NavigationButtonProps = NavigationButtonValue['payload'] &\n Omit<ComponentPropsWithoutRef<typeof Button>, 'color' \| 'textColor'>\n\nfunction ButtonLink({\n className,\n textColor,\n color,\n ...restOfProps\n}: NavigationButtonProps): JSX.Element {\n return (\n <Button\n {...restOfProps}\n className={cx(useStyle({ margin: '8px 0' }), className)}\n textColor={useResponsiveColor(textColor)}\n color={useResponsiveColor(color)}\n />\n )\n}\n\ntype ContainerBaseProps = {\n className?: string\n animation?: ResponsiveValue<'coverRight' \| 'coverLeft'>\n backgroundColor?: ResponsiveValue<Color> \| null\n open: boolean\n}\n\ntype ContainerProps = ContainerBaseProps &\n Omit<ComponentPropsWithoutRef<'div'>, keyof ContainerBaseProps>\n\nfunction Container({\n className,\n animation,\n backgroundColor,\n open,\n ...restOfProps\n}: ContainerProps) {\n return (\n <div\n {...restOfProps}\n className={cx(\n useStyle({\n position: 'fixed',\n flexDirection: 'column',\n width: '100%',\n padding: '40px 15px',\n transition: 'transform 300ms ease-in-out',\n overflowY: 'auto',\n zIndex: 9999,\n maxWidth: 575,\n }),\n useStyle(\n useResponsiveStyle(\n [animation, backgroundColor] as const,\n ([animation, backgroundColor]) => {\n if (animation == null) return { display: 'none' }\n\n return {\n display: 'flex',\n backgroundColor: backgroundColor == null ? 'black' : colorToString(backgroundColor),\n transform: open\n ? `translate3d(0,0,0)`\n : `translate3d(${{ coverRight: '', coverLeft: '-' }[animation]}100%, 0, 0)`,\n ...{\n coverRight: { top: 0, bottom: 0, right: 0 },\n coverLeft: { top: 0, bottom: 0, left: 0 },\n }[animation],\n }\n },\n ),\n ),\n className,\n )}\n />\n )\n}\n\ntype CloseIconContainerBaseProps = {\n className?: string\n color?: ResponsiveColor \| null\n}\n\ntype CloseIconContainerProps = CloseIconContainerBaseProps &\n Omit<ComponentPropsWithoutRef<'button'>, keyof CloseIconContainerBaseProps>\n\nfunction CloseIconContainer({ className, color, ...restOfProps }: CloseIconContainerProps) {\n return (\n <button\n {...restOfProps}\n className={cx(\n useStyle({\n position: 'absolute',\n top: 15,\n right: 15,\n padding: 0,\n border: 0,\n outline: 0,\n background: 'none',\n fill: 'currentcolor',\n }),\n useStyle(\n useResponsiveStyle([color] as const, ([color]) => ({\n color: color == null ? 'rgba(161, 168, 194, 0.5)' : colorToString(color),\n })),\n ),\n className,\n )}\n />\n )\n}\n\ntype Props = {\n animation?: ResponsiveValue<'coverRight' \| 'coverLeft'>\n backgroundColor?: ResponsiveColor \| null\n closeIconColor?: ResponsiveColor \| null\n links?: NavigationLinksValue\n onClose?: () => unknown\n open?: boolean\n}\n\nexport default function MobileMenu({\n animation,\n backgroundColor,\n open = false,\n closeIconColor,\n links = [],\n onClose = () => {},\n}: Props): JSX.Element {\n return (\n <Container animation={animation} backgroundColor={backgroundColor} open={open}>\n <CloseIconContainer color={closeIconColor} onClick={onClose}>\n <Times16 />\n </CloseIconContainer>\n <div\n style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', flexShrink: 0 }}\n >\n {links.map(link => (\n <Fragment key={link.id}>\n {link.type === 'button' && (\n <ButtonLink {...link.payload} onClick={onClose}>\n {link.payload.label}\n </ButtonLink>\n )}\n {link.type === 'dropdown' && <DropDownButton {...link.payload} onClose={onClose} />}\n </Fragment>\n ))}\n </div>\n </Container>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA6BI;AA7BJ,mBAAmD;~~AAQnD~~,2BAA8B;AAC9B,qBAAwB;AAExB,oBAAmB;AACnB,kCAA2B;AAE3B,mBAAmC;AACnC,iBAAmB;AACnB,uBAAyB;AACzB,8BAAmC;~~AAKnC~~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","names":["Button","animation","backgroundColor","color","DropDownButton"]}
1	+ {"version":3,"sources":["../../../../../../../src/components/builtin/Navigation/components/MobileMenu/index.tsx"],"sourcesContent":["import { ComponentPropsWithoutRef, Fragment } from 'react'\n\nimport {\n NavigationLinksValue,\n NavigationButton as NavigationButtonValue,\n} from '../../../../../prop-controllers/descriptors'\nimport { ColorValue as Color } from '../../../../utils/types'\nimport { colorToString } from '../../../../utils/colorToString'\nimport { Times16 } from '../../../../icons/Times16'\n\nimport Button from '../../../Button'\nimport DropDownButton from './components/MobileDropDownButton'\nimport { ResponsiveColor } from '../../../../../runtimes/react/controls'\nimport { useResponsiveColor } from '../../../../hooks'\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 NavigationButtonProps = NavigationButtonValue['payload'] &\n Omit<ComponentPropsWithoutRef<typeof Button>, 'color' \| 'textColor'>\n\nfunction ButtonLink({\n className,\n textColor,\n color,\n ...restOfProps\n}: NavigationButtonProps): JSX.Element {\n return (\n <Button\n {...restOfProps}\n className={cx(useStyle({ margin: '8px 0' }), className)}\n textColor={useResponsiveColor(textColor)}\n color={useResponsiveColor(color)}\n />\n )\n}\n\ntype ContainerBaseProps = {\n className?: string\n animation?: ResponsiveValue<'coverRight' \| 'coverLeft'>\n backgroundColor?: ResponsiveValue<Color> \| null\n open: boolean\n}\n\ntype ContainerProps = ContainerBaseProps &\n Omit<ComponentPropsWithoutRef<'div'>, keyof ContainerBaseProps>\n\nfunction Container({\n className,\n animation,\n backgroundColor,\n open,\n ...restOfProps\n}: ContainerProps) {\n return (\n <div\n {...restOfProps}\n className={cx(\n useStyle({\n position: 'fixed',\n flexDirection: 'column',\n width: '100%',\n padding: '40px 15px',\n transition: 'transform 300ms ease-in-out',\n overflowY: 'auto',\n zIndex: 9999,\n maxWidth: 575,\n }),\n useStyle(\n useResponsiveStyle(\n [animation, backgroundColor] as const,\n ([animation, backgroundColor]) => {\n if (animation == null) return { display: 'none' }\n\n return {\n display: 'flex',\n backgroundColor: backgroundColor == null ? 'black' : colorToString(backgroundColor),\n transform: open\n ? `translate3d(0,0,0)`\n : `translate3d(${{ coverRight: '', coverLeft: '-' }[animation]}100%, 0, 0)`,\n ...{\n coverRight: { top: 0, bottom: 0, right: 0 },\n coverLeft: { top: 0, bottom: 0, left: 0 },\n }[animation],\n }\n },\n ),\n ),\n className,\n )}\n />\n )\n}\n\ntype CloseIconContainerBaseProps = {\n className?: string\n color?: ResponsiveColor \| null\n}\n\ntype CloseIconContainerProps = CloseIconContainerBaseProps &\n Omit<ComponentPropsWithoutRef<'button'>, keyof CloseIconContainerBaseProps>\n\nfunction CloseIconContainer({ className, color, ...restOfProps }: CloseIconContainerProps) {\n return (\n <button\n {...restOfProps}\n className={cx(\n useStyle({\n position: 'absolute',\n top: 15,\n right: 15,\n padding: 0,\n border: 0,\n outline: 0,\n background: 'none',\n fill: 'currentcolor',\n }),\n useStyle(\n useResponsiveStyle([color] as const, ([color]) => ({\n color: color == null ? 'rgba(161, 168, 194, 0.5)' : colorToString(color),\n })),\n ),\n className,\n )}\n />\n )\n}\n\ntype Props = {\n animation?: ResponsiveValue<'coverRight' \| 'coverLeft'>\n backgroundColor?: ResponsiveColor \| null\n closeIconColor?: ResponsiveColor \| null\n links?: NavigationLinksValue\n onClose?: () => unknown\n open?: boolean\n}\n\nexport default function MobileMenu({\n animation,\n backgroundColor,\n open = false,\n closeIconColor,\n links = [],\n onClose = () => {},\n}: Props): JSX.Element {\n return (\n <Container animation={animation} backgroundColor={backgroundColor} open={open}>\n <CloseIconContainer color={closeIconColor} onClick={onClose}>\n <Times16 />\n </CloseIconContainer>\n <div\n style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', flexShrink: 0 }}\n >\n {links.map(link => (\n <Fragment key={link.id}>\n {link.type === 'button' && (\n <ButtonLink {...link.payload} onClick={onClose}>\n {link.payload.label}\n </ButtonLink>\n )}\n {link.type === 'dropdown' && <DropDownButton {...link.payload} onClose={onClose} />}\n </Fragment>\n ))}\n </div>\n </Container>\n )\n}\n"],"mappings":"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","names":["Button","animation","backgroundColor","color","DropDownButton"]}

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

@@ -36,6 +36,7 @@ var import_breakpoints = require("../../../state/modules/breakpoints");
 var import_constants = require("../constants");
 var import_components_meta = require("../../../state/modules/components-meta");
 var import_react2 = require("react");
+var import_prop_controllers2 = require("@makeswift/prop-controllers");
 function registerComponent(runtime) {
   return runtime.registerComponent(
     (0, import_react2.lazy)(() => Promise.resolve().then(() => __toESM(require("./Navigation")))),
@@ -53,32 +54,47 @@ function registerComponent(runtime) {
             hidden: links == null || links.length === 0
           };
         }),
-        showLogo: import_prop_controllers.Props.Checkbox({ preset: true, label: "Show logo" }),
+        showLogo: (0, import_prop_controllers2.Checkbox)({ preset: true, label: "Show logo" }),
         logoFile: import_prop_controllers.Props.Image((props) => ({
           label: "Logo",
-          hidden: props.showLogo === false
+          hidden: (0, import_prop_controllers2.getCheckboxPropControllerDataBoolean)(
+            import_prop_controllers2.checkboxPropControllerDataSchema.optional().catch(void 0).parse(props.showLogo)
+          ) === false
         })),
-        logoWidth: import_prop_controllers.Props.ResponsiveLength((props) => ({
-          preset: [
-            {
-              deviceId: (0, import_breakpoints.getBaseBreakpoint)(runtime.getBreakpoints()).id,
-              value: { value: 100, unit: "px" }
-            }
-          ],
+        logoWidth: (0, import_prop_controllers2.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: {
+            [import_prop_controllers2.ControlDataTypeKey]: import_prop_controllers2.ResponsiveLengthPropControllerDataV1Type,
+            value: [
+              {
+                deviceId: (0, import_breakpoints.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: (0, import_prop_controllers2.getCheckboxPropControllerDataBoolean)(
+            import_prop_controllers2.checkboxPropControllerDataSchema.optional().catch(void 0).parse(props.showLogo)
+          ) === false
         })),
         logoAltText: import_prop_controllers.Props.TextInput((props) => ({
           label: "Logo alt text",
-          hidden: props.showLogo === false
+          hidden: (0, import_prop_controllers2.getCheckboxPropControllerDataBoolean)(
+            import_prop_controllers2.checkboxPropControllerDataSchema.optional().catch(void 0).parse(props.showLogo)
+          ) === false
         })),
-        logoLink: import_prop_controllers.Props.Link((props) => ({
+        logoLink: (0, import_prop_controllers2.Link)((props) => ({
           label: "Logo on click",
-          hidden: props.showLogo === false
+          hidden: (0, import_prop_controllers2.getCheckboxPropControllerDataBoolean)(
+            import_prop_controllers2.checkboxPropControllerDataSchema.optional().catch(void 0).parse(props.showLogo)
+          ) === false
         })),
         alignment: import_prop_controllers.Props.ResponsiveIconRadioGroup({
           label: "Alignment",
@@ -109,7 +125,7 @@ function registerComponent(runtime) {
             { value: "coverLeft", label: "Cover from left" }
           ]
         }),
-        mobileMenuOpenIconColor: import_prop_controllers.Props.ResponsiveColor((props, device) => {
+        mobileMenuOpenIconColor: (0, import_prop_controllers2.ResponsiveColor)((props, device) => {
           const mobileMenuAnimation = props.mobileMenuAnimation;
           const hidden = !(0, import_breakpoints.findBreakpointOverride)(
             runtime.getBreakpoints(),
@@ -122,7 +138,7 @@ function registerComponent(runtime) {
             hidden
           };
         }),
-        mobileMenuCloseIconColor: import_prop_controllers.Props.ResponsiveColor((props, device) => {
+        mobileMenuCloseIconColor: (0, import_prop_controllers2.ResponsiveColor)((props, device) => {
           const mobileMenuAnimation = props.mobileMenuAnimation;
           const hidden = !(0, import_breakpoints.findBreakpointOverride)(
             runtime.getBreakpoints(),
@@ -135,7 +151,7 @@ function registerComponent(runtime) {
             hidden
           };
         }),
-        mobileMenuBackgroundColor: import_prop_controllers.Props.ResponsiveColor((props, device) => {
+        mobileMenuBackgroundColor: (0, import_prop_controllers2.ResponsiveColor)((props, device) => {
           const mobileMenuAnimation = props.mobileMenuAnimation;
           const hidden = !(0, import_breakpoints.findBreakpointOverride)(
             runtime.getBreakpoints(),

package/dist/cjs/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'\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: ~~Props.~~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;AAAA;AAAA;AAAA;AAAA;AAAA,8BAAsB;AAGtB,yBAA0D;AAC1D,uBAAuC;AACvC,6BAA8B;AAC9B,IAAAA,gBAAqB;~~AAEd~~,SAAS,kBAAkB,SAAuB;AACvD,SAAO,QAAQ;AAAA,QACb,oBAAK,MAAM,6CAAO,cAAc,GAAC;AAAA,IACjC;AAAA,MACE,MAAM,wCAAuB;AAAA,MAC7B,OAAO;AAAA,MACP,MAAM,qCAAc;AAAA,MACpB,OAAO;AAAA,QACL,IAAI,8BAAM,UAAU;AAAA,QACpB,OAAO,8BAAM,gBAAgB;AAAA,QAC7B,eAAe,8BAAM,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~~,~~8BAAM~~,~~SAAS,~~EAAE,QAAQ,MAAM,OAAO,YAAY,CAAC;AAAA,~~QAC7D~~,UAAU,8BAAM,MAAM,YAAU;AAAA,UAC9B,OAAO;AAAA,UACP,~~QAAQ~~,MAAM,~~aAAa~~;AAAA,~~QAC7B~~,EAAE;AAAA,QACF,~~WAAW~~,~~8BAAM~~,~~iBAAiB,~~YAAU;AAAA,~~UAC1C~~,QAAQ;AAAA,YACN;AAAA,~~cACE~~,cAAU,sCAAkB,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,8BAAM,UAAU,YAAU;AAAA,UACrC,OAAO;AAAA,UACP,~~QAAQ~~,MAAM,~~aAAa~~;AAAA,~~QAC7B~~,EAAE;AAAA,QACF,~~UAAU~~,~~8BAAM,KAAK,~~YAAU;AAAA,~~UAC7B~~,OAAO;AAAA,UACP,~~QAAQ~~,MAAM,~~aAAa~~;AAAA,~~QAC7B~~,EAAE;AAAA,QACF,WAAW,8BAAM,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,8BAAM,KAAK;AAAA,UACjB,QAAQ;AAAA,YACN;AAAA,cACE,cAAU,sCAAkB,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,8BAAM,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~~,~~8BAAM~~,~~gBAAgB,~~CAAC,OAAO,WAAW;~~AAChE~~,gBAAM,sBAAsB,MAAM;AAClC,gBAAM,SAAS,KAAC;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~~,~~8BAAM~~,~~gBAAgB,~~CAAC,OAAO,WAAW;~~AACjE~~,gBAAM,sBAAsB,MAAM;AAClC,gBAAM,SAAS,KAAC;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~~,~~8BAAM,gBAAgB,~~CAAC,OAAO,WAAW;~~AAClE~~,gBAAM,sBAAsB,MAAM;AAClC,gBAAM,SAAS,KAAC;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,8BAAM,MAAM;AAAA,UACjB,QAAQ,8BAAM,MAAM,OAAO;AAAA,UAC3B,cAAc,EAAE,OAAO,KAAK,MAAM,IAAI;AAAA,QACxC,CAAC;AAAA,QACD,QAAQ,8BAAM,OAAO,EAAE,QAAQ,8BAAM,OAAO,OAAO,UAAU,CAAC;AAAA,MAChE;AAAA,IACF;AAAA,EACF;AACF;","names":["import_react"]}
1	+ {"version":3,"sources":["../../../../../src/components/builtin/Navigation/register.ts"],"sourcesContent":["import { Props } from '../../../prop-controllers'\nimport { NavigationLinksValue } 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 ResponsiveValue,\n checkboxPropControllerDataSchema,\n getCheckboxPropControllerDataBoolean,\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\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 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: 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: 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":"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","names":["import_react","import_prop_controllers"]}

package/dist/cjs/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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAiFc;AAjFd,mBAA0D;AAE1D,kBAAqB;AACrB,2BAA8B;AAE9B,qBAA0D;AAC1D,6BAA4B;AAC5B,oCAAmC;~~AASnC~~,iBAAmB;AACnB,uBAAyB;AACzB,8BAAmC;~~AAmBnC~~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","names":["SocialLinks","alignment","GutterContainer","SocialLinksPlaceholder","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","GutterContainer","SocialLinksPlaceholder","shape","size","hoverStyle","fill","backgroundColor"]}

package/dist/cjs/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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAWI;AAVJ,uBAAyB;AAEzB,6BAA4B;AAE5B,MAAM,QAAQ,CAAC,EAAE,IAAI,IAAI,GAAG,EAAE,IAAI,IAAI,GAAG,EAAE,IAAI,IAAI,CAAC;AAIrC,SAAR,uBAAwC,EAAE,OAAO,GAAuB;AAC7E,SACE,2EACG,gBAAM,IAAI,CAAC,MAAM,MAChB;AAAA,IAAC,uBAAAA;AAAA,IAAA;AAAA,MAEC;AAAA,MACA,OAAO,MAAM;AAAA,MACb,MAAM,MAAM,MAAM,SAAS;AAAA,MAE3B,sDAAC,mBAAgB;AAAA;AAAA,IALZ,KAAK;AAAA,EAMZ,CACD,GACH;AAEJ;AAEA,SAAS,kBAAkB;AACzB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW,2BAAS;AAAA,QAClB,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,cAAc;AAAA,QACd,iBAAiB;AAAA,MACnB,CAAC;AAAA;AAAA,EACH;AAEJ;","names":["GutterContainer"]}
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":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAWI;AAVJ,uBAAyB;AAEzB,6BAA4B;AAE5B,MAAM,QAAQ,CAAC,EAAE,IAAI,IAAI,GAAG,EAAE,IAAI,IAAI,GAAG,EAAE,IAAI,IAAI,CAAC;AAIrC,SAAR,uBAAwC,EAAE,OAAO,GAAuB;AAC7E,SACE,2EACG,gBAAM,IAAI,CAAC,MAAM,MAChB;AAAA,IAAC,uBAAAA;AAAA,IAAA;AAAA,MAEC;AAAA,MACA,OAAO,MAAM;AAAA,MACb,MAAM,MAAM,MAAM,SAAS;AAAA,MAE3B,sDAAC,mBAAgB;AAAA;AAAA,IALZ,KAAK;AAAA,EAMZ,CACD,GACH;AAEJ;AAEA,SAAS,kBAAkB;AACzB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW,2BAAS;AAAA,QAClB,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,cAAc;AAAA,QACd,iBAAiB;AAAA,MACnB,CAAC;AAAA;AAAA,EACH;AAEJ;","names":["GutterContainer"]}

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

@@ -36,6 +36,7 @@ var import_breakpoints = require("../../../state/modules/breakpoints");
 var import_constants = require("../constants");
 var import_components_meta = require("../../../state/modules/components-meta");
 var import_react2 = require("react");
+var import_prop_controllers2 = require("@makeswift/prop-controllers");
 function registerComponent(runtime) {
   return runtime.registerComponent(
     (0, import_react2.lazy)(() => Promise.resolve().then(() => __toESM(require("./SocialLinks")))),
@@ -107,7 +108,7 @@ function registerComponent(runtime) {
             hidden
           };
         }),
-        fill: import_prop_controllers.Props.ResponsiveColor((props) => {
+        fill: (0, import_prop_controllers2.ResponsiveColor)((props) => {
           const links = props.links;
           const hidden = links == null || links.links.length === 0;
           return {
@@ -115,7 +116,7 @@ function registerComponent(runtime) {
             hidden
           };
         }),
-        backgroundColor: import_prop_controllers.Props.ResponsiveColor((props) => {
+        backgroundColor: (0, import_prop_controllers2.ResponsiveColor)((props) => {
           const links = props.links;
           const hidden = links == null || links.links.length === 0;
           return {

package/dist/cjs/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;AAAA;AAAA;AAAA;AAAA;AAAA,8BAAsB;AAGtB,yBAAkC;AAClC,uBAAuC;AACvC,6BAA8B;AAC9B,IAAAA,gBAAqB;~~AAEd~~,SAAS,kBAAkB,SAAuB;AACvD,SAAO,QAAQ;AAAA,QACb,oBAAK,MAAM,6CAAO,eAAe,GAAC;AAAA,IAClC;AAAA,MACE,MAAM,wCAAuB;AAAA,MAC7B,OAAO;AAAA,MACP,MAAM,qCAAc;AAAA,MACpB,OAAO;AAAA,QACL,IAAI,8BAAM,UAAU;AAAA,QACpB,OAAO,8BAAM,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,8BAAM,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,8BAAM,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,8BAAM,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~~,~~8BAAM~~,~~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~~,~~8BAAM~~,~~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,8BAAM,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,8BAAM,KAAK;AAAA,UACjB,QAAQ;AAAA,YACN;AAAA,cACE,cAAU,sCAAkB,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,8BAAM,MAAM;AAAA,UACjB,QAAQ,8BAAM,MAAM,OAAO;AAAA,UAC3B,cAAc,EAAE,OAAO,KAAK,MAAM,IAAI;AAAA,QACxC,CAAC;AAAA,QACD,QAAQ,8BAAM,OAAO;AAAA,UACnB,QAAQ,8BAAM,OAAO,OAAO;AAAA,UAC5B,QAAQ;AAAA,YACN;AAAA,cACE,cAAU,sCAAkB,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":["import_react"]}
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 { ResponsiveColor } 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\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: 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: 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":"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","names":["import_react","import_prop_controllers"]}

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

@@ -35,6 +35,7 @@ var import_prop_controllers = require("../../../prop-controllers");
 var import_constants = require("../constants");
 var import_components_meta = require("../../../state/modules/components-meta");
 var import_react2 = require("react");
+var import_prop_controllers2 = require("@makeswift/prop-controllers");
 function registerComponent(runtime) {
   return runtime.registerComponent(
     (0, import_react2.lazy)(() => Promise.resolve().then(() => __toESM(require("./Video")))),
@@ -50,7 +51,7 @@ function registerComponent(runtime) {
           defaultValue: { value: 560, unit: "px" }
         }),
         margin: import_prop_controllers.Props.Margin({ format: import_prop_controllers.Props.Margin.Format.ClassName }),
-        borderRadius: import_prop_controllers.Props.BorderRadius({ format: import_prop_controllers.Props.BorderRadius.Format.ClassName })
+        borderRadius: (0, import_prop_controllers2.BorderRadius)({ format: import_prop_controllers2.BorderRadius.Format.ClassName })
       }
     }
   );

package/dist/cjs/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;AAAA;AAAA;AAAA;AAAA;AAAA,8BAAsB;AAEtB,uBAAuC;AACvC,6BAA8B;AAC9B,IAAAA,gBAAqB;~~AAEd~~,SAAS,kBAAkB,SAAuB;AACvD,SAAO,QAAQ;AAAA,QACb,oBAAK,MAAM,6CAAO,SAAS,GAAC;AAAA,IAC5B;AAAA,MACE,MAAM,wCAAuB;AAAA,MAC7B,OAAO;AAAA,MACP,MAAM,qCAAc;AAAA,MACpB,OAAO;AAAA,QACL,IAAI,8BAAM,UAAU;AAAA,QACpB,OAAO,8BAAM,MAAM,EAAE,QAAQ,EAAE,UAAU,KAAK,EAAE,CAAC;AAAA,QACjD,OAAO,8BAAM,MAAM;AAAA,UACjB,QAAQ,8BAAM,MAAM,OAAO;AAAA,UAC3B,cAAc,EAAE,OAAO,KAAK,MAAM,KAAK;AAAA,QACzC,CAAC;AAAA,QACD,QAAQ,8BAAM,OAAO,EAAE,QAAQ,8BAAM,OAAO,OAAO,UAAU,CAAC;AAAA,QAC9D,~~cAAc~~,~~8BAAM~~,~~aAAa,~~EAAE,QAAQ,~~8BAAM~~,~~aAAa,~~OAAO,UAAU,CAAC;AAAA,~~MAClF~~;AAAA,IACF;AAAA,EACF;AACF;","names":["import_react"]}
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 } 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: 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: BorderRadius({ format: BorderRadius.Format.ClassName }),\n },\n },\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,8BAAsB;AAEtB,uBAAuC;AACvC,6BAA8B;AAC9B,IAAAA,gBAAqB;AACrB,IAAAC,2BAA6B;AAEtB,SAAS,kBAAkB,SAAuB;AACvD,SAAO,QAAQ;AAAA,QACb,oBAAK,MAAM,6CAAO,SAAS,GAAC;AAAA,IAC5B;AAAA,MACE,MAAM,wCAAuB;AAAA,MAC7B,OAAO;AAAA,MACP,MAAM,qCAAc;AAAA,MACpB,OAAO;AAAA,QACL,IAAI,8BAAM,UAAU;AAAA,QACpB,OAAO,8BAAM,MAAM,EAAE,QAAQ,EAAE,UAAU,KAAK,EAAE,CAAC;AAAA,QACjD,OAAO,8BAAM,MAAM;AAAA,UACjB,QAAQ,8BAAM,MAAM,OAAO;AAAA,UAC3B,cAAc,EAAE,OAAO,KAAK,MAAM,KAAK;AAAA,QACzC,CAAC;AAAA,QACD,QAAQ,8BAAM,OAAO,EAAE,QAAQ,8BAAM,OAAO,OAAO,UAAU,CAAC;AAAA,QAC9D,kBAAc,uCAAa,EAAE,QAAQ,sCAAa,OAAO,UAAU,CAAC;AAAA,MACtE;AAAA,IACF;AAAA,EACF;AACF;","names":["import_react","import_prop_controllers"]}

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

@@ -20,12 +20,16 @@ __reExport(hooks_exports, require("./useBorder"), module.exports);
 __reExport(hooks_exports, require("./useBoxShadow"), module.exports);
 __reExport(hooks_exports, require("./useResponsiveColor"), module.exports);
 __reExport(hooks_exports, require("./useMediaQuery"), module.exports);
+__reExport(hooks_exports, require("./useLinkPropControllerData"), module.exports);
+__reExport(hooks_exports, require("./useCheckboxPropControllerData"), module.exports);
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   ...require("./useBackgrounds"),
   ...require("./useBorder"),
   ...require("./useBoxShadow"),
   ...require("./useResponsiveColor"),
-  ...require("./useMediaQuery")
+  ...require("./useMediaQuery"),
+  ...require("./useLinkPropControllerData"),
+  ...require("./useCheckboxPropControllerData")
 });
 //# sourceMappingURL=index.js.map

package/dist/cjs/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'\n"],"mappings":";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,0BAAc,6BAAd;AACA,0BAAc,wBADd;AAEA,0BAAc,2BAFd;AAGA,0BAAc,iCAHd;AAIA,0BAAc,4BAJd;","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'\n"],"mappings":";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,0BAAc,6BAAd;AACA,0BAAc,wBADd;AAEA,0BAAc,2BAFd;AAGA,0BAAc,iCAHd;AAIA,0BAAc,4BAJd;AAKA,0BAAc,wCALd;AAMA,0BAAc,4CANd;","names":[]}

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

@@ -21,7 +21,7 @@ __export(useBorder_exports, {
   useBorder: () => useBorder
 });
 module.exports = __toCommonJS(useBorder_exports);
-var import_introspection = require("../../prop-controllers/introspection");
+var import_prop_controllers2 = require("@makeswift/prop-controllers");
 var import_makeswift_api = require("../../runtimes/react/hooks/makeswift-api");
 var import_isNonNullable = require("../utils/isNonNullable");
 function mapSideColor(swatches, { color, ...restOfSide }) {
@@ -34,10 +34,10 @@ function mapSideColor(swatches, { color, ...restOfSide }) {
   };
 }
 function useBorder(value) {
-  const swatchIds = (0, import_introspection.getBorderSwatchIds)(value);
+  const swatchIds = (0, import_prop_controllers2.getBorderPropControllerDataSwatchIds)(value);
   const swatches = (0, import_makeswift_api.useSwatches)(swatchIds);
   if (value == null)
-    return null;
+    return void 0;
   return value.map(({ value: { borderTop, borderBottom, borderLeft, borderRight }, ...rest }) => ({
     ...rest,
     value: {

package/dist/cjs/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":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;~~AAQA~~,~~2BAAmC~~;~~AACnC~~,2BAA4B;AAE5B,2BAA8B;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,kCAAa,EAAE,KAAK,OAAK,KAAK,EAAE,OAAO,MAAM,QAAQ;AAAA,IAC/E;AAAA,EACF;AACF;AAiBO,SAAS,UACd,~~OAC6C~~;~~AAC7C~~,QAAM,gBAAY,~~yCAAmB,~~KAAK;~~AAC1C~~,QAAM,eAAW,kCAAY,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":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAIA,IAAAA,2BAIO;AACP,2BAA4B;AAE5B,2BAA8B;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,kCAAa,EAAE,KAAK,OAAK,KAAK,EAAE,OAAO,MAAM,QAAQ;AAAA,IAC/E;AAAA,EACF;AACF;AAiBO,SAAS,UACd,OACsC;AACtC,QAAM,gBAAY,+DAAqC,KAAK;AAC5D,QAAM,eAAW,kCAAY,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":["import_prop_controllers"]}

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

@@ -22,8 +22,8 @@ __export(useBoxShadow_exports, {
 });
 module.exports = __toCommonJS(useBoxShadow_exports);
 var import_isNonNullable = require("../utils/isNonNullable");
-var import_introspection = require("../../prop-controllers/introspection");
 var import_makeswift_api = require("../../runtimes/react/hooks/makeswift-api");
+var import_prop_controllers = require("@makeswift/prop-controllers");
 const ShadowDefaultValue = {
   inset: false,
   offsetX: 0,
@@ -32,12 +32,13 @@ const ShadowDefaultValue = {
   spreadRadius: 0,
   color: null
 };
-function useBoxShadow(value) {
-  const swatchIds = (0, import_introspection.getBoxShadowsSwatchIds)(value);
+function useBoxShadow(data) {
+  const swatchIds = (0, import_prop_controllers.getShadowsPropControllerDataSwatchIds)(data);
   const swatches = (0, import_makeswift_api.useSwatches)(swatchIds);
-  if (value == null)
+  const responsiveShadowsData = (0, import_prop_controllers.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/cjs/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;AAAA;AAAA;AAAA;AAAA;AAAA,2BAA8B;~~AAI9B~~,~~2BAAuC~~;~~AACvC~~,~~2BAA4B~~;~~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,gBAAY,~~6CAAuB,KAAK~~;~~AAC9C~~,QAAM,eAAW,kCAAY,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,kCAAa,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;AAAA;AAAA;AAAA;AAAA;AAAA,2BAA8B;AAG9B,2BAA4B;AAC5B,8BAIO;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,gBAAY,+DAAsC,IAAI;AAC5D,QAAM,eAAW,kCAAY,SAAS;AACtC,QAAM,4BAAwB,2EAAkD,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,kCAAa,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/cjs/{prop-controllers/copy/shadows.js → components/hooks/useCheckboxPropControllerData.js} RENAMED Viewed

@@ -16,33 +16,19 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var shadows_exports = {};
-__export(shadows_exports, {
-  copy: () => copy
+var useCheckboxPropControllerData_exports = {};
+__export(useCheckboxPropControllerData_exports, {
+  useCheckboxPropControllerData: () => useCheckboxPropControllerData
 });
-module.exports = __toCommonJS(shadows_exports);
-function copy(value, context) {
-  if (value == null)
-    return value;
-  return value.map((override) => ({ ...override, value: override.value.map(copyShadowItem) }));
-  function copyShadowItem(item) {
-    const { color } = item.payload;
-    if (color == null)
-      return item;
-    return {
-      ...item,
-      payload: {
-        ...item.payload,
-        color: {
-          ...color,
-          swatchId: context.replacementContext.swatchIds.get(color.swatchId) ?? color.swatchId
-        }
-      }
-    };
-  }
+module.exports = __toCommonJS(useCheckboxPropControllerData_exports);
+var import_prop_controllers = require("@makeswift/prop-controllers");
+function useCheckboxPropControllerData(data) {
+  if (data == null)
+    return data;
+  return (0, import_prop_controllers.getCheckboxPropControllerDataBoolean)(data);
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  copy
+  useCheckboxPropControllerData
 });
-//# sourceMappingURL=shadows.js.map
+//# sourceMappingURL=useCheckboxPropControllerData.js.map

package/dist/cjs/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;AAAA;AAAA;AAAA;AAAA,8BAGO;AAEA,SAAS,8BACd,MACqB;AACrB,MAAI,QAAQ;AAAM,WAAO;AAEzB,aAAO,8DAAqC,IAAI;AAClD;","names":[]}

package/dist/cjs/{prop-controllers/copy/responsive-color.js → components/hooks/useLinkPropControllerData.js} RENAMED Viewed

@@ -16,24 +16,19 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var responsive_color_exports = {};
-__export(responsive_color_exports, {
-  copy: () => copy
+var useLinkPropControllerData_exports = {};
+__export(useLinkPropControllerData_exports, {
+  useLinkPropControllerData: () => useLinkPropControllerData
 });
-module.exports = __toCommonJS(responsive_color_exports);
-function copy(value, context) {
-  if (value == null)
-    return value;
-  return value.map((override) => ({ ...override, value: copyColorValue(override.value) }));
-  function copyColorValue(colorValue) {
-    return {
-      ...colorValue,
-      swatchId: context.replacementContext.swatchIds.get(colorValue.swatchId) ?? colorValue.swatchId
-    };
-  }
+module.exports = __toCommonJS(useLinkPropControllerData_exports);
+var import_prop_controllers = require("@makeswift/prop-controllers");
+function useLinkPropControllerData(data) {
+  if (data == null)
+    return data;
+  return (0, import_prop_controllers.getLinkPropControllerValue)(data);
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  copy
+  useLinkPropControllerData
 });
-//# sourceMappingURL=responsive-color.js.map
+//# sourceMappingURL=useLinkPropControllerData.js.map

package/dist/cjs/components/hooks/useLinkPropControllerData.js.map ADDED Viewed

@@ -0,0 +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;AAAA;AAAA;AAAA;AAAA,8BAIO;AAEA,SAAS,0BACd,MAC4C;AAC5C,MAAI,QAAQ;AAAM,WAAO;AAEzB,aAAO,oDAA2B,IAAI;AACxC;","names":[]}