@muraldevkit/ui-toolkit 4.67.0 → 4.68.0-dev-NFbt.1

package/dist/esm/components/form/select/styles/default.js

@@ -0,0 +1,302 @@
+import { objectSpread2 as _objectSpread2 } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { keyframes } from '@emotion/react';
+
+/**
+ * MrlSelect styles object for the default kind
+ * @returns a styles object
+ */
+function defaultStyles() {
+  var outlineAnimation = keyframes({
+    '0%': {
+      outline: '0 solid transparent',
+      outlineOffset: '1px'
+    },
+    '50%': {
+      outline: '4px solid var(--mrl-color-focus)',
+      outlineOffset: '1px'
+    },
+    '100%': {
+      outline: '2px solid var(--mrl-color-focus)',
+      outlineOffset: '1px'
+    }
+  });
+  return {
+    control: function control(baseStyles, state) {
+      var hasError = state.selectProps['aria-invalid'];
+      var isReadOnly = state.selectProps['aria-readonly'];
+      var styles = _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        cursor: 'pointer',
+        color: 'var(--mrl-color-text-secondary)',
+        backgroundColor: 'var(--mrl-color-background-input)',
+        borderWidth: 'var(--mrl-line-width-control)',
+        borderColor: 'var(--mrl-color-line)',
+        borderStyle: 'solid',
+        borderRadius: 'var(--mrl-radii-03)',
+        boxShadow: 'none',
+        boxSizing: 'border-box',
+        fontSize: 'var(--mrl-type-size-text-small)',
+        margin: '0',
+        padding: 'calc(var(--mrl-spacing-02) + var(--mrl-spacing-01)) var(--mrl-spacing-03)',
+        outline: 'var(--mrl-line-width-focus) solid transparent',
+        outlineOffset: 'var(--mrl-space-offset-focus)',
+        '&:hover': {
+          color: 'var(--mrl-color-text-selected)',
+          borderColor: 'var(--mrl-color-line-hover)'
+        }
+      });
+
+      // Populated (open)
+      if (state.menuIsOpen) {
+        styles.color = 'var(--mrl-color-text-selected)';
+        styles.borderColor = 'var(--mrl-color-line-hover)';
+      }
+
+      // Populated (closed)
+      if (state.hasValue) {
+        styles.color = 'var(--mrl-color-text-selected)';
+      }
+
+      // Focus
+      if (state.isFocused && !state.menuIsOpen) {
+        styles.color = 'var(--mrl-color-text-selected)';
+        styles.borderColor = 'var(--mrl-color-line-hover)';
+        styles.outlineColor = 'var(--mrl-color-focus)';
+        styles.animationFillMode = 'forwards';
+        styles.animationIterationCount = 1;
+        styles.animation = "".concat(outlineAnimation, " var(--mrl-duration-03) var(--mrl-timing-m3)");
+      }
+
+      // Alert
+      if (hasError) {
+        styles.color = 'var(--mrl-color-text-selected)';
+        styles.borderColor = 'rgba(var(--mrl-status-error), 1)';
+        styles['&:hover'] = {
+          borderColor: 'rgba(var(--mrl-status-error), 1)'
+        };
+      }
+
+      // Disabled (default and populated)
+      if (state.isDisabled) {
+        styles.color = 'var(--mrl-color-text-disabled)';
+        styles.borderColor = 'var(--mrl-color-line-disabled)';
+        styles['&:hover'] = {
+          borderColor: 'var(--mrl-color-line-disabled)'
+        };
+      }
+
+      // Read only
+      if (isReadOnly) {
+        styles.color = 'var(--mrl-color-text-selected)';
+        styles.borderColor = 'transparent';
+        styles.backgroundColor = 'var(--mrl-black-opacity-00)';
+        styles['&:hover'] = {
+          borderColor: 'transparent'
+        };
+      }
+      return styles;
+    },
+    clearIndicator: function clearIndicator(baseStyles, props) {
+      if (props.selectProps.showClearIndicatorIcon) {
+        return _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+          color: 'var(--mrl-color-text-selected)',
+          display: 'inline-block',
+          padding: '0 var(--mrl-spacing-02) 0 0',
+          margin: 0,
+          height: 'var(--mrl-spacing-06)',
+          '&:hover': {
+            color: 'var(--mrl-color-text-selected)'
+          }
+        });
+      }
+      return _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        display: 'none'
+      });
+    },
+    valueContainer: function valueContainer(baseStyles) {
+      return _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        padding: 0,
+        minHeight: 'var(--mrl-spacing-07)',
+        gap: 'var(--mrl-spacing-01)'
+      });
+    },
+    indicatorSeparator: function indicatorSeparator() {
+      return {
+        display: 'none'
+      };
+    },
+    indicatorsContainer: function indicatorsContainer(baseStyles, state) {
+      var isReadOnly = state.selectProps['aria-readonly'];
+      return _objectSpread2(_objectSpread2(_objectSpread2({}, baseStyles), isReadOnly && {
+        display: 'none'
+      }), {}, {
+        height: 'auto'
+      });
+    },
+    input: function input(baseStyles) {
+      return _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        padding: 0,
+        margin: 0
+      });
+    },
+    menuList: function menuList(baseStyles) {
+      return _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        padding: 'var(--mrl-space-inset)',
+        margin: 0
+      });
+    },
+    menu: function menu(baseStyles) {
+      return _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        marginTop: 'calc(-1 * var(--mrl-spacing-02))',
+        marginBottom: 'calc(-1 * var(--mrl-spacing-02))',
+        borderRadius: 'var(--mrl-radii-03)',
+        padding: 0,
+        boxShadow: 'var(--mrl-shadow-01)'
+      });
+    },
+    option: function option(baseStyles, state) {
+      var styles = _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        backgroundColor: 'var(--mrl-color-background-input)',
+        position: 'relative',
+        cursor: 'pointer',
+        display: 'flex',
+        borderRadius: 'var(--mrl-radii-03)',
+        fontSize: 'var(--mrl-type-size-text-small)',
+        fontWeight: 'var(--mrl-type-weight-title-secondary)',
+        letterSpacing: 'var(--mrl-type-spacing-text)',
+        lineHeight: 'var(--mrl-type-line-height-text-small)',
+        color: 'var(--mrl-color-text)',
+        paddingTop: 'calc(var(--mrl-spacing-01) + var(--mrl-spacing-02))',
+        paddingRight: 'var(--mrl-space-inset)',
+        paddingBottom: 'calc(var(--mrl-spacing-01) + var(--mrl-spacing-02))',
+        marginBottom: 'var(--mrl-spacing-02)',
+        outline: 'var(--mrl-line-width-focus) solid transparent',
+        outlineOffset: 'var(--mrl-space-offset-focus)',
+        '&:hover': {
+          backgroundColor: 'var(--mrl-black-opacity-00)'
+        },
+        ':active': {
+          backgroundColor: 'var(--mrl-color-background-hover)'
+        }
+      });
+      if (state.isSelected) {
+        styles.backgroundColor = 'var(--mrl-color-background-selected)';
+        styles.color = 'var(--mrl-color-text-highlight-selected)';
+        styles.outlineColor = 'transparent';
+        styles['&:hover'] = {
+          backgroundColor: 'var(--mrl-color-background-selected)'
+        };
+      }
+      if (state.isFocused) {
+        styles.borderColor = 'var(--mrl-color-line-hover)';
+        styles.outlineColor = 'var(--mrl-color-focus)';
+        styles.animationFillMode = 'forwards';
+        styles.animationIterationCount = 1;
+        styles.animation = "".concat(outlineAnimation, " var(--mrl-duration-03) var(--mrl-timing-m3)");
+      }
+      if (state.isSelected && state.isFocused) {
+        styles.backgroundColor = 'var(--mrl-color-background-selected)';
+        styles.color = 'var(--mrl-color-text-highlight-selected)';
+        styles.outlineColor = 'var(--mrl-color-focus)';
+      }
+      return styles;
+    },
+    placeholder: function placeholder(baseStyles, state) {
+      var isMulti = state.isMulti;
+      var styles = _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        color: 'inherit',
+        lineHeight: 'inherit'
+      });
+
+      // Multi-select
+      if (isMulti) {
+        styles.marginLeft = 0;
+      }
+      return styles;
+    },
+    singleValue: function singleValue(baseStyles) {
+      var styles = _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        color: 'inherit'
+      });
+      return styles;
+    },
+    multiValue: function multiValue(baseStyles) {
+      var styles = _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        margin: 0,
+        padding: 0,
+        backgroundColor: 'rgba(var(--mrl-gray-10), 1)',
+        boxSizing: 'border-box',
+        borderStyle: 'solid',
+        borderRadius: 'var(--mrl-radii-02)',
+        borderColor: 'var(--mrl-black-opacity-00)',
+        borderWidth: 'var(--mrl-line-width-control)',
+        display: 'flex',
+        alignItems: 'center',
+        height: 'var(--mrl-spacing-07)'
+      });
+      return styles;
+    },
+    multiValueLabel: function multiValueLabel(baseStyles) {
+      var styles = _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        padding: 'var(--mrl-spacing-01)',
+        paddingLeft: 'calc(var(--mrl-spacing-02) + var(--mrl-spacing-01))',
+        paddingRight: 'var(--mrl-spacing-01)',
+        fontSize: 'var(--mrl-font-size-02)',
+        fontWeight: 'var(--mrl-font-weight-02)',
+        color: 'var(--mrl-color-text)'
+      });
+      return styles;
+    },
+    multiValueRemove: function multiValueRemove(baseStyles) {
+      var styles = _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        padding: 0,
+        margin: 0,
+        borderStyle: 'solid',
+        borderRadius: 'var(--mrl-radii-02)',
+        height: 'var(--mrl-spacing-05)',
+        width: 'var(--mrl-spacing-05)',
+        color: 'var(--mrl-color-text)',
+        backgroundColor: 'rgba(var(--mrl-gray-10), 1)',
+        '&:hover': {
+          color: 'var(--mrl-color-text-selected)',
+          backgroundColor: 'rgba(var(--mrl-gray-10), 1)'
+        }
+      });
+      return styles;
+    },
+    noOptionsMessage: function noOptionsMessage(baseStyles) {
+      var styles = _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        color: 'var(--mrl-color-text-secondary)',
+        fontSize: 'var(--mrl-type-size-text-small)',
+        padding: 0
+      });
+      return styles;
+    },
+    loadingMessage: function loadingMessage(baseStyles) {
+      return _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        color: 'var(--mrl-color-text-secondary)',
+        fontSize: 'var(--mrl-type-size-text-small)',
+        padding: 0
+      });
+    },
+    group: function group(baseStyles) {
+      var styles = _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        paddingTop: 0,
+        paddingBottom: 'var(--mrl-spacing-01)'
+      });
+      return styles;
+    },
+    groupHeading: function groupHeading(baseStyles) {
+      var styles = _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        paddingLeft: 0,
+        textTransform: 'capitalize',
+        marginBottom: 'var(--mrl-spacing-03)',
+        color: 'var(--mrl-color-text-secondary)',
+        fontSize: 'var(--mrl-font-size-02)'
+      });
+      return styles;
+    }
+  };
+}
+
+export { defaultStyles };
+//# sourceMappingURL=default.js.map

