linear-react-components-ui 1.1.22 → 1.1.24-beta.0

package/lib/inputs2/selectfield/listbox.js

@@ -0,0 +1,103 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ListBox = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _lodash = _interopRequireDefault(require("lodash"));
+var _context = require("./context");
+var _search = require("./search");
+const _excluded = ["children"];
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+const ListBox = exports.ListBox = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+  const {
+      children
+    } = props,
+    rest = _objectWithoutProperties(props, _excluded);
+  const {
+    listBoxOpen,
+    valueSelect,
+    selectFieldId,
+    selectContainerRef,
+    notFoundFilterLabel,
+    liSelectedRef,
+    searchOnDropdown,
+    isMultipleWithCheckboxes
+  } = (0, _context.useSelectFieldContext)();
+  const [listBoxStyles, setListBoxStyles] = _react.default.useState({});
+  const [filterResultIsEmpty, setFilterResultIsEmpty] = _react.default.useState(false);
+  const listBoxRef = _react.default.useRef(null);
+  const shouldBeShowSearchInput = searchOnDropdown || isMultipleWithCheckboxes;
+  _react.default.useCallback(() => {
+    requestAnimationFrame(() => {
+      const hasChildrenElementsInUL = listBoxRef.current?.childNodes;
+      const liElementsFiltered = listBoxRef.current?.querySelectorAll('li[data-state-filtered="true"]') ?? [];
+      const filterIsEmpty = !_lodash.default.isEmpty(hasChildrenElementsInUL) && _lodash.default.isEmpty(liElementsFiltered);
+      setFilterResultIsEmpty(filterIsEmpty);
+    });
+  }, [])();
+  _react.default.useEffect(() => {
+    liSelectedRef?.current?.scrollIntoView({
+      block: 'nearest',
+      behavior: 'auto'
+    });
+  }, []);
+  _react.default.useEffect(() => {
+    const updatePosition = () => {
+      const selectPositionOnScreen = selectContainerRef.current?.getBoundingClientRect();
+      if (selectPositionOnScreen) {
+        const {
+          top,
+          left,
+          width,
+          height
+        } = selectPositionOnScreen;
+        setListBoxStyles({
+          top: top + height + window.scrollY,
+          left: left + window.scrollX,
+          minWidth: width,
+          position: 'absolute'
+        });
+      }
+    };
+    if (listBoxOpen) {
+      updatePosition();
+      window.addEventListener('resize', updatePosition);
+      window.addEventListener('scroll', updatePosition, true);
+    }
+    return () => {
+      window.removeEventListener('resize', updatePosition);
+      window.removeEventListener('scroll', updatePosition, true);
+    };
+  }, [listBoxOpen, valueSelect, selectContainerRef]);
+  return /*#__PURE__*/_react.default.createElement("div", _extends({
+    ref: ref,
+    style: listBoxStyles,
+    "aria-expanded": listBoxOpen,
+    className: "select-field-listbox",
+    "data-testid": "test-select-field-listbox"
+  }, rest), shouldBeShowSearchInput && /*#__PURE__*/_react.default.createElement(_search.Search, null), /*#__PURE__*/_react.default.createElement("ul", {
+    id: selectFieldId,
+    role: "listbox",
+    ref: listBoxRef
+  }, children, filterResultIsEmpty && /*#__PURE__*/_react.default.createElement("li", {
+    tabIndex: -1,
+    "aria-disabled": true,
+    "aria-label": notFoundFilterLabel,
+    key: "not-found-values",
+    role: "option",
+    id: "not-found-values",
+    className: "not-found-values",
+    onClick: event => {
+      event.preventDefault();
+    },
+    onMouseDown: event => {
+      event.preventDefault();
+    }
+  }, notFoundFilterLabel)));
+});
+ListBox.displayName = 'SelectListBox';

package/lib/inputs2/selectfield/search.d.ts

@@ -0,0 +1,7 @@
+import React__default from 'react';
+
+interface SelectFieldSearchProps extends React__default.ComponentProps<'div'> {
+}
+declare const Search: React__default.ForwardRefExoticComponent<Pick<SelectFieldSearchProps, "className" | "onClick" | "color" | "children" | "style" | "id" | "key" | "slot" | "title" | "hidden" | "onKeyPress" | "role" | "tabIndex" | "align" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "lang" | "nonce" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & React__default.RefAttributes<HTMLDivElement>>;
+
+export { Search, SelectFieldSearchProps };

