@artsy/palette 44.0.1 → 44.2.0

package/dist/elements/SelectInput/SelectInput.story.js

@@ -3,10 +3,10 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.LoadingDisplayTest = exports.Default = exports.CurrencySelect = void 0;
+exports.default = exports.WithoutSearch = exports.WithoutLabel = exports.WithPlaceholder = exports.WithError = exports.Required = exports.LoadingDisplayTest = exports.Disabled = exports.Default = exports.CustomSelectWidth = exports.CustomOptionTextWidth = exports.CurrencyWithSearch = exports.CurrencyWithPlaceholder = exports.CurrencySelect = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _storybookStates = require("storybook-states");
 var _SelectInput = require("./SelectInput");
+var _storybookBlocklist = require("../../utils/storybookBlocklist");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -14,8 +14,21 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 var _default = exports.default = {
-  title: "Components/SelectInput"
+  component: _SelectInput.SelectInput,
+  title: "Components/SelectInput",
+  tags: ["autodocs"],
+  parameters: {
+    docs: {
+      description: {
+        component: "A composite input component that combines a dropdown selector with a text input, commonly used for phone numbers with country codes."
+      }
+    },
+    controls: {
+      exclude: _storybookBlocklist.STORYBOOK_PROPS_BLOCKLIST
+    }
+  }
 };
 var countriesExample = [{
   text: "🇦🇫 +93",
@@ -186,44 +199,225 @@ var countriesExample = [{
   countryCode: "+387",
   flag: "🇧🇦"
 }];
-var Default = exports.Default = function Default() {
-  return /*#__PURE__*/_react.default.createElement(_storybookStates.States, {
-    states: [{}, {
-      placeholder: "(000) 000 0000"
-    }, {
-      placeholder: "(000) 000 0000",
-      enableSearch: false
-    }, {
-      placeholder: "(000) 000 0000",
-      label: undefined
-    }, {
-      placeholder: "(000) 000 0000",
-      required: true
-    }, {
-      placeholder: "(000) 000 0000",
-      disabled: true
-    }, {
-      placeholder: "(000) 000 0000",
-      selectWidth: 100
-    }, {
-      placeholder: "(000) 000 0000",
-      optionTextMinWidth: "20ch"
-    }, {
-      placeholder: "(000) 000 0000",
-      error: "Something is wrong"
-    }]
-  }, /*#__PURE__*/_react.default.createElement(_SelectInput.SelectInput, {
+var Default = exports.Default = {
+  args: {
     options: countriesExample,
-    onSelect: function onSelect(option) {
-      return console.log(option);
-    },
     label: "Phone number",
     type: "tel",
     autoComplete: "tel-national",
     enableSearch: true
-  }));
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_react.default.createElement(_SelectInput.SelectInput, _extends({}, args, {
+      onSelect: function onSelect(option) {
+        return console.log(option);
+      }
+    }));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Basic SelectInput with search enabled."
+      }
+    }
+  }
+};
+var WithPlaceholder = exports.WithPlaceholder = {
+  args: {
+    options: countriesExample,
+    label: "Phone number",
+    type: "tel",
+    autoComplete: "tel-national",
+    enableSearch: true,
+    placeholder: "(000) 000 0000"
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_react.default.createElement(_SelectInput.SelectInput, _extends({}, args, {
+      onSelect: function onSelect(option) {
+        return console.log(option);
+      }
+    }));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "SelectInput with placeholder text."
+      }
+    }
+  }
+};
+var WithoutSearch = exports.WithoutSearch = {
+  args: {
+    options: countriesExample,
+    label: "Phone number",
+    type: "tel",
+    autoComplete: "tel-national",
+    enableSearch: false,
+    placeholder: "(000) 000 0000"
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_react.default.createElement(_SelectInput.SelectInput, _extends({}, args, {
+      onSelect: function onSelect(option) {
+        return console.log(option);
+      }
+    }));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "SelectInput without search functionality."
+      }
+    }
+  }
+};
+var WithoutLabel = exports.WithoutLabel = {
+  args: {
+    options: countriesExample,
+    type: "tel",
+    autoComplete: "tel-national",
+    enableSearch: true,
+    placeholder: "(000) 000 0000"
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_react.default.createElement(_SelectInput.SelectInput, _extends({}, args, {
+      onSelect: function onSelect(option) {
+        return console.log(option);
+      }
+    }));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "SelectInput without a label."
+      }
+    }
+  }
+};
+var Required = exports.Required = {
+  args: {
+    options: countriesExample,
+    label: "Phone number",
+    type: "tel",
+    autoComplete: "tel-national",
+    enableSearch: true,
+    placeholder: "(000) 000 0000",
+    required: true
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_react.default.createElement(_SelectInput.SelectInput, _extends({}, args, {
+      onSelect: function onSelect(option) {
+        return console.log(option);
+      }
+    }));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Required SelectInput with validation indicator."
+      }
+    }
+  }
+};
+var Disabled = exports.Disabled = {
+  args: {
+    options: countriesExample,
+    label: "Phone number",
+    type: "tel",
+    autoComplete: "tel-national",
+    enableSearch: true,
+    placeholder: "(000) 000 0000",
+    disabled: true
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_react.default.createElement(_SelectInput.SelectInput, _extends({}, args, {
+      onSelect: function onSelect(option) {
+        return console.log(option);
+      }
+    }));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Disabled SelectInput."
+      }
+    }
+  }
+};
+var CustomSelectWidth = exports.CustomSelectWidth = {
+  args: {
+    options: countriesExample,
+    label: "Phone number",
+    type: "tel",
+    autoComplete: "tel-national",
+    enableSearch: true,
+    placeholder: "(000) 000 0000",
+    selectWidth: 100
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_react.default.createElement(_SelectInput.SelectInput, _extends({}, args, {
+      onSelect: function onSelect(option) {
+        return console.log(option);
+      }
+    }));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "SelectInput with custom select dropdown width."
+      }
+    }
+  }
+};
+var CustomOptionTextWidth = exports.CustomOptionTextWidth = {
+  args: {
+    options: countriesExample,
+    label: "Phone number",
+    type: "tel",
+    autoComplete: "tel-national",
+    enableSearch: true,
+    placeholder: "(000) 000 0000",
+    optionTextMinWidth: "20ch"
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_react.default.createElement(_SelectInput.SelectInput, _extends({}, args, {
+      onSelect: function onSelect(option) {
+        return console.log(option);
+      }
+    }));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "SelectInput with custom minimum width for option text."
+      }
+    }
+  }
+};
+var WithError = exports.WithError = {
+  args: {
+    options: countriesExample,
+    label: "Phone number",
+    type: "tel",
+    autoComplete: "tel-national",
+    enableSearch: true,
+    placeholder: "(000) 000 0000",
+    error: "Something is wrong"
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_react.default.createElement(_SelectInput.SelectInput, _extends({}, args, {
+      onSelect: function onSelect(option) {
+        return console.log(option);
+      }
+    }));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "SelectInput with error state."
+      }
+    }
+  }
 };