package/dist/esm/components/form/select/styles/default.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"default.js","sources":["../../../../../../src/components/form/select/styles/default.ts"],"sourcesContent":["/* eslint-disable sort-keys */\nimport { CSSObjectWithLabel, GroupBase, StylesConfig } from 'react-select';\nimport { keyframes } from '@emotion/react';\n\n/**\n * MrlSelect styles object for the default kind\n * @returns a styles object\n */\nexport function defaultStyles<\n\tT,\n\tIsMulti extends boolean = false,\n\tGroup extends GroupBase<T> = GroupBase<T>\n>(): StylesConfig<T, IsMulti, Group> {\n\tconst outlineAnimation = keyframes({\n\t\t'0%': {\n\t\t\toutline: '0 solid transparent',\n\t\t\toutlineOffset: '1px'\n\t\t},\n\t\t'50%': {\n\t\t\toutline: '4px solid var(--mrl-color-focus)',\n\t\t\toutlineOffset: '1px'\n\t\t},\n\t\t'100%': {\n\t\t\toutline: '2px solid var(--mrl-color-focus)',\n\t\t\toutlineOffset: '1px'\n\t\t}\n\t});\n\n\treturn {\n\t\tcontrol: (baseStyles, state) => {\n\t\t\tconst hasError = state.selectProps['aria-invalid'];\n\t\t\tconst isReadOnly = state.selectProps['aria-readonly'];\n\n\t\t\tconst styles: CSSObjectWithLabel = {\n\t\t\t\t...baseStyles,\n\t\t\t\tcursor: 'pointer',\n\t\t\t\tcolor: 'var(--mrl-color-text-secondary)',\n\t\t\t\tbackgroundColor: 'var(--mrl-color-background-input)',\n\t\t\t\tborderWidth: 'var(--mrl-line-width-control)',\n\t\t\t\tborderColor: 'var(--mrl-color-line)',\n\t\t\t\tborderStyle: 'solid',\n\t\t\t\tborderRadius: 'var(--mrl-radii-03)',\n\t\t\t\tboxShadow: 'none',\n\t\t\t\tboxSizing: 'border-box',\n\t\t\t\tfontSize: 'var(--mrl-type-size-text-small)',\n\t\t\t\tmargin: '0',\n\t\t\t\tpadding: 'calc(var(--mrl-spacing-02) + var(--mrl-spacing-01)) var(--mrl-spacing-03)',\n\t\t\t\toutline: 'var(--mrl-line-width-focus) solid transparent',\n\t\t\t\toutlineOffset: 'var(--mrl-space-offset-focus)',\n\t\t\t\t'&:hover': {\n\t\t\t\t\tcolor: 'var(--mrl-color-text-selected)',\n\t\t\t\t\tborderColor: 'var(--mrl-color-line-hover)'\n\t\t\t\t}\n\t\t\t};\n\n\t\t\t// Populated (open)\n\t\t\tif (state.menuIsOpen) {\n\t\t\t\tstyles.color = 'var(--mrl-color-text-selected)';\n\t\t\t\tstyles.borderColor = 'var(--mrl-color-line-hover)';\n\t\t\t}\n\n\t\t\t// Populated (closed)\n\t\t\tif (state.hasValue) {\n\t\t\t\tstyles.color = 'var(--mrl-color-text-selected)';\n\t\t\t}\n\n\t\t\t// Focus\n\t\t\tif (state.isFocused && !state.menuIsOpen) {\n\t\t\t\tstyles.color = 'var(--mrl-color-text-selected)';\n\t\t\t\tstyles.borderColor = 'var(--mrl-color-line-hover)';\n\t\t\t\tstyles.outlineColor = 'var(--mrl-color-focus)';\n\t\t\t\tstyles.animationFillMode = 'forwards';\n\t\t\t\tstyles.animationIterationCount = 1;\n\t\t\t\tstyles.animation = `${outlineAnimation} var(--mrl-duration-03) var(--mrl-timing-m3)`;\n\t\t\t}\n\n\t\t\t// Alert\n\t\t\tif (hasError) {\n\t\t\t\tstyles.color = 'var(--mrl-color-text-selected)';\n\t\t\t\tstyles.borderColor = 'rgba(var(--mrl-status-error), 1)';\n\t\t\t\tstyles['&:hover'] = {\n\t\t\t\t\tborderColor: 'rgba(var(--mrl-status-error), 1)'\n\t\t\t\t};\n\t\t\t}\n\n\t\t\t// Disabled (default and populated)\n\t\t\tif (state.isDisabled) {\n\t\t\t\tstyles.color = 'var(--mrl-color-text-disabled)';\n\t\t\t\tstyles.borderColor = 'var(--mrl-color-line-disabled)';\n\t\t\t\tstyles['&:hover'] = {\n\t\t\t\t\tborderColor: 'var(--mrl-color-line-disabled)'\n\t\t\t\t};\n\t\t\t}\n\n\t\t\t// Read only\n\t\t\tif (isReadOnly) {\n\t\t\t\tstyles.color = 'var(--mrl-color-text-selected)';\n\t\t\t\tstyles.borderColor = 'transparent';\n\t\t\t\tstyles.backgroundColor = 'var(--mrl-black-opacity-00)';\n\t\t\t\tstyles['&:hover'] = {\n\t\t\t\t\tborderColor: 'transparent'\n\t\t\t\t};\n\t\t\t}\n\n\t\t\treturn styles;\n\t\t},\n\t\tclearIndicator: (baseStyles, props) => {\n\t\t\tif (props.selectProps.showClearIndicatorIcon) {\n\t\t\t\treturn {\n\t\t\t\t\t...baseStyles,\n\t\t\t\t\tcolor: 'var(--mrl-color-text-selected)',\n\t\t\t\t\tdisplay: 'inline-block',\n\t\t\t\t\tpadding: '0 var(--mrl-spacing-02) 0 0',\n\t\t\t\t\tmargin: 0,\n\t\t\t\t\theight: 'var(--mrl-spacing-06)',\n\t\t\t\t\t'&:hover': {\n\t\t\t\t\t\tcolor: 'var(--mrl-color-text-selected)'\n\t\t\t\t\t}\n\t\t\t\t};\n\t\t\t}\n\n\t\t\treturn {\n\t\t\t\t...baseStyles,\n\t\t\t\tdisplay: 'none'\n\t\t\t};\n\t\t},\n\t\tvalueContainer: (baseStyles) => {\n\t\t\treturn {\n\t\t\t\t...baseStyles,\n\t\t\t\tpadding: 0,\n\t\t\t\tminHeight: 'var(--mrl-spacing-07)',\n\t\t\t\tgap: 'var(--mrl-spacing-01)'\n\t\t\t};\n\t\t},\n\t\tindicatorSeparator: () => {\n\t\t\treturn {\n\t\t\t\tdisplay: 'none'\n\t\t\t};\n\t\t},\n\t\tindicatorsContainer: (baseStyles, state) => {\n\t\t\tconst isReadOnly = state.selectProps['aria-readonly'];\n\n\t\t\treturn {\n\t\t\t\t...baseStyles,\n\t\t\t\t...(isReadOnly && { display: 'none' }),\n\t\t\t\theight: 'auto'\n\t\t\t};\n\t\t},\n\t\tinput: (baseStyles) => {\n\t\t\treturn {\n\t\t\t\t...baseStyles,\n\t\t\t\tpadding: 0,\n\t\t\t\tmargin: 0\n\t\t\t};\n\t\t},\n\t\tmenuList: (baseStyles) => {\n\t\t\treturn {\n\t\t\t\t...baseStyles,\n\t\t\t\tpadding: 'var(--mrl-space-inset)',\n\t\t\t\tmargin: 0\n\t\t\t};\n\t\t},\n\t\tmenu: (baseStyles) => {\n\t\t\treturn {\n\t\t\t\t...baseStyles,\n\t\t\t\tmarginTop: 'calc(-1 * var(--mrl-spacing-02))',\n\t\t\t\tmarginBottom: 'calc(-1 * var(--mrl-spacing-02))',\n\t\t\t\tborderRadius: 'var(--mrl-radii-03)',\n\t\t\t\tpadding: 0,\n\t\t\t\tboxShadow: 'var(--mrl-shadow-01)'\n\t\t\t};\n\t\t},\n\t\toption: (baseStyles, state) => {\n\t\t\tconst styles: CSSObjectWithLabel = {\n\t\t\t\t...baseStyles,\n\t\t\t\tbackgroundColor: 'var(--mrl-color-background-input)',\n\t\t\t\tposition: 'relative',\n\t\t\t\tcursor: 'pointer',\n\t\t\t\tdisplay: 'flex',\n\t\t\t\tborderRadius: 'var(--mrl-radii-03)',\n\t\t\t\tfontSize: 'var(--mrl-type-size-text-small)',\n\t\t\t\tfontWeight: 'var(--mrl-type-weight-title-secondary)',\n\t\t\t\tletterSpacing: 'var(--mrl-type-spacing-text)',\n\t\t\t\tlineHeight: 'var(--mrl-type-line-height-text-small)',\n\t\t\t\tcolor: 'var(--mrl-color-text)',\n\t\t\t\tpaddingTop: 'calc(var(--mrl-spacing-01) + var(--mrl-spacing-02))',\n\t\t\t\tpaddingRight: 'var(--mrl-space-inset)',\n\t\t\t\tpaddingBottom: 'calc(var(--mrl-spacing-01) + var(--mrl-spacing-02))',\n\t\t\t\tmarginBottom: 'var(--mrl-spacing-02)',\n\t\t\t\toutline: 'var(--mrl-line-width-focus) solid transparent',\n\t\t\t\toutlineOffset: 'var(--mrl-space-offset-focus)',\n\t\t\t\t'&:hover': {\n\t\t\t\t\tbackgroundColor: 'var(--mrl-black-opacity-00)'\n\t\t\t\t},\n\t\t\t\t':active': {\n\t\t\t\t\tbackgroundColor: 'var(--mrl-color-background-hover)'\n\t\t\t\t}\n\t\t\t};\n\n\t\t\tif (state.isSelected) {\n\t\t\t\tstyles.backgroundColor = 'var(--mrl-color-background-selected)';\n\t\t\t\tstyles.color = 'var(--mrl-color-text-highlight-selected)';\n\t\t\t\tstyles.outlineColor = 'transparent';\n\t\t\t\tstyles['&:hover'] = {\n\t\t\t\t\tbackgroundColor: 'var(--mrl-color-background-selected)'\n\t\t\t\t};\n\t\t\t}\n\n\t\t\tif (state.isFocused) {\n\t\t\t\tstyles.borderColor = 'var(--mrl-color-line-hover)';\n\t\t\t\tstyles.outlineColor = 'var(--mrl-color-focus)';\n\t\t\t\tstyles.animationFillMode = 'forwards';\n\t\t\t\tstyles.animationIterationCount = 1;\n\t\t\t\tstyles.animation = `${outlineAnimation} var(--mrl-duration-03) var(--mrl-timing-m3)`;\n\t\t\t}\n\n\t\t\tif (state.isSelected && state.isFocused) {\n\t\t\t\tstyles.backgroundColor = 'var(--mrl-color-background-selected)';\n\t\t\t\tstyles.color = 'var(--mrl-color-text-highlight-selected)';\n\t\t\t\tstyles.outlineColor = 'var(--mrl-color-focus)';\n\t\t\t}\n\n\t\t\treturn styles;\n\t\t},\n\t\tplaceholder: (baseStyles, state) => {\n\t\t\tconst isMulti = state.isMulti;\n\n\t\t\tconst styles: CSSObjectWithLabel = {\n\t\t\t\t...baseStyles,\n\t\t\t\tcolor: 'inherit',\n\t\t\t\tlineHeight: 'inherit'\n\t\t\t};\n\n\t\t\t// Multi-select\n\t\t\tif (isMulti) {\n\t\t\t\tstyles.marginLeft = 0;\n\t\t\t}\n\n\t\t\treturn styles;\n\t\t},\n\t\tsingleValue: (baseStyles) => {\n\t\t\tconst styles: CSSObjectWithLabel = {\n\t\t\t\t...baseStyles,\n\t\t\t\tcolor: 'inherit'\n\t\t\t};\n\n\t\t\treturn styles;\n\t\t},\n\t\tmultiValue: (baseStyles) => {\n\t\t\tconst styles: CSSObjectWithLabel = {\n\t\t\t\t...baseStyles,\n\t\t\t\tmargin: 0,\n\t\t\t\tpadding: 0,\n\t\t\t\tbackgroundColor: 'rgba(var(--mrl-gray-10), 1)',\n\t\t\t\tboxSizing: 'border-box',\n\t\t\t\tborderStyle: 'solid',\n\t\t\t\tborderRadius: 'var(--mrl-radii-02)',\n\t\t\t\tborderColor: 'var(--mrl-black-opacity-00)',\n\t\t\t\tborderWidth: 'var(--mrl-line-width-control)',\n\t\t\t\tdisplay: 'flex',\n\t\t\t\talignItems: 'center',\n\t\t\t\theight: 'var(--mrl-spacing-07)'\n\t\t\t};\n\n\t\t\treturn styles;\n\t\t},\n\t\tmultiValueLabel: (baseStyles) => {\n\t\t\tconst styles: CSSObjectWithLabel = {\n\t\t\t\t...baseStyles,\n\t\t\t\tpadding: 'var(--mrl-spacing-01)',\n\t\t\t\tpaddingLeft: 'calc(var(--mrl-spacing-02) + var(--mrl-spacing-01))',\n\t\t\t\tpaddingRight: 'var(--mrl-spacing-01)',\n\t\t\t\tfontSize: 'var(--mrl-font-size-02)',\n\t\t\t\tfontWeight: 'var(--mrl-font-weight-02)',\n\t\t\t\tcolor: 'var(--mrl-color-text)'\n\t\t\t};\n\n\t\t\treturn styles;\n\t\t},\n\t\tmultiValueRemove: (baseStyles) => {\n\t\t\tconst styles: CSSObjectWithLabel = {\n\t\t\t\t...baseStyles,\n\t\t\t\tpadding: 0,\n\t\t\t\tmargin: 0,\n\t\t\t\tborderStyle: 'solid',\n\t\t\t\tborderRadius: 'var(--mrl-radii-02)',\n\t\t\t\theight: 'var(--mrl-spacing-05)',\n\t\t\t\twidth: 'var(--mrl-spacing-05)',\n\t\t\t\tcolor: 'var(--mrl-color-text)',\n\t\t\t\tbackgroundColor: 'rgba(var(--mrl-gray-10), 1)',\n\t\t\t\t'&:hover': {\n\t\t\t\t\tcolor: 'var(--mrl-color-text-selected)',\n\t\t\t\t\tbackgroundColor: 'rgba(var(--mrl-gray-10), 1)'\n\t\t\t\t}\n\t\t\t};\n\n\t\t\treturn styles;\n\t\t},\n\t\tnoOptionsMessage: (baseStyles) => {\n\t\t\tconst styles: CSSObjectWithLabel = {\n\t\t\t\t...baseStyles,\n\t\t\t\tcolor: 'var(--mrl-color-text-secondary)',\n\t\t\t\tfontSize: 'var(--mrl-type-size-text-small)',\n\t\t\t\tpadding: 0\n\t\t\t};\n\n\t\t\treturn styles;\n\t\t},\n\t\tloadingMessage: (baseStyles: CSSObjectWithLabel) => {\n\t\t\treturn {\n\t\t\t\t...baseStyles,\n\t\t\t\tcolor: 'var(--mrl-color-text-secondary)',\n\t\t\t\tfontSize: 'var(--mrl-type-size-text-small)',\n\t\t\t\tpadding: 0\n\t\t\t};\n\t\t},\n\t\tgroup: (baseStyles) => {\n\t\t\tconst styles: CSSObjectWithLabel = {\n\t\t\t\t...baseStyles,\n\t\t\t\tpaddingTop: 0,\n\t\t\t\tpaddingBottom: 'var(--mrl-spacing-01)'\n\t\t\t};\n\n\t\t\treturn styles;\n\t\t},\n\t\tgroupHeading: (baseStyles) => {\n\t\t\tconst styles: CSSObjectWithLabel = {\n\t\t\t\t...baseStyles,\n\t\t\t\tpaddingLeft: 0,\n\t\t\t\ttextTransform: 'capitalize',\n\t\t\t\tmarginBottom: 'var(--mrl-spacing-03)',\n\t\t\t\tcolor: 'var(--mrl-color-text-secondary)',\n\t\t\t\tfontSize: 'var(--mrl-font-size-02)'\n\t\t\t};\n\n\t\t\treturn styles;\n\t\t}\n\t};\n}\n"],"names":["defaultStyles","outlineAnimation","keyframes","outline","outlineOffset","control","baseStyles","state","hasError","selectProps","isReadOnly","styles","_objectSpread","cursor","color","backgroundColor","borderWidth","borderColor","borderStyle","borderRadius","boxShadow","boxSizing","fontSize","margin","padding","menuIsOpen","hasValue","isFocused","outlineColor","animationFillMode","animationIterationCount","animation","concat","isDisabled","clearIndicator","props","showClearIndicatorIcon","display","height","valueContainer","minHeight","gap","indicatorSeparator","indicatorsContainer","input","menuList","menu","marginTop","marginBottom","option","position","fontWeight","letterSpacing","lineHeight","paddingTop","paddingRight","paddingBottom","isSelected","placeholder","isMulti","marginLeft","singleValue","multiValue","alignItems","multiValueLabel","paddingLeft","multiValueRemove","width","noOptionsMessage","loadingMessage","group","groupHeading","textTransform"],"mappings":"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"}

