@pingux/astro 2.150.0-alpha.2 → 2.150.0

package/lib/styles/themes/next-gen/variants/button.js

@@ -13,7 +13,6 @@ import chroma from 'chroma-js';
 import { copyButton } from '../codeView/codeView';
 import colors from '../colors/colors';
 import tShirtSizes from '../customProperties/tShirtSizes';
-import { commonContentProps } from './box';
 var primaryBlue = colors.primary,
   primaryBlueHover = colors.active_hover,
   primaryBluePress = colors.active_pressed,
@@ -110,19 +109,8 @@ var secondary = _objectSpread(_objectSpread({}, buttonBase), {}, {
 var tertiary = _objectSpread(_objectSpread({}, buttonBase), {}, {
   backgroundColor: 'transparent',
   borderColor: 'border.base',
-  color: 'font.base',
-  '&.is-focused': _objectSpread(_objectSpread({}, defaultFocus), {}, {
-    outlineColor: 'gray-700',
-    backgroundColor: 'background.secondary'
-  }),
-  '&.is-pressed': {
-    backgroundColor: 'background.secondary',
-    color: 'font.base'
-  },
-  '&.is-hovered': _objectSpread({
-    backgroundColor: 'background.secondary',
-    color: 'font.base'
-  }, boxShadowNone)
+  color: 'text.secondary',
+  '&.is-hovered': _objectSpread({}, boxShadowNone)
 });
 var outlineCritical = _objectSpread(_objectSpread({}, buttonBase), {}, {
   backgroundColor: 'transparent',
@@ -512,21 +500,7 @@ var iconButtons = {
       }
     }
   }),
-  hintButton: _objectSpread({}, hintButton),
-  passwordVisibilityIcon: _objectSpread(_objectSpread(_objectSpread({}, baseIconButton), commonContentProps), {}, {
-    right: 0,
-    padding: '12px 20px',
-    border: '0px solid !important',
-    '&:hover, &.is-pressed': {
-      background: 'transparent',
-      boxShadow: 'none'
-    },
-    '&.is-focused': {
-      outline: '2px solid',
-      outlineOffset: '2px',
-      outlineColor: 'gray-700'
-    }
-  })
+  hintButton: _objectSpread({}, hintButton)
 };
 var listBoxLink = {
   color: 'active',
@@ -555,15 +529,6 @@ var listBoxLink = {
     }
   })
 };