package/lib/inputs2/selectfield/search.js

@@ -0,0 +1,71 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Search = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _icons = _interopRequireDefault(require("../../icons"));
+var TextField = _interopRequireWildcard(require("../textfield"));
+var _slot = require("../slot");
+var _context = require("./context");
+var _helpers = require("./helpers");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _objectDestructuringEmpty(t) { if (null == t) throw new TypeError("Cannot destructure " + t); }
+const Search = exports.Search = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+  const rest = Object.assign({}, (_objectDestructuringEmpty(props), props));
+  const {
+    nameSelect,
+    handleOnSearch,
+    handleOnKeyDown,
+    selectSearchInputRef,
+    selectInputRef,
+    handleCloseListBox,
+    searchInputPlaceholder
+  } = (0, _context.useSelectFieldContext)();
+  const handleOnChangeSearchInput = event => {
+    handleOnSearch?.(event);
+  };
+  const handleOnBlur = () => {
+    handleCloseListBox();
+  };
+  const handleOnKeyDownSearchInput = event => {
+    if (event.key && event.key === 'Tab') {
+      const inputElement = selectInputRef.current;
+      if (event.key === 'Tab') {
+        (0, _helpers.setFocusOnOffsetElement)(inputElement, 'next');
+      }
+      if (event.shiftKey) {
+        (0, _helpers.setFocusOnOffsetElement)(inputElement, 'before');
+      }
+    }
+    handleOnKeyDown?.(event);
+  };
+  return /*#__PURE__*/_react.default.createElement("div", _extends({
+    ref: ref,
+    className: "select-field-search"
+  }, rest), /*#__PURE__*/_react.default.createElement(TextField.Input, {
+    "data-testid": "test-select-field-search-input",
+    autoComplete: "off",
+    ref: selectSearchInputRef,
+    name: String(nameSelect).concat('-select-field-search'),
+    tabIndex: 0,
+    placeholder: searchInputPlaceholder,
+    customClassWrapper: "select-field-search-input",
+    onBlur: handleOnBlur,
+    onChange: handleOnChangeSearchInput,
+    onKeyDown: handleOnKeyDownSearchInput
+  }, /*#__PURE__*/_react.default.createElement(_slot.RightSlot, {
+    style: {
+      padding: '0px 6px 0px 3px'
+    }
+  }, /*#__PURE__*/_react.default.createElement(_icons.default, {
+    size: 16,
+    name: "search",
+    colorStyle: "default"
+  }))));
+});
+Search.displayName = 'SelectFieldSearch';

package/lib/inputs2/selectfield/selections.d.ts

@@ -0,0 +1,10 @@
+import React__default from 'react';
+
+interface SelectFieldSelectionsProps extends React__default.ComponentProps<'div'> {
+    isDisabled: boolean;
+    isReadOnly: boolean;
+    listOfOptionsToSelect: Map<string, string>;
+}
+declare const Selections: React__default.ForwardRefExoticComponent<Pick<SelectFieldSelectionsProps, "className" | "onClick" | "color" | "children" | "style" | "id" | "key" | "slot" | "title" | "hidden" | "onKeyPress" | "role" | "tabIndex" | "align" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "lang" | "nonce" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "isDisabled" | "isReadOnly" | "listOfOptionsToSelect"> & React__default.RefAttributes<HTMLDivElement>>;
+
+export { SelectFieldSelectionsProps, Selections };

package/lib/inputs2/selectfield/selections.js