-Default.displayName = "Default";
 var currencyOptions = [{
   text: "USD",
   name: "US Dollar",
@@ -245,75 +439,129 @@ var currencyOptions = [{
   name: "Swiss Franc",
   value: "chf"
 }];
-var CurrencySelect = exports.CurrencySelect = function CurrencySelect() {
-  return /*#__PURE__*/_react.default.createElement(_storybookStates.States, {
-    states: [{}, {
-      placeholder: "Currency"
-    }, {
-      placeholder: "Currency",
-      enableSearch: true
-    }, {
-      placeholder: "Currency"
-    }, {
-      placeholder: "Currency"
-    }]
-  }, /*#__PURE__*/_react.default.createElement(_SelectInput.SelectInput, {
+var CurrencySelect = exports.CurrencySelect = {
+  args: {
     options: currencyOptions,
-    onSelect: function onSelect(option) {
-      return console.log(option);
-    },
     label: "Currency",
     selectWidth: 70,
     optionTextMinWidth: "5ch"
-  }));
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_react.default.createElement(_SelectInput.SelectInput, _extends({}, args, {
+      onSelect: function onSelect(option) {
+        return console.log(option);
+      }
+    }));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Currency select input with custom width settings."
+      }
+    }
+  }
 };
-CurrencySelect.displayName = "CurrencySelect";
-var LoadingDisplayTest = exports.LoadingDisplayTest = function LoadingDisplayTest() {
-  var _React$useState = _react.default.useState(false),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    isLoaded = _React$useState2[0],
-    setIsLoaded = _React$useState2[1];
-  var _React$useState3 = _react.default.useState("ad"),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    countryCode = _React$useState4[0],
-    setCountryCode = _React$useState4[1];
-  var _React$useState5 = _react.default.useState(""),
-    _React$useState6 = _slicedToArray(_React$useState5, 2),
-    phoneNumber = _React$useState6[0],
-    setPhoneNumber = _React$useState6[1];
-  _react.default.useEffect(function () {
-    var timer = setTimeout(function () {
-      setIsLoaded(true);
-    }, 500);
-    return function () {
-      return clearTimeout(timer);
-    };
-  }, []);
-  return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      display: isLoaded ? "grid" : "none",
-      marginTop: "16px"
+var CurrencyWithPlaceholder = exports.CurrencyWithPlaceholder = {
+  args: {
+    options: currencyOptions,
+    label: "Currency",
+    selectWidth: 70,
+    optionTextMinWidth: "5ch",
+    placeholder: "Currency"
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_react.default.createElement(_SelectInput.SelectInput, _extends({}, args, {
+      onSelect: function onSelect(option) {
+        return console.log(option);
+      }
+    }));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Currency select with placeholder text."
+      }
     }
-  }, /*#__PURE__*/_react.default.createElement(_SelectInput.SelectInput, {
-    key: "loading-test-phone-input",
-    name: "phoneNumber",
-    placeholder: "(000) 000 0000",
-    options: countriesExample,
-    onSelect: function onSelect(option) {
-      console.log("Selected:", option);
-      setCountryCode(option.value);
-    },
-    dropdownValue: countryCode,
-    label: "Phone number",
-    type: "tel",
-    autoComplete: "tel-national",
-    inputValue: phoneNumber,
-    onChange: function onChange(e) {
-      return setPhoneNumber(e.target.value);
-    },
-    "data-testid": "LoadingTestSelectInput",
-    required: true
-  })), !isLoaded && /*#__PURE__*/_react.default.createElement("div", null, "Loading phone input..."));
+  }
+};
+var CurrencyWithSearch = exports.CurrencyWithSearch = {
+  args: {
+    options: currencyOptions,
+    label: "Currency",
+    selectWidth: 70,
+    optionTextMinWidth: "5ch",
+    placeholder: "Currency",
+    enableSearch: true
+  },
+  render: function render(args) {
+    return /*#__PURE__*/_react.default.createElement(_SelectInput.SelectInput, _extends({}, args, {
+      onSelect: function onSelect(option) {
+        return console.log(option);
+      }
+    }));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Currency select with search enabled."
+      }
+    }
+  }
+};
+var LoadingDisplayTest = exports.LoadingDisplayTest = {
+  render: function render() {
+    var _React$useState = _react.default.useState(false),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      isLoaded = _React$useState2[0],
+      setIsLoaded = _React$useState2[1];
+    var _React$useState3 = _react.default.useState("ad"),
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      countryCode = _React$useState4[0],
+      setCountryCode = _React$useState4[1];
+    var _React$useState5 = _react.default.useState(""),
+      _React$useState6 = _slicedToArray(_React$useState5, 2),
+      phoneNumber = _React$useState6[0],
+      setPhoneNumber = _React$useState6[1];
+    _react.default.useEffect(function () {
+      var timer = setTimeout(function () {
+        setIsLoaded(true);
+      }, 500);
+      return function () {
+        return clearTimeout(timer);
+      };
+    }, []);
+    return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", {
+      style: {
+        display: isLoaded ? "grid" : "none",
+        marginTop: "16px"
+      }
+    }, /*#__PURE__*/_react.default.createElement(_SelectInput.SelectInput, {
+      key: "loading-test-phone-input",
+      name: "phoneNumber",
+      placeholder: "(000) 000 0000",
+      options: countriesExample,
+      onSelect: function onSelect(option) {
+        console.log("Selected:", option);
+        setCountryCode(option.value);
+      },
+      dropdownValue: countryCode,
+      label: "Phone number",
+      type: "tel",
+      autoComplete: "tel-national",
+      inputValue: phoneNumber,
+      onChange: function onChange(e) {
+        return setPhoneNumber(e.target.value);
+      },
+      "data-testid": "LoadingTestSelectInput",
+      required: true
+    })), !isLoaded && /*#__PURE__*/_react.default.createElement("div", null, "Loading phone input..."));
+  },
+  parameters: {
+    docs: {
+      description: {
+        story: "Test loading state for SelectInput."
+      }
+    }
+  }
 };
