@economic/taco 2.48.5 → 2.49.0-server.2

package/dist/esm/packages/taco/src/components/ScrollArea/ScrollArea.js

@@ -1,9 +1,11 @@
 import React__default from 'react';
 import cn from 'clsx';
+import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { Root, Viewport, Scrollbar, Thumb as Thumb$1, Corner as Corner$1 } from '@radix-ui/react-scroll-area';
 
-const Bar = props => {
-  const className = cn(`flex select-none touch-none transition-colors hover:bg-grey`, {
+var _excluded = ["children"];
+var Bar = function Bar(props) {
+  var className = cn("flex select-none touch-none transition-colors hover:bg-grey", {
     'w-[7px] hover:w-[14px] mr-[2px] hover:px-[2px] hover:mr-0': props.orientation === 'vertical',
     'flex-col h-[7px] hover:h-[14px] mb-[2px] hover:py-[2px] hover:mb-0': props.orientation === 'horizontal'
   });
@@ -11,17 +13,19 @@ const Bar = props => {
     className: className
   }));
 };
-const Thumb = props => /*#__PURE__*/React__default.createElement(Thumb$1, Object.assign({}, props, {
-  className: "flex-[1] rounded bg-black opacity-50"
-}));
-const Corner = props => /*#__PURE__*/React__default.createElement(Corner$1, Object.assign({}, props, {
-  className: "bg-grey-500"
-}));
-const ScrollArea = props => {
-  const {
-    children,
-    ...otherProps
-  } = props;
+var Thumb = function Thumb(props) {
+  return /*#__PURE__*/React__default.createElement(Thumb$1, Object.assign({}, props, {
+    className: "flex-[1] rounded bg-black opacity-50"
+  }));
+};
+var Corner = function Corner(props) {
+  return /*#__PURE__*/React__default.createElement(Corner$1, Object.assign({}, props, {
+    className: "bg-grey-500"
+  }));
+};
+var ScrollArea = function ScrollArea(props) {
+  var children = props.children,
+    otherProps = _objectWithoutPropertiesLoose(props, _excluded);
   return /*#__PURE__*/React__default.createElement(Root, Object.assign({}, otherProps, {
     className: cn('overflow-hidden', props.className),
     "data-taco": "scrollarea"

package/dist/esm/packages/taco/src/components/ScrollArea/ScrollArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"ScrollArea.js","sources":["../../../../../../../src/components/ScrollArea/ScrollArea.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';\n\nconst Bar = props => {\n    const className = cn(`flex select-none touch-none transition-colors hover:bg-grey`, {\n        'w-[7px] hover:w-[14px] mr-[2px] hover:px-[2px] hover:mr-0': props.orientation === 'vertical',\n        'flex-col h-[7px] hover:h-[14px] mb-[2px] hover:py-[2px] hover:mb-0': props.orientation === 'horizontal',\n    });\n    return <ScrollAreaPrimitive.Scrollbar {...props} className={className} />;\n};\n\nconst Thumb = props => <ScrollAreaPrimitive.Thumb {...props} className=\"flex-[1] rounded bg-black opacity-50\" />;\n\nconst Corner = props => <ScrollAreaPrimitive.Corner {...props} className=\"bg-grey-500\" />;\n\nexport type ScrollbarProps = Omit<ScrollAreaPrimitive.ScrollAreaProps, 'scrollHideDelay'>;\n\nexport const ScrollArea = (props: ScrollbarProps) => {\n    const { children, ...otherProps } = props;\n\n    return (\n        <ScrollAreaPrimitive.Root {...otherProps} className={cn('overflow-hidden', props.className)} data-taco=\"scrollarea\">\n            <ScrollAreaPrimitive.Viewport className=\"h-full w-full\">{children}</ScrollAreaPrimitive.Viewport>\n            <Bar orientation=\"vertical\">\n                <Thumb />\n            </Bar>\n            <Bar orientation=\"horizontal\">\n                <Thumb />\n            </Bar>\n            <Corner />\n        </ScrollAreaPrimitive.Root>\n    );\n};\n"],"names":["Bar","props","className","cn","orientation","React","ScrollAreaPrimitive","Thumb","Corner","ScrollArea","children","otherProps"],"mappings":";;;;AAIA,MAAMA,GAAG,GAAGC,KAAK;EACb,MAAMC,SAAS,GAAGC,EAAE,CAAC,6DAA6D,EAAE;IAChF,2DAA2D,EAAEF,KAAK,CAACG,WAAW,KAAK,UAAU;IAC7F,oEAAoE,EAAEH,KAAK,CAACG,WAAW,KAAK;GAC/F,CAAC;EACF,oBAAOC,6BAACC,SAA6B,oBAAKL,KAAK;IAAEC,SAAS,EAAEA;KAAa;AAC7E,CAAC;AAED,MAAMK,KAAK,GAAGN,KAAK,iBAAII,6BAACC,OAAyB,oBAAKL,KAAK;EAAEC,SAAS,EAAC;GAAyC;AAEhH,MAAMM,MAAM,GAAGP,KAAK,iBAAII,6BAACC,QAA0B,oBAAKL,KAAK;EAAEC,SAAS,EAAC;GAAgB;MAI5EO,UAAU,GAAIR,KAAqB;EAC5C,MAAM;IAAES,QAAQ;IAAE,GAAGC;GAAY,GAAGV,KAAK;EAEzC,oBACII,6BAACC,IAAwB,oBAAKK,UAAU;IAAET,SAAS,EAAEC,EAAE,CAAC,iBAAiB,EAAEF,KAAK,CAACC,SAAS,CAAC;iBAAY;mBACnGG,6BAACC,QAA4B;IAACJ,SAAS,EAAC;KAAiBQ,QAAQ,CAAgC,eACjGL,6BAACL,GAAG;IAACI,WAAW,EAAC;kBACbC,6BAACE,KAAK,OAAG,CACP,eACNF,6BAACL,GAAG;IAACI,WAAW,EAAC;kBACbC,6BAACE,KAAK,OAAG,CACP,eACNF,6BAACG,MAAM,OAAG,CACa;AAEnC;;;;"}
+{"version":3,"file":"ScrollArea.js","sources":["../../../../../../../src/components/ScrollArea/ScrollArea.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';\n\nconst Bar = props => {\n    const className = cn(`flex select-none touch-none transition-colors hover:bg-grey`, {\n        'w-[7px] hover:w-[14px] mr-[2px] hover:px-[2px] hover:mr-0': props.orientation === 'vertical',\n        'flex-col h-[7px] hover:h-[14px] mb-[2px] hover:py-[2px] hover:mb-0': props.orientation === 'horizontal',\n    });\n    return <ScrollAreaPrimitive.Scrollbar {...props} className={className} />;\n};\n\nconst Thumb = props => <ScrollAreaPrimitive.Thumb {...props} className=\"flex-[1] rounded bg-black opacity-50\" />;\n\nconst Corner = props => <ScrollAreaPrimitive.Corner {...props} className=\"bg-grey-500\" />;\n\nexport type ScrollbarProps = Omit<ScrollAreaPrimitive.ScrollAreaProps, 'scrollHideDelay'>;\n\nexport const ScrollArea = (props: ScrollbarProps) => {\n    const { children, ...otherProps } = props;\n\n    return (\n        <ScrollAreaPrimitive.Root {...otherProps} className={cn('overflow-hidden', props.className)} data-taco=\"scrollarea\">\n            <ScrollAreaPrimitive.Viewport className=\"h-full w-full\">{children}</ScrollAreaPrimitive.Viewport>\n            <Bar orientation=\"vertical\">\n                <Thumb />\n            </Bar>\n            <Bar orientation=\"horizontal\">\n                <Thumb />\n            </Bar>\n            <Corner />\n        </ScrollAreaPrimitive.Root>\n    );\n};\n"],"names":["Bar","props","className","cn","orientation","React","ScrollAreaPrimitive","Thumb","Corner","ScrollArea","children","otherProps","_objectWithoutPropertiesLoose","_excluded"],"mappings":";;;;;;AAIA,IAAMA,GAAG,GAAG,SAANA,GAAGA,CAAGC,KAAK;EACb,IAAMC,SAAS,GAAGC,EAAE,gEAAgE;IAChF,2DAA2D,EAAEF,KAAK,CAACG,WAAW,KAAK,UAAU;IAC7F,oEAAoE,EAAEH,KAAK,CAACG,WAAW,KAAK;GAC/F,CAAC;EACF,oBAAOC,6BAACC,SAA6B,oBAAKL,KAAK;IAAEC,SAAS,EAAEA;KAAa;AAC7E,CAAC;AAED,IAAMK,KAAK,GAAG,SAARA,KAAKA,CAAGN,KAAK;EAAA,oBAAII,6BAACC,OAAyB,oBAAKL,KAAK;IAAEC,SAAS,EAAC;KAAyC;AAAA;AAEhH,IAAMM,MAAM,GAAG,SAATA,MAAMA,CAAGP,KAAK;EAAA,oBAAII,6BAACC,QAA0B,oBAAKL,KAAK;IAAEC,SAAS,EAAC;KAAgB;AAAA;IAI5EO,UAAU,GAAG,SAAbA,UAAUA,CAAIR,KAAqB;EAC5C,IAAQS,QAAQ,GAAoBT,KAAK,CAAjCS,QAAQ;IAAKC,UAAU,GAAAC,6BAAA,CAAKX,KAAK,EAAAY,SAAA;EAEzC,oBACIR,6BAACC,IAAwB,oBAAKK,UAAU;IAAET,SAAS,EAAEC,EAAE,CAAC,iBAAiB,EAAEF,KAAK,CAACC,SAAS,CAAC;iBAAY;mBACnGG,6BAACC,QAA4B;IAACJ,SAAS,EAAC;KAAiBQ,QAAQ,CAAgC,eACjGL,6BAACL,GAAG;IAACI,WAAW,EAAC;kBACbC,6BAACE,KAAK,OAAG,CACP,eACNF,6BAACL,GAAG;IAACI,WAAW,EAAC;kBACbC,6BAACE,KAAK,OAAG,CACP,eACNF,6BAACG,MAAM,OAAG,CACa;AAEnC;;;;"}

package/dist/esm/packages/taco/src/components/SearchInput/SearchInput.js

@@ -1,26 +1,26 @@
 import { forwardRef, createElement, Fragment } from 'react';
+import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { useMergedRef } from '../../hooks/useMergedRef.js';
 import { IconButton } from '../IconButton/IconButton.js';
 import { useLocalization } from '../Provider/Localization.js';
 import { Input } from '../Input/Input.js';
 import { setInputValueByRef } from '../../utils/input.js';
 
-const SearchInput = /*#__PURE__*/forwardRef(function SearchInput({
-  onSearch,
-  ...props
-}, ref) {
-  const internalRef = useMergedRef(ref);
-  const {
-    texts
-  } = useLocalization();
-  const handleClick = () => {
+var _excluded = ["onSearch"];
+var SearchInput = /*#__PURE__*/forwardRef(function SearchInput(_ref, ref) {
+  var onSearch = _ref.onSearch,
+    props = _objectWithoutPropertiesLoose(_ref, _excluded);
+  var internalRef = useMergedRef(ref);
+  var _useLocalization = useLocalization(),
+    texts = _useLocalization.texts;
+  var handleClick = function handleClick() {
     var _internalRef$current$, _internalRef$current;
     onSearch === null || onSearch === void 0 ? void 0 : onSearch((_internalRef$current$ = (_internalRef$current = internalRef.current) === null || _internalRef$current === void 0 ? void 0 : _internalRef$current.value) !== null && _internalRef$current$ !== void 0 ? _internalRef$current$ : '');
   };
-  const handleCancelClick = () => {
+  var handleCancelClick = function handleCancelClick() {
     setInputValueByRef(internalRef.current, '');
   };
-  const handleKeyDown = event => {
+  var handleKeyDown = function handleKeyDown(event) {
     var _props$onKeyDown;
     (_props$onKeyDown = props.onKeyDown) === null || _props$onKeyDown === void 0 ? void 0 : _props$onKeyDown.call(props, event);
     if (event.isDefaultPrevented()) {

package/dist/esm/packages/taco/src/components/SearchInput/SearchInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchInput.js","sources":["../../../../../../../src/components/SearchInput/SearchInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Input, InputProps } from '../Input/Input';\nimport { useLocalization } from '../Provider/Localization';\nimport { IconButton } from '../IconButton/IconButton';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { setInputValueByRef } from '../../utils/input';\n\nexport type SearchInputTexts = {\n    button: string;\n    clear: string;\n    findNext: string;\n    findPrevious: string;\n    placeholder: string;\n};\n\nexport type SearchInputProps = Omit<InputProps, 'button' | 'icon' | 'prefix' | 'postfix'> & {\n    /** Current input value will be passed to the method. In order to get the value, the component must be controlled otherwise value will always be undefined */\n    onSearch?: (value: string | number | readonly string[] | undefined) => void;\n};\n\nexport const SearchInput = React.forwardRef(function SearchInput(\n    { onSearch, ...props }: SearchInputProps,\n    ref: React.Ref<HTMLInputElement>\n) {\n    const internalRef = useMergedRef<HTMLInputElement>(ref);\n    const { texts } = useLocalization();\n\n    const handleClick = (): void => {\n        onSearch?.(internalRef.current?.value ?? '');\n    };\n\n    const handleCancelClick = (): void => {\n        setInputValueByRef(internalRef.current, '');\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n        props.onKeyDown?.(event);\n\n        if (event.isDefaultPrevented()) {\n            return;\n        }\n\n        if (event.key === 'Enter') {\n            event.preventDefault();\n            handleClick();\n            return;\n        }\n\n        if (event.key === 'Escape') {\n            onSearch?.('');\n            return;\n        }\n    };\n\n    return (\n        <Input\n            aria-label={texts.searchInput.placeholder}\n            placeholder={texts.searchInput.placeholder}\n            {...props}\n            onKeyDown={handleKeyDown}\n            postfix={\n                <>\n                    {props.disabled || props.readOnly || !props.value ? null : (\n                        <IconButton\n                            aria-hidden\n                            aria-label={texts.searchInput.clear}\n                            className=\"group-peer-focus:visible group-peer-hover:visible !text-grey-700 invisible mr-0.5 !h-5 !min-h-[theme(spacing.4)] !w-5 !min-w-[theme(spacing.4)] text-xs hover:visible group-hover:visible\"\n                            icon=\"close\"\n                            onClick={handleCancelClick}\n                            rounded\n                            tabIndex={-1}\n                            tooltip={texts.searchInput.clear}\n                        />\n                    )}\n                    <IconButton\n                        aria-label={texts.searchInput.button}\n                        icon=\"search\"\n                        className=\"group-peer-focus:!border-transparent group-peer-focus:group-peer-active:!border-transparent -mr-2 !border-transparent !bg-transparent focus:!border-transparent\"\n                        disabled={props.disabled || props.readOnly}\n                        onClick={handleClick}\n                        tabIndex={-1}\n                        tooltip={texts.searchInput.button}\n                    />\n                </>\n            }\n            ref={internalRef}\n            type=\"search\"\n        />\n    );\n});\n"],"names":["SearchInput","React","onSearch","props","ref","internalRef","useMergedRef","texts","useLocalization","handleClick","_internalRef$current$","_internalRef$current","current","value","handleCancelClick","setInputValueByRef","handleKeyDown","event","_props$onKeyDown","onKeyDown","call","isDefaultPrevented","key","preventDefault","Input","searchInput","placeholder","postfix","disabled","readOnly","IconButton","clear","className","icon","onClick","rounded","tabIndex","tooltip","button","type"],"mappings":";;;;;;;MAoBaA,WAAW,gBAAGC,UAAgB,CAAC,SAASD,WAAWA,CAC5D;EAAEE,QAAQ;EAAE,GAAGC;CAAyB,EACxCC,GAAgC;EAEhC,MAAMC,WAAW,GAAGC,YAAY,CAAmBF,GAAG,CAAC;EACvD,MAAM;IAAEG;GAAO,GAAGC,eAAe,EAAE;EAEnC,MAAMC,WAAW,GAAGA;;IAChBP,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,EAAAQ,qBAAA,IAAAC,oBAAA,GAAGN,WAAW,CAACO,OAAO,cAAAD,oBAAA,uBAAnBA,oBAAA,CAAqBE,KAAK,cAAAH,qBAAA,cAAAA,qBAAA,GAAI,EAAE,CAAC;GAC/C;EAED,MAAMI,iBAAiB,GAAGA;IACtBC,kBAAkB,CAACV,WAAW,CAACO,OAAO,EAAE,EAAE,CAAC;GAC9C;EAED,MAAMI,aAAa,GAAIC,KAA4C;;IAC/D,CAAAC,gBAAA,GAAAf,KAAK,CAACgB,SAAS,cAAAD,gBAAA,uBAAfA,gBAAA,CAAAE,IAAA,CAAAjB,KAAK,EAAac,KAAK,CAAC;IAExB,IAAIA,KAAK,CAACI,kBAAkB,EAAE,EAAE;MAC5B;;IAGJ,IAAIJ,KAAK,CAACK,GAAG,KAAK,OAAO,EAAE;MACvBL,KAAK,CAACM,cAAc,EAAE;MACtBd,WAAW,EAAE;MACb;;IAGJ,IAAIQ,KAAK,CAACK,GAAG,KAAK,QAAQ,EAAE;MACxBpB,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAG,EAAE,CAAC;MACd;;GAEP;EAED,oBACID,cAACuB,KAAK;kBACUjB,KAAK,CAACkB,WAAW,CAACC,WAAW;IACzCA,WAAW,EAAEnB,KAAK,CAACkB,WAAW,CAACC;KAC3BvB,KAAK;IACTgB,SAAS,EAAEH,aAAa;IACxBW,OAAO,eACH1B,8BACKE,KAAK,CAACyB,QAAQ,IAAIzB,KAAK,CAAC0B,QAAQ,IAAI,CAAC1B,KAAK,CAACU,KAAK,GAAG,IAAI,iBACpDZ,cAAC6B,UAAU;;oBAEKvB,KAAK,CAACkB,WAAW,CAACM,KAAK;MACnCC,SAAS,EAAC,2LAA2L;MACrMC,IAAI,EAAC,OAAO;MACZC,OAAO,EAAEpB,iBAAiB;MAC1BqB,OAAO;MACPC,QAAQ,EAAE,CAAC,CAAC;MACZC,OAAO,EAAE9B,KAAK,CAACkB,WAAW,CAACM;MAC7B,CACL,eACD9B,cAAC6B,UAAU;oBACKvB,KAAK,CAACkB,WAAW,CAACa,MAAM;MACpCL,IAAI,EAAC,QAAQ;MACbD,SAAS,EAAC,iKAAiK;MAC3KJ,QAAQ,EAAEzB,KAAK,CAACyB,QAAQ,IAAIzB,KAAK,CAAC0B,QAAQ;MAC1CK,OAAO,EAAEzB,WAAW;MACpB2B,QAAQ,EAAE,CAAC,CAAC;MACZC,OAAO,EAAE9B,KAAK,CAACkB,WAAW,CAACa;MAC7B,CACH;IAEPlC,GAAG,EAAEC,WAAW;IAChBkC,IAAI,EAAC;KACP;AAEV,CAAC;;;;"}
+{"version":3,"file":"SearchInput.js","sources":["../../../../../../../src/components/SearchInput/SearchInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Input, InputProps } from '../Input/Input';\nimport { useLocalization } from '../Provider/Localization';\nimport { IconButton } from '../IconButton/IconButton';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { setInputValueByRef } from '../../utils/input';\n\nexport type SearchInputTexts = {\n    button: string;\n    clear: string;\n    findNext: string;\n    findPrevious: string;\n    placeholder: string;\n};\n\nexport type SearchInputProps = Omit<InputProps, 'button' | 'icon' | 'prefix' | 'postfix'> & {\n    /** Current input value will be passed to the method. In order to get the value, the component must be controlled otherwise value will always be undefined */\n    onSearch?: (value: string | number | readonly string[] | undefined) => void;\n};\n\nexport const SearchInput = React.forwardRef(function SearchInput(\n    { onSearch, ...props }: SearchInputProps,\n    ref: React.Ref<HTMLInputElement>\n) {\n    const internalRef = useMergedRef<HTMLInputElement>(ref);\n    const { texts } = useLocalization();\n\n    const handleClick = (): void => {\n        onSearch?.(internalRef.current?.value ?? '');\n    };\n\n    const handleCancelClick = (): void => {\n        setInputValueByRef(internalRef.current, '');\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n        props.onKeyDown?.(event);\n\n        if (event.isDefaultPrevented()) {\n            return;\n        }\n\n        if (event.key === 'Enter') {\n            event.preventDefault();\n            handleClick();\n            return;\n        }\n\n        if (event.key === 'Escape') {\n            onSearch?.('');\n            return;\n        }\n    };\n\n    return (\n        <Input\n            aria-label={texts.searchInput.placeholder}\n            placeholder={texts.searchInput.placeholder}\n            {...props}\n            onKeyDown={handleKeyDown}\n            postfix={\n                <>\n                    {props.disabled || props.readOnly || !props.value ? null : (\n                        <IconButton\n                            aria-hidden\n                            aria-label={texts.searchInput.clear}\n                            className=\"group-peer-focus:visible group-peer-hover:visible !text-grey-700 invisible mr-0.5 !h-5 !min-h-[theme(spacing.4)] !w-5 !min-w-[theme(spacing.4)] text-xs hover:visible group-hover:visible\"\n                            icon=\"close\"\n                            onClick={handleCancelClick}\n                            rounded\n                            tabIndex={-1}\n                            tooltip={texts.searchInput.clear}\n                        />\n                    )}\n                    <IconButton\n                        aria-label={texts.searchInput.button}\n                        icon=\"search\"\n                        className=\"group-peer-focus:!border-transparent group-peer-focus:group-peer-active:!border-transparent -mr-2 !border-transparent !bg-transparent focus:!border-transparent\"\n                        disabled={props.disabled || props.readOnly}\n                        onClick={handleClick}\n                        tabIndex={-1}\n                        tooltip={texts.searchInput.button}\n                    />\n                </>\n            }\n            ref={internalRef}\n            type=\"search\"\n        />\n    );\n});\n"],"names":["SearchInput","React","_ref","ref","onSearch","props","_objectWithoutPropertiesLoose","_excluded","internalRef","useMergedRef","_useLocalization","useLocalization","texts","handleClick","_internalRef$current$","_internalRef$current","current","value","handleCancelClick","setInputValueByRef","handleKeyDown","event","_props$onKeyDown","onKeyDown","call","isDefaultPrevented","key","preventDefault","Input","searchInput","placeholder","postfix","disabled","readOnly","IconButton","clear","className","icon","onClick","rounded","tabIndex","tooltip","button","type"],"mappings":";;;;;;;;;IAoBaA,WAAW,gBAAGC,UAAgB,CAAC,SAASD,WAAWA,CAAAE,IAAA,EAE5DC,GAAgC;MAD9BC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IAAKC,KAAK,GAAAC,6BAAA,CAAAJ,IAAA,EAAAK,SAAA;EAGpB,IAAMC,WAAW,GAAGC,YAAY,CAAmBN,GAAG,CAAC;EACvD,IAAAO,gBAAA,GAAkBC,eAAe,EAAE;IAA3BC,KAAK,GAAAF,gBAAA,CAALE,KAAK;EAEb,IAAMC,WAAW,GAAG,SAAdA,WAAWA;;IACbT,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,EAAAU,qBAAA,IAAAC,oBAAA,GAAGP,WAAW,CAACQ,OAAO,cAAAD,oBAAA,uBAAnBA,oBAAA,CAAqBE,KAAK,cAAAH,qBAAA,cAAAA,qBAAA,GAAI,EAAE,CAAC;GAC/C;EAED,IAAMI,iBAAiB,GAAG,SAApBA,iBAAiBA;IACnBC,kBAAkB,CAACX,WAAW,CAACQ,OAAO,EAAE,EAAE,CAAC;GAC9C;EAED,IAAMI,aAAa,GAAG,SAAhBA,aAAaA,CAAIC,KAA4C;;IAC/D,CAAAC,gBAAA,GAAAjB,KAAK,CAACkB,SAAS,cAAAD,gBAAA,uBAAfA,gBAAA,CAAAE,IAAA,CAAAnB,KAAK,EAAagB,KAAK,CAAC;IAExB,IAAIA,KAAK,CAACI,kBAAkB,EAAE,EAAE;MAC5B;;IAGJ,IAAIJ,KAAK,CAACK,GAAG,KAAK,OAAO,EAAE;MACvBL,KAAK,CAACM,cAAc,EAAE;MACtBd,WAAW,EAAE;MACb;;IAGJ,IAAIQ,KAAK,CAACK,GAAG,KAAK,QAAQ,EAAE;MACxBtB,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAG,EAAE,CAAC;MACd;;GAEP;EAED,oBACIH,cAAC2B,KAAK;kBACUhB,KAAK,CAACiB,WAAW,CAACC,WAAW;IACzCA,WAAW,EAAElB,KAAK,CAACiB,WAAW,CAACC;KAC3BzB,KAAK;IACTkB,SAAS,EAAEH,aAAa;IACxBW,OAAO,eACH9B,8BACKI,KAAK,CAAC2B,QAAQ,IAAI3B,KAAK,CAAC4B,QAAQ,IAAI,CAAC5B,KAAK,CAACY,KAAK,GAAG,IAAI,iBACpDhB,cAACiC,UAAU;;oBAEKtB,KAAK,CAACiB,WAAW,CAACM,KAAK;MACnCC,SAAS,EAAC,2LAA2L;MACrMC,IAAI,EAAC,OAAO;MACZC,OAAO,EAAEpB,iBAAiB;MAC1BqB,OAAO;MACPC,QAAQ,EAAE,CAAC,CAAC;MACZC,OAAO,EAAE7B,KAAK,CAACiB,WAAW,CAACM;MAC7B,CACL,eACDlC,cAACiC,UAAU;oBACKtB,KAAK,CAACiB,WAAW,CAACa,MAAM;MACpCL,IAAI,EAAC,QAAQ;MACbD,SAAS,EAAC,iKAAiK;MAC3KJ,QAAQ,EAAE3B,KAAK,CAAC2B,QAAQ,IAAI3B,KAAK,CAAC4B,QAAQ;MAC1CK,OAAO,EAAEzB,WAAW;MACpB2B,QAAQ,EAAE,CAAC,CAAC;MACZC,OAAO,EAAE7B,KAAK,CAACiB,WAAW,CAACa;MAC7B,CACH;IAEPvC,GAAG,EAAEK,WAAW;IAChBmC,IAAI,EAAC;KACP;AAEV,CAAC;;;;"}

package/dist/esm/packages/taco/src/components/SearchInput2/SearchInput2.js

@@ -1,5 +1,6 @@
 import React__default from 'react';
 import cn from 'clsx';
+import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { Icon } from '../Icon/Icon.js';
 import { useMergedRef } from '../../hooks/useMergedRef.js';
 import { useGlobalKeyDown } from '../../hooks/useGlobalKeyDown.js';
@@ -9,37 +10,40 @@ import { Spinner } from '../Spinner/Spinner.js';
 import { Input } from '../Input/Input.js';
 import { Shortcut } from '../Shortcut/Shortcut.js';
 
-const SearchInput2 = /*#__PURE__*/React__default.forwardRef(function SearchInput2(props, ref) {
+var _excluded = ["findCurrent", "findTotal", "loading", "onChange", "onClear", "onClickFindNext", "onClickFindPrevious", "settingsContent", "shortcut", "showTotal", "value"];
+var SearchInput2 = /*#__PURE__*/React__default.forwardRef(function SearchInput2(props, ref) {
   var _attributes$ariaLabe, _attributes$placehold;
-  const {
-    findCurrent,
-    findTotal,
-    loading = false,
-    onChange: handleChange,
-    onClear,
-    onClickFindNext: handleClickFindNext,
-    onClickFindPrevious: handleClickFindPrevious,
-    settingsContent,
-    shortcut,
-    value,
-    ...attributes
-  } = props;
-  const internalRef = useMergedRef(ref);
-  const containerRef = React__default.useRef(null);
-  const [focused, setFocused] = React__default.useState(false);
-  const {
-    texts
-  } = useLocalization();
-  const isActive = value === null || value === void 0 ? void 0 : value.length;
-  const hasFind = handleClickFindNext !== undefined && handleClickFindPrevious !== undefined && findCurrent !== undefined && findTotal !== undefined;
-  useGlobalKeyDown(shortcut, event => {
+  var findCurrent = props.findCurrent,
+    findTotal = props.findTotal,
+    _props$loading = props.loading,
+    loading = _props$loading === void 0 ? false : _props$loading,
+    handleChange = props.onChange,
+    onClear = props.onClear,
+    handleClickFindNext = props.onClickFindNext,
+    handleClickFindPrevious = props.onClickFindPrevious,
+    settingsContent = props.settingsContent,
+    shortcut = props.shortcut,
+    _props$showTotal = props.showTotal,
+    showTotal = _props$showTotal === void 0 ? true : _props$showTotal,
+    value = props.value,
+    attributes = _objectWithoutPropertiesLoose(props, _excluded);
+  var internalRef = useMergedRef(ref);
+  var containerRef = React__default.useRef(null);
+  var _React$useState = React__default.useState(false),
+    focused = _React$useState[0],
+    setFocused = _React$useState[1];
+  var _useLocalization = useLocalization(),
+    texts = _useLocalization.texts;
+  var isActive = value === null || value === void 0 ? void 0 : value.length;
+  var hasFind = handleClickFindNext !== undefined && handleClickFindPrevious !== undefined && findCurrent !== undefined && findTotal !== undefined;
+  useGlobalKeyDown(shortcut, function (event) {
     if (document.activeElement !== internalRef.current) {
       var _internalRef$current;
       event.preventDefault();
       (_internalRef$current = internalRef.current) === null || _internalRef$current === void 0 ? void 0 : _internalRef$current.focus();
     }
   });
-  const handleBlur = event => {
+  var handleBlur = function handleBlur(event) {
     var _containerRef$current, _attributes$onBlur;
     if (containerRef.current && (containerRef.current === event.relatedTarget || (_containerRef$current = containerRef.current) !== null && _containerRef$current !== void 0 && _containerRef$current.contains(event.relatedTarget))) {
       return;
@@ -47,20 +51,20 @@ const SearchInput2 = /*#__PURE__*/React__default.forwardRef(function SearchInput
     setFocused(false);
     (_attributes$onBlur = attributes.onBlur) === null || _attributes$onBlur === void 0 ? void 0 : _attributes$onBlur.call(attributes, event);
   };
-  const handleClear = () => {
-    requestAnimationFrame(() => {
+  var handleClear = function handleClear() {
+    requestAnimationFrame(function () {
       var _internalRef$current2;
       return (_internalRef$current2 = internalRef.current) === null || _internalRef$current2 === void 0 ? void 0 : _internalRef$current2.blur();
     });
     handleChange('');
     onClear === null || onClear === void 0 ? void 0 : onClear();
   };
-  const handleFocus = event => {
+  var handleFocus = function handleFocus(event) {
     var _attributes$onFocus;
     setFocused(true);
     (_attributes$onFocus = attributes.onFocus) === null || _attributes$onFocus === void 0 ? void 0 : _attributes$onFocus.call(attributes, event);
   };
-  const handleKeyDown = event => {
+  var handleKeyDown = function handleKeyDown(event) {
     var _props$onKeyDown;
     (_props$onKeyDown = props.onKeyDown) === null || _props$onKeyDown === void 0 ? void 0 : _props$onKeyDown.call(props, event);
     if (event.isDefaultPrevented()) {
@@ -83,7 +87,7 @@ const SearchInput2 = /*#__PURE__*/React__default.forwardRef(function SearchInput
       return;
     }
   };
-  let postfix;
+  var postfix;
   if (!attributes.disabled && !attributes.readOnly && (value || focused)) {
     if (value) {
       postfix = /*#__PURE__*/React__default.createElement(IconButton, {
@@ -99,10 +103,12 @@ const SearchInput2 = /*#__PURE__*/React__default.forwardRef(function SearchInput
     }
     if (hasFind && isActive) {
       postfix = /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("span", {
-        className: "text-grey-700 flex h-4 items-center border-r border-black/[0.25] pr-2"
-      }, loading ? /*#__PURE__*/React__default.createElement(Spinner, {
+        className: "text-grey-700 flex h-4 items-center"
+      }, loading ? (/*#__PURE__*/React__default.createElement(Spinner, {
         className: "h-4 w-4"
-      }) : `${findCurrent !== null && findCurrent !== void 0 ? findCurrent : 0}/${findTotal !== null && findTotal !== void 0 ? findTotal : 0}`), findCurrent ? (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(IconButton, {
+      })) : showTotal ? (/*#__PURE__*/React__default.createElement("span", {
+        className: "border-r border-black/[0.25] pr-2"
+      }, (findCurrent !== null && findCurrent !== void 0 ? findCurrent : 0) + "/" + (findTotal !== null && findTotal !== void 0 ? findTotal : 0))) : null), findCurrent ? (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(IconButton, {
         "aria-label": texts.searchInput.findPrevious,
         className: "scale-75 !bg-transparent hover:!bg-black/[0.08] [&>svg]:scale-125",
         icon: "chevron-up",
@@ -128,33 +134,35 @@ const SearchInput2 = /*#__PURE__*/React__default.forwardRef(function SearchInput
   } else if (shortcut && !focused && !value) {
     postfix = /*#__PURE__*/React__default.createElement(Shortcut, {
       keys: shortcut,
-      onClickCapture: () => {
+      onClickCapture: function onClickCapture() {
         var _internalRef$current3;
         return (_internalRef$current3 = internalRef.current) === null || _internalRef$current3 === void 0 ? void 0 : _internalRef$current3.focus();
       }
     });
   }
-  const className = cn('!pl-7 group-focus-within:!w-72 group-focus-within:yt-focus', hasFind ? {
+  var className = cn('!pl-7 group-focus-within:!w-72 group-focus-within:yt-focus', hasFind ? {
     '!w-48': !value,
     '!w-72': value
   } : '!w-48', {
     '!wcag-blue-100': isActive
   }, props.className);
-  const icon = /*#__PURE__*/React__default.createElement(Icon, {
+  var icon = /*#__PURE__*/React__default.createElement(Icon, {
     "aria-label": texts.searchInput.button,
     className: "-ml-0.5 scale-95",
     name: "search",
-    onClickCapture: () => {
+    onClickCapture: function onClickCapture() {
       var _internalRef$current4;
       return (_internalRef$current4 = internalRef.current) === null || _internalRef$current4 === void 0 ? void 0 : _internalRef$current4.focus();
     }
   });
-  const input = /*#__PURE__*/React__default.createElement(Input, Object.assign({}, attributes, {
+  var input = /*#__PURE__*/React__default.createElement(Input, Object.assign({}, attributes, {
     "aria-label": (_attributes$ariaLabe = attributes['aria-label']) !== null && _attributes$ariaLabe !== void 0 ? _attributes$ariaLabe : texts.searchInput.placeholder,
     className: className,
     "data-taco": "search-input2",
     onBlur: handleBlur,
-    onChange: event => handleChange(event.target.value),
+    onChange: function onChange(event) {
+      return handleChange(event.target.value);
+    },
     onFocus: handleFocus,
     onKeyDown: handleKeyDown,
     placeholder: (_attributes$placehold = attributes.placeholder) !== null && _attributes$placehold !== void 0 ? _attributes$placehold : texts.searchInput.placeholder,
@@ -164,7 +172,7 @@ const SearchInput2 = /*#__PURE__*/React__default.forwardRef(function SearchInput
     value: value !== null && value !== void 0 ? value : ''
   }));
   if (settingsContent) {
-    const settingsClassname = cn('border-grey-300 absolute left-0 right-0 -mt-0.5 hidden top-full group-focus-within:flex focus-within:flex flex-col gap-y-4 rounded-b border border-t-0 bg-white p-3 shadow !pt-[calc(theme(spacing.3)_+_theme(spacing[0.5]))]');
+    var settingsClassname = cn('border-grey-300 absolute left-0 right-0 -mt-0.5 hidden top-full group-focus-within:flex focus-within:flex flex-col gap-y-4 rounded-b border border-t-0 bg-white p-3 shadow !pt-[calc(theme(spacing.3)_+_theme(spacing[0.5]))]');
     return /*#__PURE__*/React__default.createElement("div", {
       className: cn('group relative', {
         'z-10 [&_[data-taco=input-container]]:z-10': focused
@@ -179,7 +187,7 @@ const SearchInput2 = /*#__PURE__*/React__default.forwardRef(function SearchInput
       // We need to trigger blur when settings got blured as well, because settings is a part of SearchInput2 component
       onBlur: handleBlur,
       className: settingsClassname,
-      onClickCapture: () => {
+      onClickCapture: function onClickCapture() {
         var _internalRef$current5;
         return (_internalRef$current5 = internalRef.current) === null || _internalRef$current5 === void 0 ? void 0 : _internalRef$current5.focus();
       },

package/dist/esm/packages/taco/src/components/SearchInput2/SearchInput2.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchInput2.js","sources":["../../../../../../../src/components/SearchInput2/SearchInput2.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { useGlobalKeyDown } from '../../hooks/useGlobalKeyDown';\nimport { useLocalization } from '../Provider/Localization';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Input } from '../Input/Input';\nimport { Shortcut } from '../Shortcut/Shortcut';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { KeyDownHandlerOptions } from '../../utils/keyboard';\nimport { Spinner } from '../Spinner/Spinner';\nimport { Icon } from '../Icon/Icon';\n\ninterface CommonSearchInput2Props\n    extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'defaultValue' | 'onChange' | 'value'> {\n    loading?: boolean;\n    onChange: (value: string) => void;\n    onClear?: () => void;\n    settingsContent?: JSX.Element;\n    shortcut?: string | KeyDownHandlerOptions;\n    value?: string;\n}\n\ninterface BasicSearchInput2Props extends CommonSearchInput2Props {\n    findCurrent?: never;\n    findTotal?: never;\n    onClickFindNext?: never;\n    onClickFindPrevious?: never;\n}\n\ninterface ComplexSearchInput2Props extends CommonSearchInput2Props {\n    findCurrent: number | null;\n    findTotal: number | null;\n    onClickFindNext: () => void;\n    onClickFindPrevious: () => void;\n}\n\nexport type SearchInput2Props = BasicSearchInput2Props | ComplexSearchInput2Props;\n\nexport const SearchInput2 = React.forwardRef(function SearchInput2(props: SearchInput2Props, ref: React.Ref<HTMLInputElement>) {\n    const {\n        findCurrent,\n        findTotal,\n        loading = false,\n        onChange: handleChange,\n        onClear,\n        onClickFindNext: handleClickFindNext,\n        onClickFindPrevious: handleClickFindPrevious,\n        settingsContent,\n        shortcut,\n        value,\n        ...attributes\n    } = props;\n    const internalRef = useMergedRef<HTMLInputElement>(ref);\n    const containerRef = React.useRef<HTMLDivElement>(null);\n    const [focused, setFocused] = React.useState(false);\n    const { texts } = useLocalization();\n    const isActive = value?.length;\n    const hasFind =\n        handleClickFindNext !== undefined &&\n        handleClickFindPrevious !== undefined &&\n        findCurrent !== undefined &&\n        findTotal !== undefined;\n\n    useGlobalKeyDown(shortcut, (event: KeyboardEvent) => {\n        if (document.activeElement !== internalRef.current) {\n            event.preventDefault();\n            internalRef.current?.focus();\n        }\n    });\n\n    const handleBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n        if (\n            containerRef.current &&\n            (containerRef.current === event.relatedTarget || containerRef.current?.contains(event.relatedTarget))\n        ) {\n            return;\n        }\n\n        setFocused(false);\n        attributes.onBlur?.(event);\n    };\n\n    const handleClear = () => {\n        requestAnimationFrame(() => internalRef.current?.blur());\n        handleChange('');\n        onClear?.();\n    };\n\n    const handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n        setFocused(true);\n        attributes.onFocus?.(event);\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n        props.onKeyDown?.(event);\n\n        if (event.isDefaultPrevented()) {\n            return;\n        }\n\n        if (event.key === 'Enter') {\n            event.preventDefault();\n\n            if (hasFind && isActive) {\n                if (event.shiftKey) {\n                    handleClickFindPrevious?.();\n                } else {\n                    handleClickFindNext?.();\n                }\n            }\n\n            return;\n        }\n\n        if (event.key === 'Escape') {\n            handleClear();\n            event.stopPropagation();\n            return;\n        }\n    };\n\n    let postfix;\n\n    if (!attributes.disabled && !attributes.readOnly && (value || focused)) {\n        if (value) {\n            postfix = (\n                <IconButton\n                    aria-label={texts.searchInput.clear}\n                    className=\"scale-75 !bg-transparent hover:!bg-black/[0.08] [&>svg]:scale-125\"\n                    icon=\"close\"\n                    onMouseDown={handleClear}\n                    tabIndex={-1}\n                    tooltip={\n                        focused ? (\n                            <>\n                                {texts.searchInput.clear} <Shortcut keys=\"Escape\" />\n                            </>\n                        ) : (\n                            texts.searchInput.clear\n                        )\n                    }\n                />\n            );\n        }\n\n        if (hasFind && isActive) {\n            postfix = (\n                <>\n                    <span className=\"text-grey-700 flex h-4 items-center border-r border-black/[0.25] pr-2\">\n                        {loading ? <Spinner className=\"h-4 w-4\" /> : `${findCurrent ?? 0}/${findTotal ?? 0}`}\n                    </span>\n                    {findCurrent ? (\n                        <>\n                            <IconButton\n                                aria-label={texts.searchInput.findPrevious}\n                                className=\"scale-75 !bg-transparent hover:!bg-black/[0.08] [&>svg]:scale-125\"\n                                icon=\"chevron-up\"\n                                onMouseDown={handleClickFindPrevious}\n                                tabIndex={-1}\n                                tooltip={\n                                    focused ? (\n                                        <>\n                                            {texts.searchInput.findPrevious} <Shortcut keys={{ shift: true, key: 'Enter' }} />\n                                        </>\n                                    ) : (\n                                        texts.searchInput.findPrevious\n                                    )\n                                }\n                            />\n                            <IconButton\n                                aria-label={texts.searchInput.findNext}\n                                className=\"scale-75 !bg-transparent hover:!bg-black/[0.08] [&>svg]:scale-125\"\n                                icon=\"chevron-down\"\n                                onMouseDown={handleClickFindNext}\n                                tabIndex={-1}\n                                tooltip={\n                                    focused ? (\n                                        <>\n                                            {texts.searchInput.findNext} <Shortcut keys=\"Enter\" />\n                                        </>\n                                    ) : (\n                                        texts.searchInput.findNext\n                                    )\n                                }\n                            />\n                        </>\n                    ) : null}\n                    {postfix}\n                </>\n            );\n        }\n    } else if (shortcut && !focused && !value) {\n        postfix = <Shortcut keys={shortcut} onClickCapture={() => internalRef.current?.focus()} />;\n    }\n\n    const className = cn(\n        '!pl-7 group-focus-within:!w-72 group-focus-within:yt-focus',\n        hasFind\n            ? {\n                  '!w-48': !value,\n                  '!w-72': value,\n              }\n            : '!w-48',\n        {\n            '!wcag-blue-100': isActive,\n        },\n        props.className\n    );\n\n    const icon = (\n        <Icon\n            aria-label={texts.searchInput.button}\n            className=\"-ml-0.5 scale-95\"\n            name=\"search\"\n            onClickCapture={() => internalRef.current?.focus()}\n        />\n    );\n\n    const input = (\n        <Input\n            {...attributes}\n            aria-label={attributes['aria-label'] ?? texts.searchInput.placeholder}\n            className={className}\n            data-taco=\"search-input2\"\n            onBlur={handleBlur}\n            onChange={event => handleChange(event.target.value)}\n            onFocus={handleFocus}\n            onKeyDown={handleKeyDown}\n            placeholder={attributes.placeholder ?? texts.searchInput.placeholder}\n            prefix={icon}\n            postfix={postfix}\n            ref={internalRef}\n            value={value ?? ''}\n        />\n    );\n\n    if (settingsContent) {\n        const settingsClassname = cn(\n            'border-grey-300 absolute left-0 right-0 -mt-0.5 hidden top-full group-focus-within:flex focus-within:flex flex-col gap-y-4 rounded-b border border-t-0 bg-white p-3 shadow !pt-[calc(theme(spacing.3)_+_theme(spacing[0.5]))]'\n        );\n\n        return (\n            <div\n                className={cn('group relative', { 'z-10 [&_[data-taco=input-container]]:z-10': focused })}\n                ref={containerRef}\n                // create a new stacking context so our internal z-indexes don't effect external components\n                // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context\n                style={{ opacity: 0.999 }}>\n                {input}\n                <div\n                    // We need to trigger blur when settings got blured as well, because settings is a part of SearchInput2 component\n                    onBlur={handleBlur}\n                    className={settingsClassname}\n                    onClickCapture={() => internalRef.current?.focus()}\n                    // tab index is important, it lets the element show as a relatedTarget on event handlers\n                    tabIndex={-1}>\n                    {settingsContent}\n                </div>\n            </div>\n        );\n    }\n\n    return input;\n});\n"],"names":["SearchInput2","React","forwardRef","props","ref","findCurrent","findTotal","loading","onChange","handleChange","onClear","onClickFindNext","handleClickFindNext","onClickFindPrevious","handleClickFindPrevious","settingsContent","shortcut","value","attributes","internalRef","useMergedRef","containerRef","useRef","focused","setFocused","useState","texts","useLocalization","isActive","length","hasFind","undefined","useGlobalKeyDown","event","document","activeElement","current","_internalRef$current","preventDefault","focus","handleBlur","relatedTarget","_containerRef$current","contains","_attributes$onBlur","onBlur","call","handleClear","requestAnimationFrame","_internalRef$current2","blur","handleFocus","_attributes$onFocus","onFocus","handleKeyDown","_props$onKeyDown","onKeyDown","isDefaultPrevented","key","shiftKey","stopPropagation","postfix","disabled","readOnly","IconButton","searchInput","clear","className","icon","onMouseDown","tabIndex","tooltip","Shortcut","keys","Spinner","findPrevious","shift","findNext","onClickCapture","_internalRef$current3","cn","Icon","button","name","_internalRef$current4","input","Input","_attributes$ariaLabe","placeholder","target","_attributes$placehold","prefix","settingsClassname","style","opacity","_internalRef$current5"],"mappings":"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"}
+{"version":3,"file":"SearchInput2.js","sources":["../../../../../../../src/components/SearchInput2/SearchInput2.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { useGlobalKeyDown } from '../../hooks/useGlobalKeyDown';\nimport { useLocalization } from '../Provider/Localization';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Input } from '../Input/Input';\nimport { Shortcut } from '../Shortcut/Shortcut';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { KeyDownHandlerOptions } from '../../utils/keyboard';\nimport { Spinner } from '../Spinner/Spinner';\nimport { Icon } from '../Icon/Icon';\n\ninterface CommonSearchInput2Props\n    extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'defaultValue' | 'onChange' | 'value'> {\n    loading?: boolean;\n    onChange: (value: string) => void;\n    onClear?: () => void;\n    settingsContent?: JSX.Element;\n    shortcut?: string | KeyDownHandlerOptions;\n    value?: string;\n}\n\ninterface BasicSearchInput2Props extends CommonSearchInput2Props {\n    findCurrent?: never;\n    findTotal?: never;\n    onClickFindNext?: never;\n    onClickFindPrevious?: never;\n    showTotal?: never;\n}\n\ninterface ComplexSearchInput2Props extends CommonSearchInput2Props {\n    findCurrent: number | null;\n    findTotal: number | null;\n    onClickFindNext: () => void;\n    onClickFindPrevious: () => void;\n    showTotal?: boolean;\n}\n\nexport type SearchInput2Props = BasicSearchInput2Props | ComplexSearchInput2Props;\n\nexport const SearchInput2 = React.forwardRef(function SearchInput2(props: SearchInput2Props, ref: React.Ref<HTMLInputElement>) {\n    const {\n        findCurrent,\n        findTotal,\n        loading = false,\n        onChange: handleChange,\n        onClear,\n        onClickFindNext: handleClickFindNext,\n        onClickFindPrevious: handleClickFindPrevious,\n        settingsContent,\n        shortcut,\n        showTotal = true,\n        value,\n        ...attributes\n    } = props;\n    const internalRef = useMergedRef<HTMLInputElement>(ref);\n    const containerRef = React.useRef<HTMLDivElement>(null);\n    const [focused, setFocused] = React.useState(false);\n    const { texts } = useLocalization();\n    const isActive = value?.length;\n    const hasFind =\n        handleClickFindNext !== undefined &&\n        handleClickFindPrevious !== undefined &&\n        findCurrent !== undefined &&\n        findTotal !== undefined;\n\n    useGlobalKeyDown(shortcut, (event: KeyboardEvent) => {\n        if (document.activeElement !== internalRef.current) {\n            event.preventDefault();\n            internalRef.current?.focus();\n        }\n    });\n\n    const handleBlur = (event: React.FocusEvent<HTMLInputElement>) => {\n        if (\n            containerRef.current &&\n            (containerRef.current === event.relatedTarget || containerRef.current?.contains(event.relatedTarget))\n        ) {\n            return;\n        }\n\n        setFocused(false);\n        attributes.onBlur?.(event);\n    };\n\n    const handleClear = () => {\n        requestAnimationFrame(() => internalRef.current?.blur());\n        handleChange('');\n        onClear?.();\n    };\n\n    const handleFocus = (event: React.FocusEvent<HTMLInputElement>) => {\n        setFocused(true);\n        attributes.onFocus?.(event);\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n        props.onKeyDown?.(event);\n\n        if (event.isDefaultPrevented()) {\n            return;\n        }\n\n        if (event.key === 'Enter') {\n            event.preventDefault();\n\n            if (hasFind && isActive) {\n                if (event.shiftKey) {\n                    handleClickFindPrevious?.();\n                } else {\n                    handleClickFindNext?.();\n                }\n            }\n\n            return;\n        }\n\n        if (event.key === 'Escape') {\n            handleClear();\n            event.stopPropagation();\n            return;\n        }\n    };\n\n    let postfix;\n\n    if (!attributes.disabled && !attributes.readOnly && (value || focused)) {\n        if (value) {\n            postfix = (\n                <IconButton\n                    aria-label={texts.searchInput.clear}\n                    className=\"scale-75 !bg-transparent hover:!bg-black/[0.08] [&>svg]:scale-125\"\n                    icon=\"close\"\n                    onMouseDown={handleClear}\n                    tabIndex={-1}\n                    tooltip={\n                        focused ? (\n                            <>\n                                {texts.searchInput.clear} <Shortcut keys=\"Escape\" />\n                            </>\n                        ) : (\n                            texts.searchInput.clear\n                        )\n                    }\n                />\n            );\n        }\n\n        if (hasFind && isActive) {\n            postfix = (\n                <>\n                    <span className=\"text-grey-700 flex h-4 items-center\">\n                        {loading ? (\n                            <Spinner className=\"h-4 w-4\" />\n                        ) : showTotal ? (\n                            <span className=\"border-r border-black/[0.25] pr-2\">{`${findCurrent ?? 0}/${findTotal ?? 0}`}</span>\n                        ) : null}\n                    </span>\n                    {findCurrent ? (\n                        <>\n                            <IconButton\n                                aria-label={texts.searchInput.findPrevious}\n                                className=\"scale-75 !bg-transparent hover:!bg-black/[0.08] [&>svg]:scale-125\"\n                                icon=\"chevron-up\"\n                                onMouseDown={handleClickFindPrevious}\n                                tabIndex={-1}\n                                tooltip={\n                                    focused ? (\n                                        <>\n                                            {texts.searchInput.findPrevious} <Shortcut keys={{ shift: true, key: 'Enter' }} />\n                                        </>\n                                    ) : (\n                                        texts.searchInput.findPrevious\n                                    )\n                                }\n                            />\n                            <IconButton\n                                aria-label={texts.searchInput.findNext}\n                                className=\"scale-75 !bg-transparent hover:!bg-black/[0.08] [&>svg]:scale-125\"\n                                icon=\"chevron-down\"\n                                onMouseDown={handleClickFindNext}\n                                tabIndex={-1}\n                                tooltip={\n                                    focused ? (\n                                        <>\n                                            {texts.searchInput.findNext} <Shortcut keys=\"Enter\" />\n                                        </>\n                                    ) : (\n                                        texts.searchInput.findNext\n                                    )\n                                }\n                            />\n                        </>\n                    ) : null}\n                    {postfix}\n                </>\n            );\n        }\n    } else if (shortcut && !focused && !value) {\n        postfix = <Shortcut keys={shortcut} onClickCapture={() => internalRef.current?.focus()} />;\n    }\n\n    const className = cn(\n        '!pl-7 group-focus-within:!w-72 group-focus-within:yt-focus',\n        hasFind\n            ? {\n                  '!w-48': !value,\n                  '!w-72': value,\n              }\n            : '!w-48',\n        {\n            '!wcag-blue-100': isActive,\n        },\n        props.className\n    );\n\n    const icon = (\n        <Icon\n            aria-label={texts.searchInput.button}\n            className=\"-ml-0.5 scale-95\"\n            name=\"search\"\n            onClickCapture={() => internalRef.current?.focus()}\n        />\n    );\n\n    const input = (\n        <Input\n            {...attributes}\n            aria-label={attributes['aria-label'] ?? texts.searchInput.placeholder}\n            className={className}\n            data-taco=\"search-input2\"\n            onBlur={handleBlur}\n            onChange={event => handleChange(event.target.value)}\n            onFocus={handleFocus}\n            onKeyDown={handleKeyDown}\n            placeholder={attributes.placeholder ?? texts.searchInput.placeholder}\n            prefix={icon}\n            postfix={postfix}\n            ref={internalRef}\n            value={value ?? ''}\n        />\n    );\n\n    if (settingsContent) {\n        const settingsClassname = cn(\n            'border-grey-300 absolute left-0 right-0 -mt-0.5 hidden top-full group-focus-within:flex focus-within:flex flex-col gap-y-4 rounded-b border border-t-0 bg-white p-3 shadow !pt-[calc(theme(spacing.3)_+_theme(spacing[0.5]))]'\n        );\n\n        return (\n            <div\n                className={cn('group relative', { 'z-10 [&_[data-taco=input-container]]:z-10': focused })}\n                ref={containerRef}\n                // create a new stacking context so our internal z-indexes don't effect external components\n                // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context\n                style={{ opacity: 0.999 }}>\n                {input}\n                <div\n                    // We need to trigger blur when settings got blured as well, because settings is a part of SearchInput2 component\n                    onBlur={handleBlur}\n                    className={settingsClassname}\n                    onClickCapture={() => internalRef.current?.focus()}\n                    // tab index is important, it lets the element show as a relatedTarget on event handlers\n                    tabIndex={-1}>\n                    {settingsContent}\n                </div>\n            </div>\n        );\n    }\n\n    return input;\n});\n"],"names":["SearchInput2","React","forwardRef","props","ref","findCurrent","findTotal","_props$loading","loading","handleChange","onChange","onClear","handleClickFindNext","onClickFindNext","handleClickFindPrevious","onClickFindPrevious","settingsContent","shortcut","_props$showTotal","showTotal","value","attributes","_objectWithoutPropertiesLoose","_excluded","internalRef","useMergedRef","containerRef","useRef","_React$useState","useState","focused","setFocused","_useLocalization","useLocalization","texts","isActive","length","hasFind","undefined","useGlobalKeyDown","event","document","activeElement","current","_internalRef$current","preventDefault","focus","handleBlur","relatedTarget","_containerRef$current","contains","_attributes$onBlur","onBlur","call","handleClear","requestAnimationFrame","_internalRef$current2","blur","handleFocus","_attributes$onFocus","onFocus","handleKeyDown","_props$onKeyDown","onKeyDown","isDefaultPrevented","key","shiftKey","stopPropagation","postfix","disabled","readOnly","IconButton","searchInput","clear","className","icon","onMouseDown","tabIndex","tooltip","Shortcut","keys","Spinner","findPrevious","shift","findNext","onClickCapture","_internalRef$current3","cn","Icon","button","name","_internalRef$current4","input","Input","_attributes$ariaLabe","placeholder","target","_attributes$placehold","prefix","settingsClassname","style","opacity","_internalRef$current5"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Select/Select.js

@@ -1,5 +1,6 @@
 import { forwardRef, createElement, useRef, useEffect, Fragment } from 'react';
 import cn from 'clsx';
+import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose, extends as _extends } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
 import { Icon } from '../Icon/Icon.js';
 import { Badge } from '../Badge/Badge.js';
 import { Root, Trigger, Portal, Content } from '@radix-ui/react-popover';
@@ -9,52 +10,50 @@ import { Combobox } from '../Combobox/Combobox.js';
 import { MultiListbox, Listbox } from '../Listbox/Listbox.js';
 import { useSelect } from './useSelect.js';
 
-const BaseSelect = /*#__PURE__*/forwardRef(function BaseSelect(props, ref) {
-  const {
-    autoFocus,
-    className: externalClassName,
-    highlighted,
-    style,
-    ...otherProps
-  } = props;
-  const {
-    button,
-    listbox,
-    popover,
-    input,
-    text,
-    more = 0
-  } = useSelect(otherProps, ref);
-  const internalRef = useRef(null);
-  const selectDimensions = useBoundingClientRectListener(internalRef);
-  const className = cn('inline-flex relative w-full', {
+var _excluded = ["autoFocus", "className", "highlighted", "style"],
+  _excluded2 = ["editable"];
+var BaseSelect = /*#__PURE__*/forwardRef(function BaseSelect(props, ref) {
+  var autoFocus = props.autoFocus,
+    externalClassName = props.className,
+    style = props.style,
+    otherProps = _objectWithoutPropertiesLoose(props, _excluded);
+  var _useSelect = useSelect(otherProps, ref),
+    button = _useSelect.button,
+    listbox = _useSelect.listbox,
+    popover = _useSelect.popover,
+    input = _useSelect.input,
+    text = _useSelect.text,
+    _useSelect$more = _useSelect.more,
+    more = _useSelect$more === void 0 ? 0 : _useSelect$more;
+  var internalRef = useRef(null);
+  var selectDimensions = useBoundingClientRectListener(internalRef);
+  var className = cn('inline-flex relative w-full', {
     'yt-select--readonly': props.readOnly
   }, externalClassName);
-  const inputClassname = cn(getInputClasses(props), 'h-8 text-left !pr-0', {
+  var inputClassname = cn(getInputClasses(props), 'h-8 text-left !pr-0', {
     'border-blue-500': popover.open,
     'select-text': otherProps.readOnly
   });
-  useEffect(() => {
+  useEffect(function () {
     if (autoFocus && internalRef.current) {
       internalRef.current.focus();
     }
   }, []);
-  const renderMultiSelection = () => {
+  var renderMultiSelection = function renderMultiSelection() {
     return /*#__PURE__*/createElement(Fragment, null, /*#__PURE__*/createElement("span", {
       className: "flex-grow truncate text-left"
     }, text), more > 0 && /*#__PURE__*/createElement(Badge, {
       className: "ml-2"
-    }, `+${more}`));
+    }, "+" + more));
   };
-  const commonListboxProps = {
-    ...listbox,
+  var commonListboxProps = _extends({}, listbox, {
     className: 'w-auto',
     invalid: undefined,
     style: {
       minWidth: selectDimensions === null || selectDimensions === void 0 ? void 0 : selectDimensions.width
     },
     tabIndex: popover.open ? 0 : -1
-  };
+  });
   return /*#__PURE__*/createElement("span", {
     className: className,
     "data-taco": "select",
@@ -77,11 +76,9 @@ const BaseSelect = /*#__PURE__*/forwardRef(function BaseSelect(props, ref) {
     type: "text"
   }))));
 });
-const Select = /*#__PURE__*/forwardRef(function Select(props, ref) {
-  const {
-    editable,
-    ...otherProps
-  } = props;
+var Select = /*#__PURE__*/forwardRef(function Select(props, ref) {
+  var editable = props.editable,
+    otherProps = _objectWithoutPropertiesLoose(props, _excluded2);
   if (editable) {
     return /*#__PURE__*/createElement(Combobox, Object.assign({}, otherProps, {
       dialog: undefined,

package/dist/esm/packages/taco/src/components/Select/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sources":["../../../../../../../src/components/Select/Select.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport { Icon } from '../Icon/Icon';\nimport { Listbox, MultiListbox, ListboxProps } from '../Listbox/Listbox';\nimport { useBoundingClientRectListener } from '../../hooks/useBoundingClientRectListener';\nimport { useSelect } from './useSelect';\nimport { Combobox, ComboboxProps } from '../Combobox/Combobox';\nimport { Badge } from '../Badge/Badge';\nimport { getInputClasses } from '../Input/util';\n\nexport type SelectTexts = {\n    /**\n     * The text displayed when all options are selected when multiselect mode in on.\n     */\n    allOptionsSelected: string;\n};\n\nexport type BaseSelectProps = Omit<ListboxProps, 'dialog'> &\n    Omit<ComboboxProps, 'inline'> & {\n        /**\n         * Allows to select multiple values.\n         * All the selected values will be combined in a comma-seperated string as the value of the input.\n         */\n        multiselect?: boolean;\n    };\n\nexport type SelectProps = BaseSelectProps & {\n    /**\n     * Creates an editable select.\n     * Setting this will render a inline Combobox which will display the provided data on click/focus,\n     * even if there is no value in the input.\n     * After user starts typing, matching data will be displayed.\n     */\n    editable?: boolean;\n};\n\nconst BaseSelect = React.forwardRef(function BaseSelect(props: BaseSelectProps, ref: React.Ref<HTMLInputElement>) {\n    const { autoFocus, className: externalClassName, highlighted, style, ...otherProps } = props;\n    const { button, listbox, popover, input, text, more = 0 } = useSelect(otherProps, ref);\n    const internalRef = React.useRef<HTMLButtonElement>(null);\n    const selectDimensions = useBoundingClientRectListener(internalRef);\n    const className = cn('inline-flex relative w-full', { 'yt-select--readonly': props.readOnly }, externalClassName);\n    const inputClassname = cn(getInputClasses(props), 'h-8 text-left !pr-0', {\n        'border-blue-500': popover.open,\n        'select-text': otherProps.readOnly,\n    });\n\n    React.useEffect(() => {\n        if (autoFocus && internalRef.current) {\n            internalRef.current.focus();\n        }\n    }, []);\n\n    const renderMultiSelection = (): React.ReactNode => {\n        return (\n            <>\n                <span className=\"flex-grow truncate text-left\">{text}</span>\n                {more > 0 && <Badge className=\"ml-2\">{`+${more}`}</Badge>}\n            </>\n        );\n    };\n\n    const commonListboxProps: ListboxProps = {\n        ...listbox,\n        className: 'w-auto',\n        invalid: undefined,\n        style: { minWidth: selectDimensions?.width },\n        tabIndex: popover.open ? 0 : -1,\n    };\n\n    return (\n        <span className={className} data-taco=\"select\" style={style}>\n            <PopoverPrimitive.Root {...popover}>\n                <PopoverPrimitive.Trigger {...button} className={inputClassname} ref={internalRef}>\n                    {props.multiselect ? renderMultiSelection() : <span className=\"flex-grow truncate text-left\">{text}</span>}\n                    <span className=\"flex h-8 w-8 items-center justify-center\">\n                        <Icon className=\"pointer-events-none\" name={popover.open ? 'chevron-up' : 'chevron-down'} />\n                    </span>\n                </PopoverPrimitive.Trigger>\n                <PopoverPrimitive.Portal>\n                    <PopoverPrimitive.Content align=\"start\" sideOffset={4}>\n                        {props.multiselect ? <MultiListbox {...commonListboxProps} /> : <Listbox {...commonListboxProps} />}\n                    </PopoverPrimitive.Content>\n                </PopoverPrimitive.Portal>\n                <input {...input} className=\"hidden\" type=\"text\" />\n            </PopoverPrimitive.Root>\n        </span>\n    );\n});\n\nexport const Select = React.forwardRef(function Select(props: SelectProps, ref: React.Ref<HTMLInputElement>) {\n    const { editable, ...otherProps } = props;\n\n    if (editable) {\n        return <Combobox {...otherProps} dialog={undefined} inline ref={ref} />;\n    }\n\n    return <BaseSelect {...otherProps} ref={ref} />;\n});\n"],"names":["BaseSelect","React","props","ref","autoFocus","className","externalClassName","highlighted","style","otherProps","button","listbox","popover","input","text","more","useSelect","internalRef","selectDimensions","useBoundingClientRectListener","cn","readOnly","inputClassname","getInputClasses","open","current","focus","renderMultiSelection","Badge","commonListboxProps","invalid","undefined","minWidth","width","tabIndex","PopoverPrimitive","multiselect","Icon","name","align","sideOffset","MultiListbox","Listbox","type","Select","editable","Combobox","dialog","inline"],"mappings":"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"}
+{"version":3,"file":"Select.js","sources":["../../../../../../../src/components/Select/Select.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport { Icon } from '../Icon/Icon';\nimport { Listbox, MultiListbox, ListboxProps } from '../Listbox/Listbox';\nimport { useBoundingClientRectListener } from '../../hooks/useBoundingClientRectListener';\nimport { useSelect } from './useSelect';\nimport { Combobox, ComboboxProps } from '../Combobox/Combobox';\nimport { Badge } from '../Badge/Badge';\nimport { getInputClasses } from '../Input/util';\n\nexport type SelectTexts = {\n    /**\n     * The text displayed when all options are selected when multiselect mode in on.\n     */\n    allOptionsSelected: string;\n};\n\nexport type BaseSelectProps = Omit<ListboxProps, 'dialog'> &\n    Omit<ComboboxProps, 'inline'> & {\n        /**\n         * Allows to select multiple values.\n         * All the selected values will be combined in a comma-seperated string as the value of the input.\n         */\n        multiselect?: boolean;\n    };\n\nexport type SelectProps = BaseSelectProps & {\n    /**\n     * Creates an editable select.\n     * Setting this will render a inline Combobox which will display the provided data on click/focus,\n     * even if there is no value in the input.\n     * After user starts typing, matching data will be displayed.\n     */\n    editable?: boolean;\n};\n\nconst BaseSelect = React.forwardRef(function BaseSelect(props: BaseSelectProps, ref: React.Ref<HTMLInputElement>) {\n    const { autoFocus, className: externalClassName, highlighted, style, ...otherProps } = props;\n    const { button, listbox, popover, input, text, more = 0 } = useSelect(otherProps, ref);\n    const internalRef = React.useRef<HTMLButtonElement>(null);\n    const selectDimensions = useBoundingClientRectListener(internalRef);\n    const className = cn('inline-flex relative w-full', { 'yt-select--readonly': props.readOnly }, externalClassName);\n    const inputClassname = cn(getInputClasses(props), 'h-8 text-left !pr-0', {\n        'border-blue-500': popover.open,\n        'select-text': otherProps.readOnly,\n    });\n\n    React.useEffect(() => {\n        if (autoFocus && internalRef.current) {\n            internalRef.current.focus();\n        }\n    }, []);\n\n    const renderMultiSelection = (): React.ReactNode => {\n        return (\n            <>\n                <span className=\"flex-grow truncate text-left\">{text}</span>\n                {more > 0 && <Badge className=\"ml-2\">{`+${more}`}</Badge>}\n            </>\n        );\n    };\n\n    const commonListboxProps: ListboxProps = {\n        ...listbox,\n        className: 'w-auto',\n        invalid: undefined,\n        style: { minWidth: selectDimensions?.width },\n        tabIndex: popover.open ? 0 : -1,\n    };\n\n    return (\n        <span className={className} data-taco=\"select\" style={style}>\n            <PopoverPrimitive.Root {...popover}>\n                <PopoverPrimitive.Trigger {...button} className={inputClassname} ref={internalRef}>\n                    {props.multiselect ? renderMultiSelection() : <span className=\"flex-grow truncate text-left\">{text}</span>}\n                    <span className=\"flex h-8 w-8 items-center justify-center\">\n                        <Icon className=\"pointer-events-none\" name={popover.open ? 'chevron-up' : 'chevron-down'} />\n                    </span>\n                </PopoverPrimitive.Trigger>\n                <PopoverPrimitive.Portal>\n                    <PopoverPrimitive.Content align=\"start\" sideOffset={4}>\n                        {props.multiselect ? <MultiListbox {...commonListboxProps} /> : <Listbox {...commonListboxProps} />}\n                    </PopoverPrimitive.Content>\n                </PopoverPrimitive.Portal>\n                <input {...input} className=\"hidden\" type=\"text\" />\n            </PopoverPrimitive.Root>\n        </span>\n    );\n});\n\nexport const Select = React.forwardRef(function Select(props: SelectProps, ref: React.Ref<HTMLInputElement>) {\n    const { editable, ...otherProps } = props;\n\n    if (editable) {\n        return <Combobox {...otherProps} dialog={undefined} inline ref={ref} />;\n    }\n\n    return <BaseSelect {...otherProps} ref={ref} />;\n});\n"],"names":["BaseSelect","React","props","ref","autoFocus","externalClassName","className","style","otherProps","_objectWithoutPropertiesLoose","_excluded","_useSelect","useSelect","button","listbox","popover","input","text","_useSelect$more","more","internalRef","selectDimensions","useBoundingClientRectListener","cn","readOnly","inputClassname","getInputClasses","open","current","focus","renderMultiSelection","Badge","commonListboxProps","_extends","invalid","undefined","minWidth","width","tabIndex","PopoverPrimitive","multiselect","Icon","name","align","sideOffset","MultiListbox","Listbox","type","Select","editable","_excluded2","Combobox","dialog","inline"],"mappings":"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"}