@@ -0,0 +1,86 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Selections = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _icons = _interopRequireDefault(require("../../icons"));
+var _context = require("./context");
+const _excluded = ["isDisabled", "isReadOnly", "value", "label", "removeItemSelected"],
+  _excluded2 = ["isDisabled", "isReadOnly", "listOfOptionsToSelect"];
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+const ItemSelected = props => {
+  const {
+      isDisabled,
+      isReadOnly,
+      value,
+      label,
+      removeItemSelected
+    } = props,
+    rest = _objectWithoutProperties(props, _excluded);
+  return /*#__PURE__*/_react.default.createElement("span", _extends({
+    id: value,
+    title: label,
+    className: "selected",
+    "data-state-disabled": isDisabled,
+    "data-state-read-only": isReadOnly
+  }, rest), /*#__PURE__*/_react.default.createElement("p", {
+    className: "label"
+  }, label), /*#__PURE__*/_react.default.createElement("button", {
+    type: "button",
+    disabled: isDisabled,
+    "data-state-read-only": isReadOnly,
+    tabIndex: -1,
+    className: "remove",
+    title: "Remover",
+    onClick: removeItemSelected,
+    onMouseDown: event => {
+      event.preventDefault();
+    }
+  }, /*#__PURE__*/_react.default.createElement(_icons.default, {
+    name: "cancel2"
+  })));
+};
+const Selections = exports.Selections = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+  const {
+      isDisabled,
+      isReadOnly,
+      listOfOptionsToSelect
+    } = props,
+    rest = _objectWithoutProperties(props, _excluded2);
+  const {
+    valueSelect,
+    isMultipleDefault,
+    handleOnChange
+  } = (0, _context.useSelectFieldContext)();
+  const hasValuesSelected = Boolean([...valueSelect]?.length);
+  const handleRemoveItemSelected = (value, label) => {
+    handleOnChange?.(value, label, true);
+  };
+  if (!hasValuesSelected) return null;
+  return /*#__PURE__*/_react.default.createElement("div", _extends({
+    ref: ref,
+    className: "selections",
+    "data-testid": "test-select-field-input-selections",
+    "aria-disabled": isDisabled,
+    "aria-readonly": isReadOnly,
+    "data-state-multiple-selections": isMultipleDefault
+  }, rest), [...valueSelect].map(value => {
+    const label = listOfOptionsToSelect.get(value);
+    return /*#__PURE__*/_react.default.createElement(ItemSelected, {
+      key: value,
+      value: value,
+      label: label,
+      isDisabled: isDisabled,
+      isReadOnly: isReadOnly,
+      removeItemSelected: () => {
+        handleRemoveItemSelected(value, label);
+      }
+    });
+  }));
+});
+Selections.displayName = 'SelectFieldSelections';

package/lib/inputs2/selectfield/triggers.d.ts

@@ -0,0 +1,8 @@
+interface SelectFieldTriggersProps {
+}
+declare const Triggers: {
+    (): JSX.Element;
+    displayName: string;
+};
+
+export { SelectFieldTriggersProps, Triggers };

package/lib/inputs2/selectfield/triggers.js