package/dist/esm/components/form/select/styles/index.js

@@ -0,0 +1,27 @@
+import { defaultStyles } from './default.js';
+import { inlineStyles } from './inline.js';
+import { inlineNoLabelStyles } from './inlineNoLabel.js';
+import { inlineStackedStyles } from './inlineStacked.js';
+
+/**
+ * Gets the styles objects for each MrlSelect kind
+ *
+ * @param kind - the select kind
+ * @returns the styles object for react-select
+ */
+function getSelectStyles() {
+  var kind = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'default';
+  if (kind === 'inline') {
+    return inlineStyles();
+  }
+  if (kind === 'inline-stacked') {
+    return inlineStackedStyles();
+  }
+  if (kind === 'inline-no-label') {
+    return inlineNoLabelStyles();
+  }
+  return defaultStyles();
+}
+
+export { getSelectStyles };
+//# sourceMappingURL=index.js.map

package/dist/esm/components/form/select/styles/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../../src/components/form/select/styles/index.ts"],"sourcesContent":["import { GroupBase, StylesConfig } from 'react-select';\nimport { SelectKind } from '../types';\nimport { defaultStyles } from './default';\nimport { inlineStyles } from './inline';\nimport { inlineNoLabelStyles } from './inlineNoLabel';\nimport { inlineStackedStyles } from './inlineStacked';\n\n/**\n * Gets the styles objects for each MrlSelect kind\n *\n * @param kind - the select kind\n * @returns the styles object for react-select\n */\nexport function getSelectStyles<\n\tT,\n\tIsMulti extends boolean = false,\n\tGroup extends GroupBase<T> = GroupBase<T>\n>(kind: SelectKind = 'default'): StylesConfig<T, IsMulti, Group> {\n\tif (kind === 'inline') {\n\t\treturn inlineStyles<T, IsMulti, Group>();\n\t}\n\n\tif (kind === 'inline-stacked') {\n\t\treturn inlineStackedStyles<T, IsMulti, Group>();\n\t}\n\n\tif (kind === 'inline-no-label') {\n\t\treturn inlineNoLabelStyles<T, IsMulti, Group>();\n\t}\n\n\treturn defaultStyles<T, IsMulti, Group>();\n}\n"],"names":["getSelectStyles","kind","arguments","length","undefined","inlineStyles","inlineStackedStyles","inlineNoLabelStyles","defaultStyles"],"mappings":";;;;;AAOA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,eAAeA,GAIkC;AAAA,EAAA,IAA/DC,IAAgB,GAAAC,SAAA,CAAAC,MAAA,GAAA,CAAA,IAAAD,SAAA,CAAA,CAAA,CAAA,KAAAE,SAAA,GAAAF,SAAA,CAAA,CAAA,CAAA,GAAG,SAAS;EAC7B,IAAID,IAAI,KAAK,QAAQ,EAAE;IACtB,OAAOI,YAAY,EAAqB;AACzC,EAAA;EAEA,IAAIJ,IAAI,KAAK,gBAAgB,EAAE;IAC9B,OAAOK,mBAAmB,EAAqB;AAChD,EAAA;EAEA,IAAIL,IAAI,KAAK,iBAAiB,EAAE;IAC/B,OAAOM,mBAAmB,EAAqB;AAChD,EAAA;EAEA,OAAOC,aAAa,EAAqB;AAC1C;;;;"}