-var ButtonInputGroupContentRight = _objectSpread(_objectSpread(_objectSpread({}, tertiary), commonContentProps), {}, {
-  right: 0,
-  padding: '12px 20px',
-  borderRadius: '0px 4px 4px 0px !important',
-  borderWidth: '0px !important',
-  borderLeftWidth: '1px !important',
-  borderRightWidth: '1px !important',
-  borderLeftColor: 'gray-500'
-});
 var buttons = {
   neutral: neutral,
   primary: primary,
@@ -587,7 +552,6 @@ var buttons = {
   iconButtons: iconButtons,
   modalCloseButton: modalCloseButton,
   aiChat: aiChat,
-  paginationMenu: paginationMenu,
-  ButtonInputGroupContentRight: ButtonInputGroupContentRight
+  paginationMenu: paginationMenu
 };
 export default buttons;

package/lib/styles/themes/next-gen/variants/input.js

@@ -192,25 +192,4 @@ input.promptInputAttachmentWrapper = {
   overflowY: 'hidden',
   whiteSpace: 'nowrap',
   px: '.75rem'
-};
-input.dropDownContentRight = {
-  background: 'inherit',
-  '& button': {
-    borderRadius: '0px 4px 4px 0px !important',
-    '&.is-focused': {
-      outline: '2px solid',
-      outlineOffset: '2px',
-      outlineColor: 'gray-700'
-    }
-  }
-};
-input.dropDownContentLeft = {
-  '& button': {
-    borderRadius: '4px 0px 0px 4px !important',
-    '&.is-focused': {
-      outline: '2px solid',
-      outlineOffset: '2px',
-      outlineColor: 'gray-700'
-    }
-  }
 };

package/lib/styles/themes/next-gen/variants/variants.js

@@ -12,9 +12,9 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 import attachment from '../../../../components/AIComponents/Attachment/Attachment.styles';
 import skeleton from '../../../../components/Skeleton/Skeleton.styles';
 import codeView from '../codeView/codeView';
+import colors from '../colors/colors';
 import accordion from './accordion';
 import { avatar } from './avatar';
-import { box } from './box';
 import button, { defaultFocus } from './button';
 import callout from './callout';
 import { dataTable } from './dataTable';
@@ -382,7 +382,21 @@ export default {
   attachment: attachment,
   avatar: avatar,
   breadcrumb: breadcrumb,
-  box: box,
+  box: {
+    indeterminateCheckboxIcon: {
+      height: '19.25px',
+      width: '19.25px',
+      '&.is-disabled': {
+        '& rect[id="indeterminate-checkbox-icon-wrapper"]': {
+          fill: 'gray-500',
+          stroke: 'gray-500'
+        }
+      },
+      '&.is-focused': {
+        boxShadow: "inset 0px 0px 0px 1px ".concat(colors.focus)
+      }
+    }
+  },
   buttonBar: buttonBar,
   callout: callout,
   codeView: codeView,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pingux/astro",
-  "version": "2.150.0-alpha.2",
+  "version": "2.150.0",
   "description": "React component library for Ping Identity's design system",
   "repository": {
     "type": "git",

package/lib/cjs/styles/themes/next-gen/stories/OnyxInputPatterns.chromatic.stories.d.ts

@@ -1,11 +0,0 @@
-import React from 'react';
-declare const _default: {
-    title: string;
-    component: React.ForwardRefExoticComponent<import("../../../..").TextFieldProps & React.RefAttributes<HTMLInputElement>>;
-};
-export default _default;
-export declare const Default: () => React.JSX.Element;
-export declare const PasswordInput: () => React.JSX.Element;
-export declare const InputGroup: () => React.JSX.Element;
-export declare const ButtonInputGroup: () => React.JSX.Element;
-export declare const DropdownInputGroup: () => React.JSX.Element;

package/lib/cjs/styles/themes/next-gen/stories/OnyxInputPatterns.chromatic.stories.js

@@ -1,197 +0,0 @@
-"use strict";
-
-var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
-var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
-var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
-var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-_Object$defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.PasswordInput = exports.InputGroup = exports.DropdownInputGroup = exports.Default = exports.ButtonInputGroup = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _EyeOffOutlineIcon = _interopRequireDefault(require("@pingux/mdi-react/EyeOffOutlineIcon"));
-var _EyeOutlineIcon = _interopRequireDefault(require("@pingux/mdi-react/EyeOutlineIcon"));
-var _ = require("../../../..");
-var _TextField = _interopRequireDefault(require("../../../../components/TextField"));
-var _react2 = require("@emotion/react");
-function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-var _default = {
-  title: 'Form/Onyx Input Patterns',
-  component: _TextField["default"]
-};
-exports["default"] = _default;
-var items = [{
-  name: 'Aardvark',
-  id: '1'
-}, {
-  name: 'Kangaroo',
-  id: '2'
-}, {
-  name: 'Snake',
-  id: '3'
-}];
-var Default = function Default() {
-  return (0, _react2.jsx)(_TextField["default"], {
-    label: "Label",
-    helperText: "Help text for this field."
-  });
-};
-exports.Default = Default;
-var PasswordInput = function PasswordInput() {
-  var _useState = (0, _react.useState)(false),
-    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-    isVisible = _useState2[0],
-    setIsVisible = _useState2[1];
-  var handleVisible = function handleVisible() {
-    setIsVisible(!isVisible);
-  };
-  return (0, _react2.jsx)(_TextField["default"], {
-    label: "Password",
-    type: "password",
-    containerProps: {
-      sx: {
-        '& input': {
-          paddingRight: '60px'
-        }
-      }
-    },
-    slots: {
-      inContainer: (0, _react2.jsx)(_.IconButtonToggle, {
-        toggledIcon: _EyeOutlineIcon["default"],
-        defaultIcon: _EyeOffOutlineIcon["default"],
-        onToggle: handleVisible,
-        isToggled: isVisible,
-        variant: "passwordVisibilityIcon",
-        buttonProps: {
-          'aria-label': 'eye icon'
-        },
-        iconProps: {
-          size: 'xs'
-        }
-      })
-    }
-  });
-};
-exports.PasswordInput = PasswordInput;
-var InputGroup = function InputGroup() {
-  return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_TextField["default"], {
-    label: "Label",
-    helperText: "Help text for this field.",
-    containerProps: {
-      sx: {
-        '& input': {
-          paddingLeft: '70px'
-        }
-      }
-    },
-    slots: {
-      beforeInput: (0, _react2.jsx)(_.Box, {
-        variant: "box.inputGroupContentLeft",
-        p: "12px 20px"
-      }, (0, _react2.jsx)(_.Text, null, "@"))
-    }
-  }), (0, _react2.jsx)(_TextField["default"], {
-    label: "Label",
-    mt: "xl",
-    helperText: "Help text for this field.",
-    containerProps: {
-      sx: {
-        '& input': {
-          paddingRight: '160px'
-        }
-      }
-    },
-    slots: {
-      inContainer: (0, _react2.jsx)(_.Box, {
-        variant: "box.inputGroupContentRight",
-        p: "12px 20px"
-      }, (0, _react2.jsx)(_.Text, null, "@example.com"))
-    }
-  }));
-};
-exports.InputGroup = InputGroup;
-var ButtonInputGroup = function ButtonInputGroup() {
-  return (0, _react2.jsx)(_TextField["default"], {
-    label: "Label",
-    containerProps: {
-      sx: {
-        '& input': {
-          paddingRight: '100px'
-        }
-      }
-    },
-    slots: {
-      inContainer: (0, _react2.jsx)(_.Button, {
-        variant: "ButtonInputGroupContentRight"
-      }, "Button")
-    }
-  });
-};
-exports.ButtonInputGroup = ButtonInputGroup;
-var DropdownInputGroup = function DropdownInputGroup() {
-  var _useState3 = (0, _react.useState)(items[0].name),
-    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-    selectedKey = _useState4[0],
-    setSelectedKey = _useState4[1];
-  var handleSelectionChange = function handleSelectionChange(key) {
-    return setSelectedKey(key);
-  };
-  return (0, _react2.jsx)(_react["default"].Fragment, null, (0, _react2.jsx)(_TextField["default"], {
-    label: "Label",
-    containerProps: {
-      sx: {
-        '& > .field-control-wrapper > input': {
-          paddingRight: '160px'
-        }
-      }
-    },
-    slots: {
-      inContainer: (0, _react2.jsx)(_.Box, {
-        variant: "box.inputDropDownContentRight",
-        width: "150px",
-        mt: "-2px"
-      }, (0, _react2.jsx)(_.SelectField, {
-        items: items,
-        selectedKey: selectedKey,
-        onSelectionChange: handleSelectionChange,
-        variant: "forms.input.dropDownContentRight"
-      }, function (item) {
-        return (0, _react2.jsx)(_.Item, {
-          key: item.name,
-          "data-id": item.name
-        }, item.name);
-      }))
-    }
-  }), (0, _react2.jsx)(_TextField["default"], {
-    label: "Label",
-    mt: "xl",
-    containerProps: {
-      sx: {
-        '& > .field-control-wrapper > input': {
-          paddingLeft: '160px'
-        }
-      }
-    },
-    slots: {
-      beforeInput: (0, _react2.jsx)(_.Box, {
-        variant: "box.inputDropDownContentLeft",
-        width: "150px",
-        mt: "-2px"
-      }, (0, _react2.jsx)(_.SelectField, {
-        items: items,
-        selectedKey: selectedKey,
-        onSelectionChange: handleSelectionChange,
-        variant: "forms.input.dropDownContentLeft"
-      }, function (item) {
-        return (0, _react2.jsx)(_.Item, {
-          key: item.name,
-          "data-id": item.name
-        }, item.name);
-      }))
-    }
-  }));
-};
-exports.DropdownInputGroup = DropdownInputGroup;

package/lib/cjs/styles/themes/next-gen/variants/box.d.ts

@@ -1,61 +0,0 @@
-export declare const commonContentProps: {
-    position: string;
-    top: string;
-    transform: string;
-    height: string;
-    width: string;
-    justifyContent: string;
-};
-export declare const box: {
-    indeterminateCheckboxIcon: {
-        height: string;
-        width: string;
-        '&.is-disabled': {
-            '& rect[id="indeterminate-checkbox-icon-wrapper"]': {
-                fill: string;
-                stroke: string;
-            };
-        };
-        '&.is-focused': {
-            boxShadow: string;
-        };
-    };
-    inputDropDownContentLeft: {
-        left: number;
-        position: string;
-        top: string;
-        transform: string;
-        height: string;
-        width: string;
-        justifyContent: string;
-    };
-    inputGroupContentLeft: {
-        left: number;
-        borderRight: string;
-        position: string;
-        top: string;
-        transform: string;
-        height: string;
-        width: string;
-        justifyContent: string;
-    };
-    inputDropDownContentRight: {
-        right: number;
-        position: string;
-        top: string;
-        transform: string;
-        height: string;
-        width: string;
-        justifyContent: string;
-    };
-    inputGroupContentRight: {
-        right: number;
-        borderLeft: string;
-        position: string;
-        top: string;
-        transform: string;
-        height: string;
-        width: string;
-        justifyContent: string;
-    };
-};

package/lib/cjs/styles/themes/next-gen/variants/box.js

@@ -1,58 +0,0 @@
-"use strict";
-
-var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
-var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
-var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
-var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
-var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
-var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
-var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
-var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-_Object$defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.commonContentProps = exports.box = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
-var _colors = _interopRequireDefault(require("../colors/colors"));
-function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
-var commonContentProps = {
-  position: 'absolute',
-  top: '50%',
-  transform: 'translateY(-50%)',
-  height: '100%',
-  width: 'max-content',
-  justifyContent: 'center'
-};
-exports.commonContentProps = commonContentProps;
-var box = {
-  indeterminateCheckboxIcon: {
-    height: '19.25px',
-    width: '19.25px',
-    '&.is-disabled': {
-      '& rect[id="indeterminate-checkbox-icon-wrapper"]': {
-        fill: 'gray-500',
-        stroke: 'gray-500'
-      }
-    },
-    '&.is-focused': {
-      boxShadow: "inset 0px 0px 0px 1px ".concat(_colors["default"].focus)
-    }
-  },
-  inputDropDownContentLeft: _objectSpread(_objectSpread({}, commonContentProps), {}, {
-    left: 0
-  }),
-  inputGroupContentLeft: _objectSpread(_objectSpread({}, commonContentProps), {}, {
-    left: 0,
-    borderRight: "1px solid ".concat(_colors["default"]['gray-500'])
-  }),
-  inputDropDownContentRight: _objectSpread(_objectSpread({}, commonContentProps), {}, {
-    right: 0
-  }),
-  inputGroupContentRight: _objectSpread(_objectSpread({}, commonContentProps), {}, {
-    right: 0,
-    borderLeft: "1px solid ".concat(_colors["default"]['gray-500'])
-  })
-};
-exports.box = box;

package/lib/styles/themes/next-gen/stories/OnyxInputPatterns.chromatic.stories.js

@@ -1,178 +0,0 @@
-import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
-import React, { useState } from 'react';
-import EyeOffOutlineIcon from '@pingux/mdi-react/EyeOffOutlineIcon';
-import EyeOutlineIcon from '@pingux/mdi-react/EyeOutlineIcon';
-import { Box, Button, IconButtonToggle, Item, SelectField, Text } from '../../../..';
-import TextField from '../../../../components/TextField';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-export default {
-  title: 'Form/Onyx Input Patterns',
-  component: TextField
-};
-var items = [{
-  name: 'Aardvark',
-  id: '1'
-}, {
-  name: 'Kangaroo',
-  id: '2'
-}, {
-  name: 'Snake',
-  id: '3'
-}];
-export var Default = function Default() {
-  return ___EmotionJSX(TextField, {
-    label: "Label",
-    helperText: "Help text for this field."
-  });
-};
-export var PasswordInput = function PasswordInput() {
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    isVisible = _useState2[0],
-    setIsVisible = _useState2[1];
-  var handleVisible = function handleVisible() {
-    setIsVisible(!isVisible);
-  };
-  return ___EmotionJSX(TextField, {
-    label: "Password",
-    type: "password",
-    containerProps: {
-      sx: {
-        '& input': {
-          paddingRight: '60px'
-        }
-      }
-    },
-    slots: {
-      inContainer: ___EmotionJSX(IconButtonToggle, {
-        toggledIcon: EyeOutlineIcon,
-        defaultIcon: EyeOffOutlineIcon,
-        onToggle: handleVisible,
-        isToggled: isVisible,
-        variant: "passwordVisibilityIcon",
-        buttonProps: {
-          'aria-label': 'eye icon'
-        },
-        iconProps: {
-          size: 'xs'
-        }
-      })
-    }
-  });
-};
-export var InputGroup = function InputGroup() {
-  return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(TextField, {
-    label: "Label",
-    helperText: "Help text for this field.",
-    containerProps: {
-      sx: {
-        '& input': {
-          paddingLeft: '70px'
-        }
-      }
-    },
-    slots: {
-      beforeInput: ___EmotionJSX(Box, {
-        variant: "box.inputGroupContentLeft",
-        p: "12px 20px"
-      }, ___EmotionJSX(Text, null, "@"))
-    }
-  }), ___EmotionJSX(TextField, {
-    label: "Label",
-    mt: "xl",
-    helperText: "Help text for this field.",
-    containerProps: {
-      sx: {
-        '& input': {
-          paddingRight: '160px'
-        }
-      }
-    },
-    slots: {
-      inContainer: ___EmotionJSX(Box, {
-        variant: "box.inputGroupContentRight",
-        p: "12px 20px"
-      }, ___EmotionJSX(Text, null, "@example.com"))
-    }
-  }));
-};
-export var ButtonInputGroup = function ButtonInputGroup() {
-  return ___EmotionJSX(TextField, {
-    label: "Label",
-    containerProps: {
-      sx: {
-        '& input': {
-          paddingRight: '100px'
-        }
-      }
-    },
-    slots: {
-      inContainer: ___EmotionJSX(Button, {
-        variant: "ButtonInputGroupContentRight"
-      }, "Button")
-    }
-  });
-};
-export var DropdownInputGroup = function DropdownInputGroup() {
-  var _useState3 = useState(items[0].name),
-    _useState4 = _slicedToArray(_useState3, 2),
-    selectedKey = _useState4[0],
-    setSelectedKey = _useState4[1];
-  var handleSelectionChange = function handleSelectionChange(key) {
-    return setSelectedKey(key);
-  };
-  return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(TextField, {
-    label: "Label",
-    containerProps: {
-      sx: {
-        '& > .field-control-wrapper > input': {
-          paddingRight: '160px'
-        }
-      }
-    },
-    slots: {
-      inContainer: ___EmotionJSX(Box, {
-        variant: "box.inputDropDownContentRight",
-        width: "150px",
-        mt: "-2px"
-      }, ___EmotionJSX(SelectField, {
-        items: items,
-        selectedKey: selectedKey,
-        onSelectionChange: handleSelectionChange,
-        variant: "forms.input.dropDownContentRight"
-      }, function (item) {
-        return ___EmotionJSX(Item, {
-          key: item.name,
-          "data-id": item.name
-        }, item.name);
-      }))
-    }
-  }), ___EmotionJSX(TextField, {
-    label: "Label",
-    mt: "xl",
-    containerProps: {
-      sx: {
-        '& > .field-control-wrapper > input': {
-          paddingLeft: '160px'
-        }
-      }
-    },
-    slots: {
-      beforeInput: ___EmotionJSX(Box, {
-        variant: "box.inputDropDownContentLeft",
-        width: "150px",
-        mt: "-2px"
-      }, ___EmotionJSX(SelectField, {
-        items: items,
-        selectedKey: selectedKey,
-        onSelectionChange: handleSelectionChange,
-        variant: "forms.input.dropDownContentLeft"
-      }, function (item) {
-        return ___EmotionJSX(Item, {
-          key: item.name,
-          "data-id": item.name
-        }, item.name);
-      }))
-    }
-  }));
-};