@@ -0,0 +1,100 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Triggers = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _icons = _interopRequireDefault(require("../../icons"));
+var _buttons = _interopRequireDefault(require("../../buttons"));
+var _list = _interopRequireWildcard(require("../../list"));
+var _context = require("./context");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const Triggers = () => {
+  const {
+    isDisabled,
+    selectFieldId,
+    listBoxOpen,
+    showClearButton,
+    dropdownAlignButton,
+    handleClearValue,
+    handleChangeListBoxState,
+    handleCheckMultiple,
+    isMultipleWithCheckboxes
+  } = (0, _context.useSelectFieldContext)();
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("button", {
+    "data-testid": "test-select-field-trigger-clear",
+    className: "clear",
+    type: "button",
+    title: "Limpar",
+    tabIndex: -1,
+    disabled: isDisabled,
+    "aria-disabled": isDisabled,
+    "aria-label": "Limpar",
+    "aria-controls": selectFieldId,
+    onClick: handleClearValue,
+    "data-state-visible": showClearButton,
+    onMouseDown: event => {
+      event.preventDefault();
+    }
+  }, /*#__PURE__*/_react.default.createElement(_icons.default, {
+    name: "cancel"
+  })), /*#__PURE__*/_react.default.createElement(_buttons.default, {
+    "data-testid": "test-select-field-trigger-options",
+    dropdown: true,
+    transparent: true,
+    boxShadow: false,
+    showIconDropdown: false,
+    visible: isMultipleWithCheckboxes,
+    type: "button",
+    title: "Op\xE7\xF5es",
+    tabIndex: -1,
+    disabled: isDisabled,
+    "aria-label": "Op\xE7\xF5es",
+    "aria-controls": selectFieldId,
+    iconName: "more1",
+    dropdownAlign: dropdownAlignButton,
+    onMouseDown: event => {
+      event.preventDefault();
+    }
+  }, /*#__PURE__*/_react.default.createElement(_list.default, null, /*#__PURE__*/_react.default.createElement(_list.ListItem, {
+    itemId: "1",
+    text: "Marcar Todos",
+    onMouseDown: event => {
+      event?.preventDefault?.();
+    },
+    onClick: () => {
+      handleCheckMultiple(true);
+    }
+  }), /*#__PURE__*/_react.default.createElement(_list.ListItem, {
+    itemId: "2",
+    text: "Desmarcar Todos",
+    onMouseDown: event => {
+      event?.preventDefault?.();
+    },
+    onClick: () => {
+      handleCheckMultiple(false);
+    }
+  }))), /*#__PURE__*/_react.default.createElement("button", {
+    "data-testid": "test-select-field-trigger-open-listbox",
+    className: "open-listbox",
+    type: "button",
+    title: !listBoxOpen ? 'Abrir' : 'Fechar',
+    tabIndex: -1,
+    disabled: isDisabled,
+    "aria-disabled": isDisabled,
+    "aria-label": !listBoxOpen ? 'Abrir' : 'Fechar',
+    "aria-expanded": listBoxOpen,
+    "aria-controls": selectFieldId,
+    onClick: handleChangeListBoxState,
+    onMouseDown: event => {
+      event.preventDefault();
+    }
+  }, /*#__PURE__*/_react.default.createElement(_icons.default, {
+    name: "mini_down"
+  })));
+};
+exports.Triggers = Triggers;
+Triggers.displayName = 'SelectFieldTriggers';

package/lib/inputs2/selectfield/types.d.ts

@@ -0,0 +1,55 @@
+import { TextAlign } from '../../@types/Align.js';
+import { ColorTheme } from '../../@types/ColorStyles.js';
+import { ITooltipCommonProps } from '../../tooltip/types.js';
+import { HintPosition, Position } from '../../@types/Position.js';
+import { PermissionAttr, OnDenied } from '../../@types/PermissionAttr.js';
+import 'react';
+
+declare enum MultipleVariantEnum {
+    default = "default",
+    checkboxes = "checkboxes"
+}
+declare enum Keys {
+    escape = "Escape",
+    arrowDown = "ArrowDown",
+    arrowUp = "ArrowUp",
+    enter = "Enter",
+    backspace = "Backspace",
+    delete = "Delete",
+    spaceBar = " "
+}
+type InputHTMLProps = Omit<React.ComponentProps<'input'>, 'multiple' | 'type'>;
+interface SelectFieldInputProps extends InputHTMLProps, ITooltipCommonProps {
+    skeletonize?: boolean;
+    undigitable?: boolean;
+    externalSearch?: boolean;
+    showClearButton?: boolean;
+    searchOnDropdown?: boolean;
+    openDropdownOnFocus?: boolean;
+    value?: any;
+    label?: string;
+    errors?: string[];
+    striped?: boolean;
+    hint?: string;
+    gridLayout?: string;
+    notFoundFilterLabel?: string;
+    customClass?: string;
+    customClassLabel?: string;
+    customClassWrapper?: string;
+    searchInputPlaceholder?: string;
+    customClassInputContainer?: string;
+    multipleInputLabelEmpty?: string;
+    multipleInputLabelOneSelection?: string;
+    multipleInputLabelManySelection?: string;
+    textAlign?: TextAlign;
+    hintPosition?: HintPosition;
+    themePopover?: ColorTheme;
+    popoverAlign?: Extract<Position, 'left' | 'right'>;
+    permissionAttr?: PermissionAttr;
+    onDeniedActions?: OnDenied;
+    dropdownAlignButton?: Extract<Position, 'left' | 'right'>;
+    onSearch?: (event?: React.ChangeEvent<HTMLInputElement>) => void;
+    multiple?: keyof typeof MultipleVariantEnum;
+}
+
+export { Keys, MultipleVariantEnum, SelectFieldInputProps };