package/dist/esm/components/form/select/styles/inline.js

@@ -0,0 +1,51 @@
+import { objectSpread2 as _objectSpread2 } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { defaultStyles } from './default.js';
+
+/**
+ * MrlSelect styles object for the inline kind
+ *
+ * @returns a styles object
+ */
+function inlineStyles() {
+  return _objectSpread2(_objectSpread2({}, defaultStyles()), {}, {
+    container: function container(baseStyles) {
+      return _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        flexGrow: 1
+      });
+    },
+    control: function control(baseStyles, state) {
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+      var styles = defaultStyles().control(baseStyles, state);
+      var hasError = state.selectProps['aria-invalid'];
+      var isReadOnly = state.selectProps['aria-readonly'];
+      styles.borderColor = 'transparent';
+      styles['&:hover'] = {
+        backgroundColor: 'var(--mrl-black-opacity-00)',
+        borderColor: 'transparent',
+        color: 'var(--mrl-color-text-selected)'
+      };
+      if (state.menuIsOpen) {
+        styles.backgroundColor = 'var(--mrl-black-opacity-01)';
+      }
+      if (hasError) {
+        styles.borderColor = 'rgba(var(--mrl-status-error), 1)';
+        styles.paddingLeft = 'calc(var(--mrl-spacing-02) + var(--mrl-spacing-01)) var(--mrl-spacing-03)';
+        styles['&:hover'] = {
+          backgroundColor: 'var(--mrl-black-opacity-00)',
+          borderColor: 'rgba(var(--mrl-status-error), 1)',
+          color: 'var(--mrl-color-text-selected)'
+        };
+      }
+      if (isReadOnly) {
+        styles.backgroundColor = 'var(--mrl-color-background)';
+      }
+      if (state.selectProps.isMulti) {
+        styles.paddingLeft = 0;
+      }
+      return styles;
+    }
+  });
+}
+
+export { inlineStyles };
+//# sourceMappingURL=inline.js.map