-LoadingDisplayTest.displayName = "LoadingDisplayTest";
 //# sourceMappingURL=SelectInput.story.js.map

package/dist/elements/SelectInput/SelectInput.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectInput.story.js","names":["_react","_interopRequireDefault","require","_storybookStates","_SelectInput","obj","__esModule","default","_slicedToArray","arr","i","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","Object","prototype","toString","call","slice","constructor","name","Array","from","test","len","length","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_default","exports","title","countriesExample","text","countryCode","flag","Default","createElement","States","states","placeholder","enableSearch","label","undefined","required","disabled","selectWidth","optionTextMinWidth","error","SelectInput","options","onSelect","option","console","log","type","autoComplete","displayName","currencyOptions","CurrencySelect","LoadingDisplayTest","_React$useState","React","useState","_React$useState2","isLoaded","setIsLoaded","_React$useState3","_React$useState4","setCountryCode","_React$useState5","_React$useState6","phoneNumber","setPhoneNumber","useEffect","timer","setTimeout","clearTimeout","style","display","marginTop","key","dropdownValue","inputValue","onChange","e","target"],"sources":["../../../src/elements/SelectInput/SelectInput.story.tsx"],"sourcesContent":["import React from \"react\"\nimport { States } from \"storybook-states\"\nimport { SelectInput, SelectInputProps } from \"./SelectInput\"\n\nexport default {\n  title: \"Components/SelectInput\",\n}\n\nconst countriesExample = [\n  {\n    text: \"🇦🇫 +93\",\n    name: \"Afghanistan\",\n    value: \"af\",\n    countryCode: \"+93\",\n    flag: \"🇦🇫\",\n  },\n  {\n    text: \"🇦🇽 +358\",\n    name: \"Aland Islands\",\n    value: \"ax\",\n    countryCode: \"+358\",\n    flag: \"🇦🇽\",\n  },\n  {\n    text: \"🇦🇱 +355\",\n    name: \"Albania\",\n    value: \"al\",\n    countryCode: \"+355\",\n    flag: \"🇦🇱\",\n  },\n  {\n    text: \"🇩🇿 +213\",\n    name: \"Algeria\",\n    value: \"dz\",\n    countryCode: \"+213\",\n    flag: \"🇩🇿\",\n  },\n  {\n    text: \"🇦🇸 +1684\",\n    name: \"American Samoa\",\n    value: \"as\",\n    countryCode: \"+1684\",\n    flag: \"🇦🇸\",\n  },\n  {\n    text: \"🇦🇩 +376\",\n    name: \"Andorra\",\n    value: \"ad\",\n    countryCode: \"+376\",\n    flag: \"🇦🇩\",\n  },\n  {\n    text: \"🇦🇴 +244\",\n    name: \"Angola\",\n    value: \"ao\",\n    countryCode: \"+244\",\n    flag: \"🇦🇴\",\n  },\n  {\n    text: \"🇦🇮 +1264\",\n    name: \"Anguilla\",\n    value: \"ai\",\n    countryCode: \"+1264\",\n    flag: \"🇦🇮\",\n  },\n  {\n    text: \"🇦🇶 +672\",\n    name: \"Antarctica\",\n    value: \"aq\",\n    countryCode: \"+672\",\n    flag: \"🇦🇶\",\n  },\n  {\n    text: \"🇦🇬 +1268\",\n    name: \"Antigua and Barbuda\",\n    value: \"ag\",\n    countryCode: \"+1268\",\n    flag: \"🇦🇬\",\n  },\n  {\n    text: \"🇦🇷 +54\",\n    name: \"Argentina\",\n    value: \"ar\",\n    countryCode: \"+54\",\n    flag: \"🇦🇷\",\n  },\n  {\n    text: \"🇦🇲 +374\",\n    name: \"Armenia\",\n    value: \"am\",\n    countryCode: \"+374\",\n    flag: \"🇦🇲\",\n  },\n  {\n    text: \"🇦🇼 +297\",\n    name: \"Aruba\",\n    value: \"aw\",\n    countryCode: \"+297\",\n    flag: \"🇦🇼\",\n  },\n  {\n    text: \"🇦🇺 +61\",\n    name: \"Australia\",\n    value: \"au\",\n    countryCode: \"+61\",\n    flag: \"🇦🇺\",\n  },\n  {\n    text: \"🇦🇹 +43\",\n    name: \"Austria\",\n    value: \"at\",\n    countryCode: \"+43\",\n    flag: \"🇦🇹\",\n  },\n  {\n    text: \"🇦🇿 +994\",\n    name: \"Azerbaijan\",\n    value: \"az\",\n    countryCode: \"+994\",\n    flag: \"🇦🇿\",\n  },\n  {\n    text: \"🇧🇸 +1242\",\n    name: \"Bahamas\",\n    value: \"bs\",\n    countryCode: \"+1242\",\n    flag: \"🇧🇸\",\n  },\n  {\n    text: \"🇧🇭 +973\",\n    name: \"Bahrain\",\n    value: \"bh\",\n    countryCode: \"+973\",\n    flag: \"🇧🇭\",\n  },\n  {\n    text: \"🇧🇩 +880\",\n    name: \"Bangladesh\",\n    value: \"bd\",\n    countryCode: \"+880\",\n    flag: \"🇧🇩\",\n  },\n  {\n    text: \"🇧🇧 +1246\",\n    name: \"Barbados\",\n    value: \"bb\",\n    countryCode: \"+1246\",\n    flag: \"🇧🇧\",\n  },\n  {\n    text: \"🇧🇾 +375\",\n    name: \"Belarus\",\n    value: \"by\",\n    countryCode: \"+375\",\n    flag: \"🇧🇾\",\n  },\n  {\n    text: \"🇧🇪 +32\",\n    name: \"Belgium\",\n    value: \"be\",\n    countryCode: \"+32\",\n    flag: \"🇧🇪\",\n  },\n  {\n    text: \"🇧🇿 +501\",\n    name: \"Belize\",\n    value: \"bz\",\n    countryCode: \"+501\",\n    flag: \"🇧🇿\",\n  },\n  {\n    text: \"🇧🇯 +229\",\n    name: \"Benin\",\n    value: \"bj\",\n    countryCode: \"+229\",\n    flag: \"🇧🇯\",\n  },\n  {\n    text: \"🇧🇲 +1441\",\n    name: \"Bermuda\",\n    value: \"bm\",\n    countryCode: \"+1441\",\n    flag: \"🇧🇲\",\n  },\n  {\n    text: \"🇧🇹 +975\",\n    name: \"Bhutan\",\n    value: \"bt\",\n    countryCode: \"+975\",\n    flag: \"🇧🇹\",\n  },\n  {\n    text: \"🇧🇴 +591\",\n    name: \"Bolivia\",\n    value: \"bo\",\n    countryCode: \"+591\",\n    flag: \"🇧🇴\",\n  },\n  {\n    text: \"🇧🇦 +387\",\n    name: \"Bosnia and Herzegovina\",\n    value: \"ba\",\n    countryCode: \"+387\",\n    flag: \"🇧🇦\",\n  },\n]\n\nexport const Default = () => {\n  return (\n    <States<Partial<SelectInputProps>>\n      states={[\n        {},\n        { placeholder: \"(000) 000 0000\" },\n        { placeholder: \"(000) 000 0000\", enableSearch: false },\n        { placeholder: \"(000) 000 0000\", label: undefined },\n        { placeholder: \"(000) 000 0000\", required: true },\n        { placeholder: \"(000) 000 0000\", disabled: true },\n        { placeholder: \"(000) 000 0000\", selectWidth: 100 },\n        { placeholder: \"(000) 000 0000\", optionTextMinWidth: \"20ch\" },\n        { placeholder: \"(000) 000 0000\", error: \"Something is wrong\" },\n      ]}\n    >\n      <SelectInput\n        options={countriesExample}\n        onSelect={(option) => console.log(option)}\n        label=\"Phone number\"\n        type=\"tel\"\n        autoComplete=\"tel-national\"\n        enableSearch\n      />\n    </States>\n  )\n}\n\nconst currencyOptions = [\n  {\n    text: \"USD\",\n    name: \"US Dollar\",\n    value: \"usd\",\n  },\n  {\n    text: \"EUR\",\n    name: \"Euro\",\n    value: \"eur\",\n  },\n  {\n    text: \"GBP\",\n    name: \"British Pound\",\n    value: \"gbp\",\n  },\n  {\n    text: \"JPY\",\n    name: \"Japanese Yen\",\n    value: \"jpy\",\n  },\n  {\n    text: \"CHF\",\n    name: \"Swiss Franc\",\n    value: \"chf\",\n  },\n]\n\nexport const CurrencySelect = () => {\n  return (\n    <States<Partial<SelectInputProps>>\n      states={[\n        {},\n        { placeholder: \"Currency\" },\n        { placeholder: \"Currency\", enableSearch: true },\n        { placeholder: \"Currency\" },\n        { placeholder: \"Currency\" },\n      ]}\n    >\n      <SelectInput\n        options={currencyOptions}\n        onSelect={(option) => console.log(option)}\n        label=\"Currency\"\n        selectWidth={70}\n        optionTextMinWidth=\"5ch\"\n      />\n    </States>\n  )\n}\n\nexport const LoadingDisplayTest = () => {\n  const [isLoaded, setIsLoaded] = React.useState(false)\n  const [countryCode, setCountryCode] = React.useState(\"ad\")\n  const [phoneNumber, setPhoneNumber] = React.useState(\"\")\n\n  React.useEffect(() => {\n    const timer = setTimeout(() => {\n      setIsLoaded(true)\n    }, 500)\n    return () => clearTimeout(timer)\n  }, [])\n\n  return (\n    <div>\n      <div\n        style={{\n          display: isLoaded ? \"grid\" : \"none\",\n          marginTop: \"16px\",\n        }}\n      >\n        <SelectInput\n          key=\"loading-test-phone-input\"\n          name=\"phoneNumber\"\n          placeholder=\"(000) 000 0000\"\n          options={countriesExample}\n          onSelect={(option) => {\n            console.log(\"Selected:\", option)\n            setCountryCode(option.value)\n          }}\n          dropdownValue={countryCode}\n          label=\"Phone number\"\n          type=\"tel\"\n          autoComplete=\"tel-national\"\n          inputValue={phoneNumber}\n          onChange={(e) => setPhoneNumber(e.target.value)}\n          data-testid=\"LoadingTestSelectInput\"\n          required\n        />\n      </div>\n      {!isLoaded && <div>Loading phone input...</div>}\n    </div>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"SelectInput.story.js","names":["_react","_interopRequireDefault","require","_SelectInput","_storybookBlocklist","obj","__esModule","default","_slicedToArray","arr","i","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","Object","prototype","toString","call","slice","constructor","name","Array","from","test","len","length","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","return","isArray","_extends","assign","bind","target","arguments","source","key","hasOwnProperty","apply","_default","exports","component","SelectInput","title","tags","parameters","docs","description","controls","exclude","STORYBOOK_PROPS_BLOCKLIST","countriesExample","text","countryCode","flag","Default","args","options","label","type","autoComplete","enableSearch","render","createElement","onSelect","option","console","log","story","WithPlaceholder","placeholder","WithoutSearch","WithoutLabel","Required","required","Disabled","disabled","CustomSelectWidth","selectWidth","CustomOptionTextWidth","optionTextMinWidth","WithError","error","currencyOptions","CurrencySelect","CurrencyWithPlaceholder","CurrencyWithSearch","LoadingDisplayTest","_React$useState","React","useState","_React$useState2","isLoaded","setIsLoaded","_React$useState3","_React$useState4","setCountryCode","_React$useState5","_React$useState6","phoneNumber","setPhoneNumber","useEffect","timer","setTimeout","clearTimeout","style","display","marginTop","dropdownValue","inputValue","onChange","e"],"sources":["../../../src/elements/SelectInput/SelectInput.story.tsx"],"sourcesContent":["import React from \"react\"\nimport { SelectInput } from \"./SelectInput\"\nimport { STORYBOOK_PROPS_BLOCKLIST } from \"../../utils/storybookBlocklist\"\n\nexport default {\n  component: SelectInput,\n  title: \"Components/SelectInput\",\n  tags: [\"autodocs\"],\n  parameters: {\n    docs: {\n      description: {\n        component:\n          \"A composite input component that combines a dropdown selector with a text input, commonly used for phone numbers with country codes.\",\n      },\n    },\n    controls: {\n      exclude: STORYBOOK_PROPS_BLOCKLIST,\n    },\n  },\n}\n\nconst countriesExample = [\n  {\n    text: \"🇦🇫 +93\",\n    name: \"Afghanistan\",\n    value: \"af\",\n    countryCode: \"+93\",\n    flag: \"🇦🇫\",\n  },\n  {\n    text: \"🇦🇽 +358\",\n    name: \"Aland Islands\",\n    value: \"ax\",\n    countryCode: \"+358\",\n    flag: \"🇦🇽\",\n  },\n  {\n    text: \"🇦🇱 +355\",\n    name: \"Albania\",\n    value: \"al\",\n    countryCode: \"+355\",\n    flag: \"🇦🇱\",\n  },\n  {\n    text: \"🇩🇿 +213\",\n    name: \"Algeria\",\n    value: \"dz\",\n    countryCode: \"+213\",\n    flag: \"🇩🇿\",\n  },\n  {\n    text: \"🇦🇸 +1684\",\n    name: \"American Samoa\",\n    value: \"as\",\n    countryCode: \"+1684\",\n    flag: \"🇦🇸\",\n  },\n  {\n    text: \"🇦🇩 +376\",\n    name: \"Andorra\",\n    value: \"ad\",\n    countryCode: \"+376\",\n    flag: \"🇦🇩\",\n  },\n  {\n    text: \"🇦🇴 +244\",\n    name: \"Angola\",\n    value: \"ao\",\n    countryCode: \"+244\",\n    flag: \"🇦🇴\",\n  },\n  {\n    text: \"🇦🇮 +1264\",\n    name: \"Anguilla\",\n    value: \"ai\",\n    countryCode: \"+1264\",\n    flag: \"🇦🇮\",\n  },\n  {\n    text: \"🇦🇶 +672\",\n    name: \"Antarctica\",\n    value: \"aq\",\n    countryCode: \"+672\",\n    flag: \"🇦🇶\",\n  },\n  {\n    text: \"🇦🇬 +1268\",\n    name: \"Antigua and Barbuda\",\n    value: \"ag\",\n    countryCode: \"+1268\",\n    flag: \"🇦🇬\",\n  },\n  {\n    text: \"🇦🇷 +54\",\n    name: \"Argentina\",\n    value: \"ar\",\n    countryCode: \"+54\",\n    flag: \"🇦🇷\",\n  },\n  {\n    text: \"🇦🇲 +374\",\n    name: \"Armenia\",\n    value: \"am\",\n    countryCode: \"+374\",\n    flag: \"🇦🇲\",\n  },\n  {\n    text: \"🇦🇼 +297\",\n    name: \"Aruba\",\n    value: \"aw\",\n    countryCode: \"+297\",\n    flag: \"🇦🇼\",\n  },\n  {\n    text: \"🇦🇺 +61\",\n    name: \"Australia\",\n    value: \"au\",\n    countryCode: \"+61\",\n    flag: \"🇦🇺\",\n  },\n  {\n    text: \"🇦🇹 +43\",\n    name: \"Austria\",\n    value: \"at\",\n    countryCode: \"+43\",\n    flag: \"🇦🇹\",\n  },\n  {\n    text: \"🇦🇿 +994\",\n    name: \"Azerbaijan\",\n    value: \"az\",\n    countryCode: \"+994\",\n    flag: \"🇦🇿\",\n  },\n  {\n    text: \"🇧🇸 +1242\",\n    name: \"Bahamas\",\n    value: \"bs\",\n    countryCode: \"+1242\",\n    flag: \"🇧🇸\",\n  },\n  {\n    text: \"🇧🇭 +973\",\n    name: \"Bahrain\",\n    value: \"bh\",\n    countryCode: \"+973\",\n    flag: \"🇧🇭\",\n  },\n  {\n    text: \"🇧🇩 +880\",\n    name: \"Bangladesh\",\n    value: \"bd\",\n    countryCode: \"+880\",\n    flag: \"🇧🇩\",\n  },\n  {\n    text: \"🇧🇧 +1246\",\n    name: \"Barbados\",\n    value: \"bb\",\n    countryCode: \"+1246\",\n    flag: \"🇧🇧\",\n  },\n  {\n    text: \"🇧🇾 +375\",\n    name: \"Belarus\",\n    value: \"by\",\n    countryCode: \"+375\",\n    flag: \"🇧🇾\",\n  },\n  {\n    text: \"🇧🇪 +32\",\n    name: \"Belgium\",\n    value: \"be\",\n    countryCode: \"+32\",\n    flag: \"🇧🇪\",\n  },\n  {\n    text: \"🇧🇿 +501\",\n    name: \"Belize\",\n    value: \"bz\",\n    countryCode: \"+501\",\n    flag: \"🇧🇿\",\n  },\n  {\n    text: \"🇧🇯 +229\",\n    name: \"Benin\",\n    value: \"bj\",\n    countryCode: \"+229\",\n    flag: \"🇧🇯\",\n  },\n  {\n    text: \"🇧🇲 +1441\",\n    name: \"Bermuda\",\n    value: \"bm\",\n    countryCode: \"+1441\",\n    flag: \"🇧🇲\",\n  },\n  {\n    text: \"🇧🇹 +975\",\n    name: \"Bhutan\",\n    value: \"bt\",\n    countryCode: \"+975\",\n    flag: \"🇧🇹\",\n  },\n  {\n    text: \"🇧🇴 +591\",\n    name: \"Bolivia\",\n    value: \"bo\",\n    countryCode: \"+591\",\n    flag: \"🇧🇴\",\n  },\n  {\n    text: \"🇧🇦 +387\",\n    name: \"Bosnia and Herzegovina\",\n    value: \"ba\",\n    countryCode: \"+387\",\n    flag: \"🇧🇦\",\n  },\n]\n\nexport const Default = {\n  args: {\n    options: countriesExample,\n    label: \"Phone number\",\n    type: \"tel\",\n    autoComplete: \"tel-national\",\n    enableSearch: true,\n  },\n  render: (args) => (\n    <SelectInput {...args} onSelect={(option) => console.log(option)} />\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"Basic SelectInput with search enabled.\",\n      },\n    },\n  },\n}\n\nexport const WithPlaceholder = {\n  args: {\n    options: countriesExample,\n    label: \"Phone number\",\n    type: \"tel\",\n    autoComplete: \"tel-national\",\n    enableSearch: true,\n    placeholder: \"(000) 000 0000\",\n  },\n  render: (args) => (\n    <SelectInput {...args} onSelect={(option) => console.log(option)} />\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"SelectInput with placeholder text.\",\n      },\n    },\n  },\n}\n\nexport const WithoutSearch = {\n  args: {\n    options: countriesExample,\n    label: \"Phone number\",\n    type: \"tel\",\n    autoComplete: \"tel-national\",\n    enableSearch: false,\n    placeholder: \"(000) 000 0000\",\n  },\n  render: (args) => (\n    <SelectInput {...args} onSelect={(option) => console.log(option)} />\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"SelectInput without search functionality.\",\n      },\n    },\n  },\n}\n\nexport const WithoutLabel = {\n  args: {\n    options: countriesExample,\n    type: \"tel\",\n    autoComplete: \"tel-national\",\n    enableSearch: true,\n    placeholder: \"(000) 000 0000\",\n  },\n  render: (args) => (\n    <SelectInput {...args} onSelect={(option) => console.log(option)} />\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"SelectInput without a label.\",\n      },\n    },\n  },\n}\n\nexport const Required = {\n  args: {\n    options: countriesExample,\n    label: \"Phone number\",\n    type: \"tel\",\n    autoComplete: \"tel-national\",\n    enableSearch: true,\n    placeholder: \"(000) 000 0000\",\n    required: true,\n  },\n  render: (args) => (\n    <SelectInput {...args} onSelect={(option) => console.log(option)} />\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"Required SelectInput with validation indicator.\",\n      },\n    },\n  },\n}\n\nexport const Disabled = {\n  args: {\n    options: countriesExample,\n    label: \"Phone number\",\n    type: \"tel\",\n    autoComplete: \"tel-national\",\n    enableSearch: true,\n    placeholder: \"(000) 000 0000\",\n    disabled: true,\n  },\n  render: (args) => (\n    <SelectInput {...args} onSelect={(option) => console.log(option)} />\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"Disabled SelectInput.\",\n      },\n    },\n  },\n}\n\nexport const CustomSelectWidth = {\n  args: {\n    options: countriesExample,\n    label: \"Phone number\",\n    type: \"tel\",\n    autoComplete: \"tel-national\",\n    enableSearch: true,\n    placeholder: \"(000) 000 0000\",\n    selectWidth: 100,\n  },\n  render: (args) => (\n    <SelectInput {...args} onSelect={(option) => console.log(option)} />\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"SelectInput with custom select dropdown width.\",\n      },\n    },\n  },\n}\n\nexport const CustomOptionTextWidth = {\n  args: {\n    options: countriesExample,\n    label: \"Phone number\",\n    type: \"tel\",\n    autoComplete: \"tel-national\",\n    enableSearch: true,\n    placeholder: \"(000) 000 0000\",\n    optionTextMinWidth: \"20ch\",\n  },\n  render: (args) => (\n    <SelectInput {...args} onSelect={(option) => console.log(option)} />\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"SelectInput with custom minimum width for option text.\",\n      },\n    },\n  },\n}\n\nexport const WithError = {\n  args: {\n    options: countriesExample,\n    label: \"Phone number\",\n    type: \"tel\",\n    autoComplete: \"tel-national\",\n    enableSearch: true,\n    placeholder: \"(000) 000 0000\",\n    error: \"Something is wrong\",\n  },\n  render: (args) => (\n    <SelectInput {...args} onSelect={(option) => console.log(option)} />\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"SelectInput with error state.\",\n      },\n    },\n  },\n}\n\nconst currencyOptions = [\n  {\n    text: \"USD\",\n    name: \"US Dollar\",\n    value: \"usd\",\n  },\n  {\n    text: \"EUR\",\n    name: \"Euro\",\n    value: \"eur\",\n  },\n  {\n    text: \"GBP\",\n    name: \"British Pound\",\n    value: \"gbp\",\n  },\n  {\n    text: \"JPY\",\n    name: \"Japanese Yen\",\n    value: \"jpy\",\n  },\n  {\n    text: \"CHF\",\n    name: \"Swiss Franc\",\n    value: \"chf\",\n  },\n]\n\nexport const CurrencySelect = {\n  args: {\n    options: currencyOptions,\n    label: \"Currency\",\n    selectWidth: 70,\n    optionTextMinWidth: \"5ch\",\n  },\n  render: (args) => (\n    <SelectInput {...args} onSelect={(option) => console.log(option)} />\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"Currency select input with custom width settings.\",\n      },\n    },\n  },\n}\n\nexport const CurrencyWithPlaceholder = {\n  args: {\n    options: currencyOptions,\n    label: \"Currency\",\n    selectWidth: 70,\n    optionTextMinWidth: \"5ch\",\n    placeholder: \"Currency\",\n  },\n  render: (args) => (\n    <SelectInput {...args} onSelect={(option) => console.log(option)} />\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"Currency select with placeholder text.\",\n      },\n    },\n  },\n}\n\nexport const CurrencyWithSearch = {\n  args: {\n    options: currencyOptions,\n    label: \"Currency\",\n    selectWidth: 70,\n    optionTextMinWidth: \"5ch\",\n    placeholder: \"Currency\",\n    enableSearch: true,\n  },\n  render: (args) => (\n    <SelectInput {...args} onSelect={(option) => console.log(option)} />\n  ),\n  parameters: {\n    docs: {\n      description: {\n        story: \"Currency select with search enabled.\",\n      },\n    },\n  },\n}\n\nexport const LoadingDisplayTest = {\n  render: () => {\n    const [isLoaded, setIsLoaded] = React.useState(false)\n    const [countryCode, setCountryCode] = React.useState(\"ad\")\n    const [phoneNumber, setPhoneNumber] = React.useState(\"\")\n\n    React.useEffect(() => {\n      const timer = setTimeout(() => {\n        setIsLoaded(true)\n      }, 500)\n      return () => clearTimeout(timer)\n    }, [])\n\n    return (\n      <div>\n        <div\n          style={{\n            display: isLoaded ? \"grid\" : \"none\",\n            marginTop: \"16px\",\n          }}\n        >\n          <SelectInput\n            key=\"loading-test-phone-input\"\n            name=\"phoneNumber\"\n            placeholder=\"(000) 000 0000\"\n            options={countriesExample}\n            onSelect={(option) => {\n              console.log(\"Selected:\", option)\n              setCountryCode(option.value)\n            }}\n            dropdownValue={countryCode}\n            label=\"Phone number\"\n            type=\"tel\"\n            autoComplete=\"tel-national\"\n            inputValue={phoneNumber}\n            onChange={(e) => setPhoneNumber(e.target.value)}\n            data-testid=\"LoadingTestSelectInput\"\n            required\n          />\n        </div>\n        {!isLoaded && <div>Loading phone input...</div>}\n      </div>\n    )\n  },\n  parameters: {\n    docs: {\n      description: {\n        story: \"Test loading state for SelectInput.\",\n      },\n    },\n  },\n}\n"],"mappings":"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"}

package/dist/elements/SelectInput/SelectInputList.story.d.ts

@@ -1,6 +1,36 @@
 import React from "react";
 declare const _default: {
+    component: ({ enableSearch, options, onSelect, onClose, optionTextMinWidth, }: import("./SelectInputList").SelectInputListProps) => React.JSX.Element;
     title: string;
+    tags: string[];
+    parameters: {
+        docs: {
+            description: {
+                component: string;
+            };
+        };
+        controls: {
+            exclude: string[];
+        };
+    };
 };
 export default _default;
-export declare const Default: () => React.JSX.Element;
+export declare const Default: {
+    args: {
+        options: {
+            text: string;
+            name: string;
+            value: string;
+            countryCode: string;
+            flag: string;
+        }[];
+    };
+    render: (args: any) => React.JSX.Element;
+    parameters: {
+        docs: {
+            description: {
+                story: string;
+            };
+        };
+    };
+};