@wordpress/components
Version:
UI components for WordPress.
8 lines (7 loc) • 4.22 kB
Source Map (JSON)
{
"version": 3,
"sources": ["../../../src/border-control/border-control-dropdown/hook.ts"],
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport * as styles from '../styles';\nimport { parseQuantityAndUnitFromRawValue } from '../../unit-control/utils';\nimport { useContextSystem } from '../../context';\nimport { useCx } from '../../utils/hooks/use-cx';\nexport function useBorderControlDropdown(props) {\n const {\n border,\n className,\n colors = [],\n enableAlpha = false,\n enableStyle = true,\n onChange,\n previousStyleSelection,\n size = 'default',\n __experimentalIsRenderedInSidebar = false,\n ...otherProps\n } = useContextSystem(props, 'BorderControlDropdown');\n const [widthValue] = parseQuantityAndUnitFromRawValue(border?.width);\n const hasZeroWidth = widthValue === 0;\n const onColorChange = color => {\n const style = border?.style === 'none' ? previousStyleSelection : border?.style;\n const width = hasZeroWidth && !!color ? '1px' : border?.width;\n onChange({\n color,\n style,\n width\n });\n };\n const onStyleChange = style => {\n const width = hasZeroWidth && !!style ? '1px' : border?.width;\n onChange({\n ...border,\n style,\n width\n });\n };\n const onReset = () => {\n onChange({\n ...border,\n color: undefined,\n style: undefined\n });\n };\n\n // Generate class names.\n const cx = useCx();\n const classes = useMemo(() => {\n return cx(styles.borderControlDropdown, className);\n }, [className, cx]);\n const indicatorClassName = useMemo(() => {\n return cx(styles.borderColorIndicator);\n }, [cx]);\n const indicatorWrapperClassName = useMemo(() => {\n return cx(styles.colorIndicatorWrapper(border, size));\n }, [border, cx, size]);\n const popoverControlsClassName = useMemo(() => {\n return cx(styles.borderControlPopoverControls);\n }, [cx]);\n const popoverContentClassName = useMemo(() => {\n return cx(styles.borderControlPopoverContent);\n }, [cx]);\n const resetButtonWrapperClassName = useMemo(() => {\n return cx(styles.resetButtonWrapper);\n }, [cx]);\n return {\n ...otherProps,\n border,\n className: classes,\n colors,\n enableAlpha,\n enableStyle,\n indicatorClassName,\n indicatorWrapperClassName,\n onColorChange,\n onStyleChange,\n onReset,\n popoverContentClassName,\n popoverControlsClassName,\n resetButtonWrapperClassName,\n size,\n __experimentalIsRenderedInSidebar\n };\n}"],
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,qBAAwB;AAKxB,aAAwB;AACxB,mBAAiD;AACjD,qBAAiC;AACjC,oBAAsB;AACf,SAAS,yBAAyB,OAAO;AAC9C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,SAAS,CAAC;AAAA,IACV,cAAc;AAAA,IACd,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP,oCAAoC;AAAA,IACpC,GAAG;AAAA,EACL,QAAI,iCAAiB,OAAO,uBAAuB;AACnD,QAAM,CAAC,UAAU,QAAI,+CAAiC,QAAQ,KAAK;AACnE,QAAM,eAAe,eAAe;AACpC,QAAM,gBAAgB,WAAS;AAC7B,UAAM,QAAQ,QAAQ,UAAU,SAAS,yBAAyB,QAAQ;AAC1E,UAAM,QAAQ,gBAAgB,CAAC,CAAC,QAAQ,QAAQ,QAAQ;AACxD,aAAS;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,EACH;AACA,QAAM,gBAAgB,WAAS;AAC7B,UAAM,QAAQ,gBAAgB,CAAC,CAAC,QAAQ,QAAQ,QAAQ;AACxD,aAAS;AAAA,MACP,GAAG;AAAA,MACH;AAAA,MACA;AAAA,IACF,CAAC;AAAA,EACH;AACA,QAAM,UAAU,MAAM;AACpB,aAAS;AAAA,MACP,GAAG;AAAA,MACH,OAAO;AAAA,MACP,OAAO;AAAA,IACT,CAAC;AAAA,EACH;AAGA,QAAM,SAAK,qBAAM;AACjB,QAAM,cAAU,wBAAQ,MAAM;AAC5B,WAAO,GAAU,8BAAuB,SAAS;AAAA,EACnD,GAAG,CAAC,WAAW,EAAE,CAAC;AAClB,QAAM,yBAAqB,wBAAQ,MAAM;AACvC,WAAO,GAAU,2BAAoB;AAAA,EACvC,GAAG,CAAC,EAAE,CAAC;AACP,QAAM,gCAA4B,wBAAQ,MAAM;AAC9C,WAAO,GAAU,6BAAsB,QAAQ,IAAI,CAAC;AAAA,EACtD,GAAG,CAAC,QAAQ,IAAI,IAAI,CAAC;AACrB,QAAM,+BAA2B,wBAAQ,MAAM;AAC7C,WAAO,GAAU,mCAA4B;AAAA,EAC/C,GAAG,CAAC,EAAE,CAAC;AACP,QAAM,8BAA0B,wBAAQ,MAAM;AAC5C,WAAO,GAAU,kCAA2B;AAAA,EAC9C,GAAG,CAAC,EAAE,CAAC;AACP,QAAM,kCAA8B,wBAAQ,MAAM;AAChD,WAAO,GAAU,yBAAkB;AAAA,EACrC,GAAG,CAAC,EAAE,CAAC;AACP,SAAO;AAAA,IACL,GAAG;AAAA,IACH;AAAA,IACA,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
"names": []
}