package/dist/esm/components/form/select/styles/inline.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"inline.js","sources":["../../../../../../src/components/form/select/styles/inline.ts"],"sourcesContent":["import { GroupBase, StylesConfig } from 'react-select';\nimport { defaultStyles } from './default';\n\n/**\n * MrlSelect styles object for the inline kind\n *\n * @returns a styles object\n */\nexport function inlineStyles<\n\tT,\n\tIsMulti extends boolean = false,\n\tGroup extends GroupBase<T> = GroupBase<T>\n>(): StylesConfig<T, IsMulti, Group> {\n\treturn {\n\t\t...defaultStyles<T, IsMulti, Group>(),\n\t\tcontainer: (baseStyles) => {\n\t\t\treturn {\n\t\t\t\t...baseStyles,\n\t\t\t\tflexGrow: 1\n\t\t\t};\n\t\t},\n\t\tcontrol: (baseStyles, state) => {\n\t\t\t// eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n\t\t\tconst styles = defaultStyles<T, IsMulti, Group>().control!(baseStyles, state);\n\n\t\t\tconst hasError = state.selectProps['aria-invalid'];\n\t\t\tconst isReadOnly = state.selectProps['aria-readonly'];\n\n\t\t\tstyles.borderColor = 'transparent';\n\t\t\tstyles['&:hover'] = {\n\t\t\t\tbackgroundColor: 'var(--mrl-black-opacity-00)',\n\t\t\t\tborderColor: 'transparent',\n\t\t\t\tcolor: 'var(--mrl-color-text-selected)'\n\t\t\t};\n\n\t\t\tif (state.menuIsOpen) {\n\t\t\t\tstyles.backgroundColor = 'var(--mrl-black-opacity-01)';\n\t\t\t}\n\n\t\t\tif (hasError) {\n\t\t\t\tstyles.borderColor = 'rgba(var(--mrl-status-error), 1)';\n\t\t\t\tstyles.paddingLeft =\n\t\t\t\t\t'calc(var(--mrl-spacing-02) + var(--mrl-spacing-01)) var(--mrl-spacing-03)';\n\t\t\t\tstyles['&:hover'] = {\n\t\t\t\t\tbackgroundColor: 'var(--mrl-black-opacity-00)',\n\t\t\t\t\tborderColor: 'rgba(var(--mrl-status-error), 1)',\n\t\t\t\t\tcolor: 'var(--mrl-color-text-selected)'\n\t\t\t\t};\n\t\t\t}\n\n\t\t\tif (isReadOnly) {\n\t\t\t\tstyles.backgroundColor = 'var(--mrl-color-background)';\n\t\t\t}\n\n\t\t\tif (state.selectProps.isMulti) {\n\t\t\t\tstyles.paddingLeft = 0;\n\t\t\t}\n\n\t\t\treturn styles;\n\t\t}\n\t};\n}\n"],"names":["inlineStyles","_objectSpread","defaultStyles","container","baseStyles","flexGrow","control","state","styles","hasError","selectProps","isReadOnly","borderColor","backgroundColor","color","menuIsOpen","paddingLeft","isMulti"],"mappings":";;;AAGA;AACA;AACA;AACA;AACA;AACO,SAASA,YAAYA,GAIS;AACpC,EAAA,OAAAC,cAAA,CAAAA,cAAA,CAAA,EAAA,EACIC,aAAa,EAAqB,CAAA,EAAA,EAAA,EAAA;AACrCC,IAAAA,SAAS,EAAE,SAAXA,SAASA,CAAGC,UAAU,EAAK;AAC1B,MAAA,OAAAH,cAAA,CAAAA,cAAA,CAAA,EAAA,EACIG,UAAU,CAAA,EAAA,EAAA,EAAA;AACbC,QAAAA,QAAQ,EAAE;AAAC,OAAA,CAAA;IAEb,CAAC;AACDC,IAAAA,OAAO,EAAE,SAATA,OAAOA,CAAGF,UAAU,EAAEG,KAAK,EAAK;AAC/B;MACA,IAAMC,MAAM,GAAGN,aAAa,EAAqB,CAACI,OAAO,CAAEF,UAAU,EAAEG,KAAK,CAAC;AAE7E,MAAA,IAAME,QAAQ,GAAGF,KAAK,CAACG,WAAW,CAAC,cAAc,CAAC;AAClD,MAAA,IAAMC,UAAU,GAAGJ,KAAK,CAACG,WAAW,CAAC,eAAe,CAAC;MAErDF,MAAM,CAACI,WAAW,GAAG,aAAa;MAClCJ,MAAM,CAAC,SAAS,CAAC,GAAG;AACnBK,QAAAA,eAAe,EAAE,6BAA6B;AAC9CD,QAAAA,WAAW,EAAE,aAAa;AAC1BE,QAAAA,KAAK,EAAE;OACP;MAED,IAAIP,KAAK,CAACQ,UAAU,EAAE;QACrBP,MAAM,CAACK,eAAe,GAAG,6BAA6B;AACvD,MAAA;AAEA,MAAA,IAAIJ,QAAQ,EAAE;QACbD,MAAM,CAACI,WAAW,GAAG,kCAAkC;QACvDJ,MAAM,CAACQ,WAAW,GACjB,2EAA2E;QAC5ER,MAAM,CAAC,SAAS,CAAC,GAAG;AACnBK,UAAAA,eAAe,EAAE,6BAA6B;AAC9CD,UAAAA,WAAW,EAAE,kCAAkC;AAC/CE,UAAAA,KAAK,EAAE;SACP;AACF,MAAA;AAEA,MAAA,IAAIH,UAAU,EAAE;QACfH,MAAM,CAACK,eAAe,GAAG,6BAA6B;AACvD,MAAA;AAEA,MAAA,IAAIN,KAAK,CAACG,WAAW,CAACO,OAAO,EAAE;QAC9BT,MAAM,CAACQ,WAAW,GAAG,CAAC;AACvB,MAAA;AAEA,MAAA,OAAOR,MAAM;AACd,IAAA;AAAC,GAAA,CAAA;AAEH;;;;"}

package/dist/esm/components/form/select/styles/inlineNoLabel.js

@@ -0,0 +1,61 @@
+import { objectSpread2 as _objectSpread2 } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { defaultStyles } from './default.js';
+
+/**
+ * MrlSelect styles object for the inline-no-label kind
+ *
+ * @returns a styles object
+ */
+function inlineNoLabelStyles() {
+  return _objectSpread2(_objectSpread2({}, defaultStyles()), {}, {
+    container: function container(baseStyles) {
+      return _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        flexGrow: 1
+      });
+    },
+    control: function control(baseStyles, state) {
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+      var styles = defaultStyles().control(baseStyles, state);
+      var hasError = state.selectProps['aria-invalid'];
+      var isReadOnly = state.selectProps['aria-readonly'];
+      styles.borderColor = 'transparent';
+      styles.color = 'var(--mrl-color-text-label)';
+      styles.fontWeight = 'var(--mrl-font-weight-04)';
+      styles.minHeight = 'var(--mrl-spacing-06)';
+      styles.padding = 'var(--mrl-spacing-03) var(--mrl-space-inset)';
+      styles['&:hover'] = {
+        backgroundColor: 'var(--mrl-black-opacity-00)',
+        borderColor: 'transparent',
+        color: 'var(--mrl-color-text-selected)'
+      };
+      if (state.menuIsOpen) {
+        styles.backgroundColor = 'var(--mrl-black-opacity-01)';
+      }
+      if (hasError) {
+        styles.paddingLeft = 'calc(var(--mrl-spacing-02) + var(--mrl-spacing-01)) var(--mrl-spacing-03)';
+        styles.borderColor = 'rgba(var(--mrl-status-error), 1)';
+        styles['&:hover'] = {
+          backgroundColor: 'var(--mrl-black-opacity-00)',
+          borderColor: 'rgba(var(--mrl-status-error), 1)',
+          color: 'var(--mrl-color-text-selected)'
+        };
+      }
+      if (isReadOnly) {
+        styles.backgroundColor = 'var(--mrl-color-background)';
+      }
+      if (state.selectProps.isMulti) {
+        styles.paddingLeft = 0;
+      }
+      return styles;
+    },
+    valueContainer: function valueContainer(baseStyles) {
+      return _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        minHeight: 'var(--mrl-spacing-06)',
+        padding: 0
+      });
+    }
+  });
+}
+
+export { inlineNoLabelStyles };
+//# sourceMappingURL=inlineNoLabel.js.map