package/lib/inputs2/selectfield/types.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MultipleVariantEnum = exports.Keys = void 0;
+let MultipleVariantEnum = exports.MultipleVariantEnum = /*#__PURE__*/function (MultipleVariantEnum) {
+  MultipleVariantEnum["default"] = "default";
+  MultipleVariantEnum["checkboxes"] = "checkboxes";
+  return MultipleVariantEnum;
+}({});
+let Keys = exports.Keys = /*#__PURE__*/function (Keys) {
+  Keys["escape"] = "Escape";
+  Keys["arrowDown"] = "ArrowDown";
+  Keys["arrowUp"] = "ArrowUp";
+  Keys["enter"] = "Enter";
+  Keys["backspace"] = "Backspace";
+  Keys["delete"] = "Delete";
+  Keys["spaceBar"] = " ";
+  return Keys;
+}({});

package/lib/inputs2/slot/index.d.ts

@@ -0,0 +1,14 @@
+import React__default from 'react';
+
+declare enum SlotPosition {
+    left = "left",
+    right = "right"
+}
+interface SlotProps extends React__default.ComponentProps<'div'> {
+    children: React__default.ReactNode;
+    disabled?: boolean;
+}
+declare const LeftSlot: React__default.ForwardRefExoticComponent<Pick<SlotProps, "className" | "disabled" | "onClick" | "color" | "children" | "style" | "id" | "key" | "slot" | "title" | "hidden" | "onKeyPress" | "role" | "tabIndex" | "align" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "lang" | "nonce" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & React__default.RefAttributes<HTMLDivElement>>;
+declare const RightSlot: React__default.ForwardRefExoticComponent<Pick<SlotProps, "className" | "disabled" | "onClick" | "color" | "children" | "style" | "id" | "key" | "slot" | "title" | "hidden" | "onKeyPress" | "role" | "tabIndex" | "align" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "lang" | "nonce" | "placeholder" | "spellCheck" | "translate" | "radioGroup" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onResize" | "onResizeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture"> & React__default.RefAttributes<HTMLDivElement>>;
+
+export { LeftSlot, RightSlot, SlotPosition, SlotProps };

package/lib/inputs2/slot/index.js

@@ -0,0 +1,47 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RightSlot = exports.LeftSlot = void 0;
+require("../../assets/styles/slot.scss");
+var _react = _interopRequireDefault(require("react"));
+const _excluded = ["children"],
+  _excluded2 = ["children"];
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+var SlotPosition = /*#__PURE__*/function (SlotPosition) {
+  SlotPosition["left"] = "left";
+  SlotPosition["right"] = "right";
+  return SlotPosition;
+}(SlotPosition || {});
+const LeftSlot = exports.LeftSlot = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+  const {
+      children
+    } = props,
+    rest = _objectWithoutProperties(props, _excluded);
+  return /*#__PURE__*/_react.default.createElement("div", _extends({
+    ref: ref,
+    className: "field-slot",
+    "aria-disabled": props['aria-disabled'],
+    "data-state-disabled": props.disabled,
+    "data-state-position": SlotPosition.left
+  }, rest), children);
+});
+LeftSlot.displayName = 'LeftSlot';
+const RightSlot = exports.RightSlot = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+  const {
+      children
+    } = props,
+    rest = _objectWithoutProperties(props, _excluded2);
+  return /*#__PURE__*/_react.default.createElement("div", _extends({
+    ref: ref,
+    className: "field-slot",
+    "aria-disabled": props['aria-disabled'],
+    "data-state-disabled": props.disabled,
+    "data-state-position": SlotPosition.right
+  }, rest), children);
+});
+RightSlot.displayName = 'RightSlot';

package/lib/inputs2/textfield/index.d.ts

@@ -0,0 +1,8 @@
+import 'react';
+import '../../@types/Align.js';
+import '../../@types/ColorStyles.js';
+import '../../@types/Position.js';
+import '../../@types/PermissionAttr.js';
+export { LeftSlot, RightSlot } from '../slot/index.js';
+import '../../tooltip/types.js';
+export { I as Input, T as TextFieldInputProps } from '../../index-772f9f1a.js';