package/dist/esm/components/form/select/styles/inlineNoLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"inlineNoLabel.js","sources":["../../../../../../src/components/form/select/styles/inlineNoLabel.ts"],"sourcesContent":["import { GroupBase, StylesConfig } from 'react-select';\nimport { defaultStyles } from './default';\n\n/**\n * MrlSelect styles object for the inline-no-label kind\n *\n * @returns a styles object\n */\nexport function inlineNoLabelStyles<\n\tT,\n\tIsMulti extends boolean = false,\n\tGroup extends GroupBase<T> = GroupBase<T>\n>(): StylesConfig<T, IsMulti, Group> {\n\treturn {\n\t\t...defaultStyles<T, IsMulti, Group>(),\n\t\tcontainer: (baseStyles) => {\n\t\t\treturn {\n\t\t\t\t...baseStyles,\n\t\t\t\tflexGrow: 1\n\t\t\t};\n\t\t},\n\t\tcontrol: (baseStyles, state) => {\n\t\t\t// eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n\t\t\tconst styles = defaultStyles<T, IsMulti, Group>().control!(baseStyles, state);\n\n\t\t\tconst hasError = state.selectProps['aria-invalid'];\n\t\t\tconst isReadOnly = state.selectProps['aria-readonly'];\n\n\t\t\tstyles.borderColor = 'transparent';\n\t\t\tstyles.color = 'var(--mrl-color-text-label)';\n\t\t\tstyles.fontWeight = 'var(--mrl-font-weight-04)';\n\t\t\tstyles.minHeight = 'var(--mrl-spacing-06)';\n\t\t\tstyles.padding = 'var(--mrl-spacing-03) var(--mrl-space-inset)';\n\t\t\tstyles['&:hover'] = {\n\t\t\t\tbackgroundColor: 'var(--mrl-black-opacity-00)',\n\t\t\t\tborderColor: 'transparent',\n\t\t\t\tcolor: 'var(--mrl-color-text-selected)'\n\t\t\t};\n\n\t\t\tif (state.menuIsOpen) {\n\t\t\t\tstyles.backgroundColor = 'var(--mrl-black-opacity-01)';\n\t\t\t}\n\n\t\t\tif (hasError) {\n\t\t\t\tstyles.paddingLeft =\n\t\t\t\t\t'calc(var(--mrl-spacing-02) + var(--mrl-spacing-01)) var(--mrl-spacing-03)';\n\t\t\t\tstyles.borderColor = 'rgba(var(--mrl-status-error), 1)';\n\t\t\t\tstyles['&:hover'] = {\n\t\t\t\t\tbackgroundColor: 'var(--mrl-black-opacity-00)',\n\t\t\t\t\tborderColor: 'rgba(var(--mrl-status-error), 1)',\n\t\t\t\t\tcolor: 'var(--mrl-color-text-selected)'\n\t\t\t\t};\n\t\t\t}\n\n\t\t\tif (isReadOnly) {\n\t\t\t\tstyles.backgroundColor = 'var(--mrl-color-background)';\n\t\t\t}\n\n\t\t\tif (state.selectProps.isMulti) {\n\t\t\t\tstyles.paddingLeft = 0;\n\t\t\t}\n\n\t\t\treturn styles;\n\t\t},\n\t\tvalueContainer: (baseStyles) => {\n\t\t\treturn {\n\t\t\t\t...baseStyles,\n\t\t\t\tminHeight: 'var(--mrl-spacing-06)',\n\t\t\t\tpadding: 0\n\t\t\t};\n\t\t}\n\t};\n}\n"],"names":["inlineNoLabelStyles","_objectSpread","defaultStyles","container","baseStyles","flexGrow","control","state","styles","hasError","selectProps","isReadOnly","borderColor","color","fontWeight","minHeight","padding","backgroundColor","menuIsOpen","paddingLeft","isMulti","valueContainer"],"mappings":";;;AAGA;AACA;AACA;AACA;AACA;AACO,SAASA,mBAAmBA,GAIE;AACpC,EAAA,OAAAC,cAAA,CAAAA,cAAA,CAAA,EAAA,EACIC,aAAa,EAAqB,CAAA,EAAA,EAAA,EAAA;AACrCC,IAAAA,SAAS,EAAE,SAAXA,SAASA,CAAGC,UAAU,EAAK;AAC1B,MAAA,OAAAH,cAAA,CAAAA,cAAA,CAAA,EAAA,EACIG,UAAU,CAAA,EAAA,EAAA,EAAA;AACbC,QAAAA,QAAQ,EAAE;AAAC,OAAA,CAAA;IAEb,CAAC;AACDC,IAAAA,OAAO,EAAE,SAATA,OAAOA,CAAGF,UAAU,EAAEG,KAAK,EAAK;AAC/B;MACA,IAAMC,MAAM,GAAGN,aAAa,EAAqB,CAACI,OAAO,CAAEF,UAAU,EAAEG,KAAK,CAAC;AAE7E,MAAA,IAAME,QAAQ,GAAGF,KAAK,CAACG,WAAW,CAAC,cAAc,CAAC;AAClD,MAAA,IAAMC,UAAU,GAAGJ,KAAK,CAACG,WAAW,CAAC,eAAe,CAAC;MAErDF,MAAM,CAACI,WAAW,GAAG,aAAa;MAClCJ,MAAM,CAACK,KAAK,GAAG,6BAA6B;MAC5CL,MAAM,CAACM,UAAU,GAAG,2BAA2B;MAC/CN,MAAM,CAACO,SAAS,GAAG,uBAAuB;MAC1CP,MAAM,CAACQ,OAAO,GAAG,8CAA8C;MAC/DR,MAAM,CAAC,SAAS,CAAC,GAAG;AACnBS,QAAAA,eAAe,EAAE,6BAA6B;AAC9CL,QAAAA,WAAW,EAAE,aAAa;AAC1BC,QAAAA,KAAK,EAAE;OACP;MAED,IAAIN,KAAK,CAACW,UAAU,EAAE;QACrBV,MAAM,CAACS,eAAe,GAAG,6BAA6B;AACvD,MAAA;AAEA,MAAA,IAAIR,QAAQ,EAAE;QACbD,MAAM,CAACW,WAAW,GACjB,2EAA2E;QAC5EX,MAAM,CAACI,WAAW,GAAG,kCAAkC;QACvDJ,MAAM,CAAC,SAAS,CAAC,GAAG;AACnBS,UAAAA,eAAe,EAAE,6BAA6B;AAC9CL,UAAAA,WAAW,EAAE,kCAAkC;AAC/CC,UAAAA,KAAK,EAAE;SACP;AACF,MAAA;AAEA,MAAA,IAAIF,UAAU,EAAE;QACfH,MAAM,CAACS,eAAe,GAAG,6BAA6B;AACvD,MAAA;AAEA,MAAA,IAAIV,KAAK,CAACG,WAAW,CAACU,OAAO,EAAE;QAC9BZ,MAAM,CAACW,WAAW,GAAG,CAAC;AACvB,MAAA;AAEA,MAAA,OAAOX,MAAM;IACd,CAAC;AACDa,IAAAA,cAAc,EAAE,SAAhBA,cAAcA,CAAGjB,UAAU,EAAK;AAC/B,MAAA,OAAAH,cAAA,CAAAA,cAAA,CAAA,EAAA,EACIG,UAAU,CAAA,EAAA,EAAA,EAAA;AACbW,QAAAA,SAAS,EAAE,uBAAuB;AAClCC,QAAAA,OAAO,EAAE;AAAC,OAAA,CAAA;AAEZ,IAAA;AAAC,GAAA,CAAA;AAEH;;;;"}

package/dist/esm/components/form/select/styles/inlineStacked.js

@@ -0,0 +1,35 @@
+import { objectSpread2 as _objectSpread2 } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { defaultStyles } from './default.js';
+import { inlineStyles } from './inline.js';
+
+/**
+ * MrlSelect styles object for the inline-stacked kind
+ *
+ * @returns a styles object
+ */
+function inlineStackedStyles() {
+  return _objectSpread2(_objectSpread2({}, defaultStyles()), {}, {
+    control: function control(baseStyles, state) {
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+      var styles = inlineStyles().control(baseStyles, state);
+      var hasError = state.selectProps['aria-invalid'];
+      styles.paddingLeft = 0;
+      styles.transition = 'background-color var(--mrl-duration-03) var(--mrl-timing-m2), padding-left var(--mrl-duration-03) var(--mrl-timing-m2)';
+      styles['&:hover'] = _objectSpread2(_objectSpread2({}, styles['&:hover']), {}, {
+        paddingLeft: 'var(--mrl-space-inset-control-small)'
+      });
+      if (hasError || state.isFocused || state.menuIsOpen) {
+        styles.paddingLeft = 'var(--mrl-space-inset-control-small)';
+      }
+      return styles;
+    },
+    placeholder: function placeholder(baseStyles) {
+      return _objectSpread2(_objectSpread2({}, baseStyles), {}, {
+        marginLeft: 0
+      });
+    }
+  });
+}
+
+export { inlineStackedStyles };
+//# sourceMappingURL=inlineStacked.js.map

package/dist/esm/components/form/select/styles/inlineStacked.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"inlineStacked.js","sources":["../../../../../../src/components/form/select/styles/inlineStacked.ts"],"sourcesContent":["import { CSSObjectWithLabel, GroupBase, StylesConfig } from 'react-select';\nimport { defaultStyles } from './default';\nimport { inlineStyles } from './inline';\n\n/**\n * MrlSelect styles object for the inline-stacked kind\n *\n * @returns a styles object\n */\nexport function inlineStackedStyles<\n\tT,\n\tIsMulti extends boolean = false,\n\tGroup extends GroupBase<T> = GroupBase<T>\n>(): StylesConfig<T, IsMulti, Group> {\n\treturn {\n\t\t...defaultStyles<T, IsMulti, Group>(),\n\t\tcontrol: (baseStyles, state) => {\n\t\t\t// eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n\t\t\tconst styles = inlineStyles<T, IsMulti, Group>().control!(baseStyles, state);\n\t\t\tconst hasError = state.selectProps['aria-invalid'];\n\n\t\t\tstyles.paddingLeft = 0;\n\t\t\tstyles.transition =\n\t\t\t\t'background-color var(--mrl-duration-03) var(--mrl-timing-m2), padding-left var(--mrl-duration-03) var(--mrl-timing-m2)';\n\t\t\tstyles['&:hover'] = {\n\t\t\t\t...(styles['&:hover'] as CSSObjectWithLabel),\n\t\t\t\tpaddingLeft: 'var(--mrl-space-inset-control-small)'\n\t\t\t};\n\n\t\t\tif (hasError || state.isFocused || state.menuIsOpen) {\n\t\t\t\tstyles.paddingLeft = 'var(--mrl-space-inset-control-small)';\n\t\t\t}\n\n\t\t\treturn styles;\n\t\t},\n\t\tplaceholder: (baseStyles) => {\n\t\t\treturn {\n\t\t\t\t...baseStyles,\n\t\t\t\tmarginLeft: 0\n\t\t\t};\n\t\t}\n\t};\n}\n"],"names":["inlineStackedStyles","_objectSpread","defaultStyles","control","baseStyles","state","styles","inlineStyles","hasError","selectProps","paddingLeft","transition","isFocused","menuIsOpen","placeholder","marginLeft"],"mappings":";;;;AAIA;AACA;AACA;AACA;AACA;AACO,SAASA,mBAAmBA,GAIE;AACpC,EAAA,OAAAC,cAAA,CAAAA,cAAA,CAAA,EAAA,EACIC,aAAa,EAAqB,CAAA,EAAA,EAAA,EAAA;AACrCC,IAAAA,OAAO,EAAE,SAATA,OAAOA,CAAGC,UAAU,EAAEC,KAAK,EAAK;AAC/B;MACA,IAAMC,MAAM,GAAGC,YAAY,EAAqB,CAACJ,OAAO,CAAEC,UAAU,EAAEC,KAAK,CAAC;AAC5E,MAAA,IAAMG,QAAQ,GAAGH,KAAK,CAACI,WAAW,CAAC,cAAc,CAAC;MAElDH,MAAM,CAACI,WAAW,GAAG,CAAC;MACtBJ,MAAM,CAACK,UAAU,GAChB,wHAAwH;MACzHL,MAAM,CAAC,SAAS,CAAC,GAAAL,cAAA,CAAAA,cAAA,CAAA,EAAA,EACZK,MAAM,CAAC,SAAS,CAAC,CAAA,EAAA,EAAA,EAAA;AACrBI,QAAAA,WAAW,EAAE;OAAsC,CACnD;MAED,IAAIF,QAAQ,IAAIH,KAAK,CAACO,SAAS,IAAIP,KAAK,CAACQ,UAAU,EAAE;QACpDP,MAAM,CAACI,WAAW,GAAG,sCAAsC;AAC5D,MAAA;AAEA,MAAA,OAAOJ,MAAM;IACd,CAAC;AACDQ,IAAAA,WAAW,EAAE,SAAbA,WAAWA,CAAGV,UAAU,EAAK;AAC5B,MAAA,OAAAH,cAAA,CAAAA,cAAA,CAAA,EAAA,EACIG,UAAU,CAAA,EAAA,EAAA,EAAA;AACbW,QAAAA,UAAU,EAAE;AAAC,OAAA,CAAA;AAEf,IAAA;AAAC,GAAA,CAAA;AAEH;;;;"}

package/dist/esm/components/form/select/utils/closeMenuOnScroll.js

@@ -0,0 +1,22 @@
+/**
+ * Evaluates the scroll event target with a given class name to prevent closing the select menu when
+ * it renders inside a scrollable container.
+ * if the scroll event target contains the provided class, the function return `false` to keep the menu open.
+ * In most scenarios, `className` will be the class name of the select menu list.
+ *
+ * @param  className - The class name to check against the target element's class list.
+ * @returns An event handler function that takes an event as an argument
+ */
+function closeMenuOnScroll(className) {
+  return function (e) {
+    e.stopPropagation();
+    var el = e.target;
+    if (el && el.classList && typeof el.classList.contains === 'function') {
+      return !el.classList.contains(className);
+    }
+    return true;
+  };
+}
+
+export { closeMenuOnScroll };
+//# sourceMappingURL=closeMenuOnScroll.js.map

package/dist/esm/components/form/select/utils/closeMenuOnScroll.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"closeMenuOnScroll.js","sources":["../../../../../../src/components/form/select/utils/closeMenuOnScroll.ts"],"sourcesContent":["/**\n * Evaluates the scroll event target with a given class name to prevent closing the select menu when\n * it renders inside a scrollable container.\n * if the scroll event target contains the provided class, the function return `false` to keep the menu open.\n * In most scenarios, `className` will be the class name of the select menu list.\n *\n * @param  className - The class name to check against the target element's class list.\n * @returns An event handler function that takes an event as an argument\n */\nexport function closeMenuOnScroll(className: string): (e: Event) => boolean {\n\treturn function (e: Event): boolean {\n\t\te.stopPropagation();\n\t\tconst el = e.target as HTMLElement;\n\t\tif (el && el.classList && typeof el.classList.contains === 'function') {\n\t\t\treturn !el.classList.contains(className);\n\t\t}\n\t\treturn true;\n\t};\n}\n"],"names":["closeMenuOnScroll","className","e","stopPropagation","el","target","classList","contains"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,iBAAiBA,CAACC,SAAiB,EAAyB;EAC3E,OAAO,UAAUC,CAAQ,EAAW;IACnCA,CAAC,CAACC,eAAe,EAAE;AACnB,IAAA,IAAMC,EAAE,GAAGF,CAAC,CAACG,MAAqB;AAClC,IAAA,IAAID,EAAE,IAAIA,EAAE,CAACE,SAAS,IAAI,OAAOF,EAAE,CAACE,SAAS,CAACC,QAAQ,KAAK,UAAU,EAAE;MACtE,OAAO,CAACH,EAAE,CAACE,SAAS,CAACC,QAAQ,CAACN,SAAS,CAAC;AACzC,IAAA;AACA,IAAA,OAAO,IAAI;EACZ,CAAC;AACF;;;;"}

package/dist/esm/components/form/switch/MrlSwitch/MrlSwitch.js

@@ -0,0 +1,37 @@
+import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, extends as _extends } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
+import * as React from 'react';
+import { memo, useMemo } from 'react';
+import classnames from 'classnames';
+import styles from './MrlSwitch.module.scss.js';
+import { getUniqueId } from '../../../../utils/setAttributes/setAttributes.js';
+import { MrlSwitchStandalone } from '../MrlSwitchStandalone/MrlSwitchStandalone.js';
+
+var _excluded = ["className", "disabled", "id", "label", "onChange", "selected"];
+var MrlSwitch = /*#__PURE__*/memo(function (_ref) {
+  var className = _ref.className,
+    disabled = _ref.disabled,
+    _ref$id = _ref.id,
+    id = _ref$id === void 0 ? undefined : _ref$id,
+    label = _ref.label,
+    onChange = _ref.onChange,
+    _ref$selected = _ref.selected,
+    selected = _ref$selected === void 0 ? false : _ref$selected,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var inputId = useMemo(function () {
+    return id || getUniqueId('mrl-toggle-');
+  }, [id]);
+  var textOnlyLabel = typeof label === 'string';
+  var containerClasses = classnames('MrlSwitch', styles['MrlSwitch'], className, _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, 'mrl-label', textOnlyLabel), styles['MrlLabel'], textOnlyLabel), 'MrlSwitch-disabled', disabled), styles['MrlSwitch-disabled'], disabled));
+  return /*#__PURE__*/React.createElement("label", {
+    className: containerClasses
+  }, label, /*#__PURE__*/React.createElement(MrlSwitchStandalone, _extends({}, rest, {
+    disabled: disabled,
+    id: inputId,
+    onChange: onChange,
+    selected: selected
+  })));
+});
+MrlSwitch.displayName = 'MrlSwitch';
+
+export { MrlSwitch };
+//# sourceMappingURL=MrlSwitch.js.map

package/dist/esm/components/form/switch/MrlSwitch/MrlSwitch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MrlSwitch.js","sources":["../../../../../../src/components/form/switch/MrlSwitch/MrlSwitch.tsx"],"sourcesContent":["import * as React from 'react';\nimport classnames from 'classnames';\nimport { memo, useMemo } from 'react';\nimport { MrlSwitchStandalone } from '../../..';\nimport { getUniqueId } from '../../../../utils';\n\nimport styles from './MrlSwitch.module.scss';\n\ninterface MrlSwitchProps extends React.ComponentPropsWithoutRef<'input'> {\n\tclassName?: string;\n\tdisabled?: boolean;\n\tid?: string;\n\t/**\n\t * The `label` is best used as a string, which will style according to MrlLabel styles.\n\t * If you need custom styles, you can use `className` or use a span that you style as `label`\n\t */\n\tlabel: string | React.ReactNode;\n\tonChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n\tselected?: boolean;\n}\n\nexport const MrlSwitch = memo(\n\t({\n\t\tclassName,\n\t\tdisabled,\n\t\tid = undefined,\n\t\tlabel,\n\t\tonChange,\n\t\tselected = false,\n\t\t...rest\n\t}: MrlSwitchProps) => {\n\t\tconst inputId = useMemo(() => id || getUniqueId('mrl-toggle-'), [id]);\n\t\tconst textOnlyLabel = typeof label === 'string';\n\t\tconst containerClasses = classnames('MrlSwitch', styles['MrlSwitch'], className, {\n\t\t\t['mrl-label']: textOnlyLabel,\n\t\t\t[styles['MrlLabel']]: textOnlyLabel,\n\t\t\t['MrlSwitch-disabled']: disabled,\n\t\t\t[styles['MrlSwitch-disabled']]: disabled\n\t\t});\n\n\t\treturn (\n\t\t\t<label className={containerClasses}>\n\t\t\t\t{label}\n\t\t\t\t<MrlSwitchStandalone\n\t\t\t\t\t{...rest}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\tid={inputId}\n\t\t\t\t\tonChange={onChange}\n\t\t\t\t\tselected={selected}\n\t\t\t\t/>\n\t\t\t</label>\n\t\t);\n\t}\n);\n\nMrlSwitch.displayName = 'MrlSwitch';\n"],"names":["MrlSwitch","memo","_ref","className","disabled","_ref$id","id","undefined","label","onChange","_ref$selected","selected","rest","_objectWithoutProperties","_excluded","inputId","useMemo","getUniqueId","textOnlyLabel","containerClasses","classnames","styles","_defineProperty","React","createElement","MrlSwitchStandalone","_extends","displayName"],"mappings":";;;;;;;;;IAqBaA,SAAS,gBAAGC,IAAI,CAC5B,UAAAC,IAAA,EAQsB;AAAA,EAAA,IAPrBC,SAAS,GAAAD,IAAA,CAATC,SAAS;IACTC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IAAAC,OAAA,GAAAH,IAAA,CACRI,EAAE;AAAFA,IAAAA,EAAE,GAAAD,OAAA,KAAA,MAAA,GAAGE,SAAS,GAAAF,OAAA;IACdG,KAAK,GAAAN,IAAA,CAALM,KAAK;IACLC,QAAQ,GAAAP,IAAA,CAARO,QAAQ;IAAAC,aAAA,GAAAR,IAAA,CACRS,QAAQ;AAARA,IAAAA,QAAQ,GAAAD,aAAA,KAAA,MAAA,GAAG,KAAK,GAAAA,aAAA;AACbE,IAAAA,IAAI,GAAAC,wBAAA,CAAAX,IAAA,EAAAY,SAAA,CAAA;EAEP,IAAMC,OAAO,GAAGC,OAAO,CAAC,YAAA;AAAA,IAAA,OAAMV,EAAE,IAAIW,WAAW,CAAC,aAAa,CAAC;EAAA,CAAA,EAAE,CAACX,EAAE,CAAC,CAAC;AACrE,EAAA,IAAMY,aAAa,GAAG,OAAOV,KAAK,KAAK,QAAQ;AAC/C,EAAA,IAAMW,gBAAgB,GAAGC,UAAU,CAAC,WAAW,EAAEC,MAAM,CAAC,WAAW,CAAC,EAAElB,SAAS,EAAAmB,eAAA,CAAAA,eAAA,CAAAA,eAAA,CAAAA,eAAA,CAAA,EAAA,EAC7E,WAAW,EAAGJ,aAAa,GAC3BG,MAAM,CAAC,UAAU,CAAC,EAAGH,aAAa,CAAA,EAClC,oBAAoB,EAAGd,QAAQ,CAAA,EAC/BiB,MAAM,CAAC,oBAAoB,CAAC,EAAGjB,QAAQ,CACxC,CAAC;EAEF,oBACCmB,KAAA,CAAAC,aAAA,CAAA,OAAA,EAAA;AAAOrB,IAAAA,SAAS,EAAEgB;GAAiB,EACjCX,KAAK,eACNe,KAAA,CAAAC,aAAA,CAACC,mBAAmB,EAAAC,QAAA,CAAA,EAAA,EACfd,IAAI,EAAA;AACRR,IAAAA,QAAQ,EAAEA,QAAS;AACnBE,IAAAA,EAAE,EAAES,OAAQ;AACZN,IAAAA,QAAQ,EAAEA,QAAS;AACnBE,IAAAA,QAAQ,EAAEA;AAAS,GAAA,CACnB,CACK,CAAC;AAEV,CACD;AAEAX,SAAS,CAAC2B,WAAW,GAAG,WAAW;;;;"}

package/dist/esm/components/form/switch/MrlSwitch/MrlSwitch.module.scss.js

@@ -0,0 +1,4 @@
+var styles = {"MrlLabel":"MrlLabel--kpDDL","MrlSwitch":"MrlSwitch--XCL5G","MrlSwitch-disabled":"MrlSwitch-disabled--iS1ZX"};
+
+export { styles as default };
+//# sourceMappingURL=MrlSwitch.module.scss.js.map