@economic/taco 1.0.0 → 1.0.3

package/dist/components/HoverCard/HoverCard.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { Placement } from '../..';
+export declare type HoverCardTriggerProps = React.HTMLAttributes<HTMLAnchorElement>;
+export declare type HoverCardContentProps = React.HTMLAttributes<HTMLDivElement> & {
+    /** Set the position of the HoverCard relative to its trigger. Default value is `bottom` */
+    placement?: Placement;
+};
+export declare type HoverCardProps = React.PropsWithChildren<{}>;
+export declare const HoverCard: {
+    (props: HoverCardProps): JSX.Element;
+    Trigger: React.ForwardRefExoticComponent<HoverCardTriggerProps & React.RefAttributes<HTMLAnchorElement>>;
+    Content: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+        /** Set the position of the HoverCard relative to its trigger. Default value is `bottom` */
+        placement?: "right" | "left" | "top" | "bottom" | undefined;
+    } & React.RefAttributes<HTMLDivElement>>;
+};

package/dist/esm/components/Button/util.js

@@ -14,18 +14,18 @@ var getAppearanceClasses = function getAppearanceClasses(value, icon) {
 
   switch (value) {
     case 'primary':
-      return "yt-blue-solid border-blue focus:bg-blue focus:text-white focus:yt-focus active:bg-blue-dark active:text-white  hover:bg-blue-light hover:border-blue-light hover:text-white hover:focus:bg-blue-light hover:focus:border-blue-light hover:focus:text-white disabled:hover:yt-blue-solid";
+      return "yt-blue-solid border-blue focus:bg-blue focus:text-white focus:yt-focus active:bg-blue-dark active:text-white hover:bg-blue-light hover:border-blue-light hover:text-white hover:focus:bg-blue-light hover:focus:border-blue-light hover:focus:text-white disabled:hover:yt-blue-solid disabled:hover:hover:border-blue";
 
     case 'danger':
-      return "yt-red-solid border-red focus:bg-red focus:text-white focus:yt-focus-red active:bg-red-dark active:text-white  hover:bg-red-light hover:text-white hover:focus:bg-red-light hover:focus:text-white disabled:hover:yt-red-solid";
+      return "yt-red-solid border-red focus:bg-red focus:text-white focus:yt-focus-red active:bg-red-dark active:text-white hover:bg-red-light hover:text-white hover:focus:bg-red-light hover:focus:text-white disabled:hover:yt-red-solid";
 
     case 'ghost':
-      return "yt-blue-inverted focus:bg-transparent focus:text-blue focus:yt-focus active:bg-blue-lightest active:border-blue active:text-blue-dark  hover:bg-blue-lightest hover:border-blue-light hover:text-blue-light hover:focus:bg-blue-lightest hover:focus:border-blue-light hover:focus:text-blue-light disabled:hover:yt-blue-inverted";
+      return "yt-blue-inverted focus:bg-transparent focus:text-blue focus:yt-focus active:bg-blue-lightest active:border-blue active:text-blue-dark hover:bg-blue-lightest hover:border-blue-light hover:text-blue-light hover:focus:bg-blue-lightest hover:focus:border-blue-light hover:focus:text-blue-light disabled:hover:yt-blue-inverted";
 
     case 'discrete':
       {
         if (icon) {
-          return "bg-transparent text-black border-transparent focus:text-black focus:yt-focus active:text-black hover:text-grey-darkest hover:focus:text-grey-darkest disabled:hover:yt-transparent";
+          return "bg-transparent text-black border-transparent focus:text-black focus:yt-focus active:text-black hover:text-grey-darkest hover:focus:text-grey-darkest disabled:hover:text-black ";
         }
 
         return "yt-transparent border-transparent focus:text-blue focus:yt-focus active:text-blue-dark hover:text-blue-light hover:focus:text-blue-light disabled:hover:yt-transparent";

package/dist/esm/components/Button/util.js.map

@@ -1 +1 @@
-{"version":3,"file":"util.js","sources":["../../../../src/components/Button/util.tsx"],"sourcesContent":["import React from 'react';\nimport { Appearance } from '../../types';\nimport * as ButtonPrimitive from '../../primitives/Button';\nimport { Tooltip } from '../Tooltip/Tooltip';\n\nexport const getButtonClasses = () => {\n    return 'min-h-[theme(spacing.8)] min-w-[theme(spacing.8)] gap-1 h-max leading-5 inline-flex items-center justify-center border';\n};\n\nexport const getAppearanceClasses = (value: Appearance | undefined, icon = false): string => {\n    switch (value) {\n        case 'primary':\n            return `yt-blue-solid border-blue focus:bg-blue focus:text-white focus:yt-focus active:bg-blue-dark active:text-white  hover:bg-blue-light hover:border-blue-light hover:text-white hover:focus:bg-blue-light hover:focus:border-blue-light hover:focus:text-white disabled:hover:yt-blue-solid`;\n\n        case 'danger':\n            return `yt-red-solid border-red focus:bg-red focus:text-white focus:yt-focus-red active:bg-red-dark active:text-white  hover:bg-red-light hover:text-white hover:focus:bg-red-light hover:focus:text-white disabled:hover:yt-red-solid`;\n\n        case 'ghost':\n            return `yt-blue-inverted focus:bg-transparent focus:text-blue focus:yt-focus active:bg-blue-lightest active:border-blue active:text-blue-dark  hover:bg-blue-lightest hover:border-blue-light hover:text-blue-light hover:focus:bg-blue-lightest hover:focus:border-blue-light hover:focus:text-blue-light disabled:hover:yt-blue-inverted`;\n\n        case 'discrete': {\n            if (icon) {\n                return `bg-transparent text-black border-transparent focus:text-black focus:yt-focus active:text-black hover:text-grey-darkest hover:focus:text-grey-darkest disabled:hover:yt-transparent`;\n            }\n\n            return `yt-transparent border-transparent focus:text-blue focus:yt-focus active:text-blue-dark hover:text-blue-light hover:focus:text-blue-light disabled:hover:yt-transparent`;\n        }\n\n        default:\n            return `yt-grey-solid border-grey focus:bg-grey focus:yt-focus active:bg-grey-dark active:text-black hover:bg-grey-light hover:text-grey-darkest hover:focus:bg-grey-light hover:focus:text-grey-darkest disabled:hover:yt-grey-solid`;\n    }\n};\n\nexport const createButton = (\n    props: any,\n    className: string,\n    ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>\n): JSX.Element => {\n    const { dialog, hanger, menu, popover, tooltip, ...otherProps } = props;\n\n    let button = <ButtonPrimitive.Button {...otherProps} className={className} ref={ref} />;\n\n    if (typeof dialog === 'function') {\n        button = dialog({ trigger: button });\n    } else if (typeof menu === 'function') {\n        button = menu({ trigger: button, appearance: otherProps.appearance });\n    } else if (typeof popover === 'function') {\n        button = popover({ trigger: button });\n    }\n\n    if (typeof hanger === 'function') {\n        button = hanger({ anchor: button });\n    }\n\n    if (tooltip) {\n        button = <Tooltip title={tooltip}>{button}</Tooltip>;\n    }\n\n    return button;\n};\n"],"names":["getButtonClasses","getAppearanceClasses","value","icon","createButton","props","className","ref","dialog","hanger","menu","popover","tooltip","otherProps","button","React","ButtonPrimitive","trigger","appearance","anchor","Tooltip","title"],"mappings":";;;;;;IAKaA,gBAAgB,GAAG,SAAnBA,gBAAmB;AAC5B,SAAO,wHAAP;AACH;IAEYC,oBAAoB,GAAG,SAAvBA,oBAAuB,CAACC,KAAD,EAAgCC,IAAhC;MAAgCA;AAAAA,IAAAA,OAAO;;;AACvE,UAAQD,KAAR;AACI,SAAK,SAAL;AACI;;AAEJ,SAAK,QAAL;AACI;;AAEJ,SAAK,OAAL;AACI;;AAEJ,SAAK,UAAL;AAAiB;AACb,YAAIC,IAAJ,EAAU;AACN;AACH;;AAED;AACH;;AAED;AACI;AAnBR;AAqBH;IAEYC,YAAY,GAAG,SAAfA,YAAe,CACxBC,KADwB,EAExBC,SAFwB,EAGxBC,GAHwB;AAKxB,MAAQC,MAAR,GAAkEH,KAAlE,CAAQG,MAAR;AAAA,MAAgBC,MAAhB,GAAkEJ,KAAlE,CAAgBI,MAAhB;AAAA,MAAwBC,IAAxB,GAAkEL,KAAlE,CAAwBK,IAAxB;AAAA,MAA8BC,OAA9B,GAAkEN,KAAlE,CAA8BM,OAA9B;AAAA,MAAuCC,OAAvC,GAAkEP,KAAlE,CAAuCO,OAAvC;AAAA,MAAmDC,UAAnD,iCAAkER,KAAlE;;AAEA,MAAIS,MAAM,GAAGC,4BAAA,CAACC,MAAD,oBAA4BH;AAAYP,IAAAA,SAAS,EAAEA;AAAWC,IAAAA,GAAG,EAAEA;IAAnE,CAAb;;AAEA,MAAI,OAAOC,MAAP,KAAkB,UAAtB,EAAkC;AAC9BM,IAAAA,MAAM,GAAGN,MAAM,CAAC;AAAES,MAAAA,OAAO,EAAEH;AAAX,KAAD,CAAf;AACH,GAFD,MAEO,IAAI,OAAOJ,IAAP,KAAgB,UAApB,EAAgC;AACnCI,IAAAA,MAAM,GAAGJ,IAAI,CAAC;AAAEO,MAAAA,OAAO,EAAEH,MAAX;AAAmBI,MAAAA,UAAU,EAAEL,UAAU,CAACK;AAA1C,KAAD,CAAb;AACH,GAFM,MAEA,IAAI,OAAOP,OAAP,KAAmB,UAAvB,EAAmC;AACtCG,IAAAA,MAAM,GAAGH,OAAO,CAAC;AAAEM,MAAAA,OAAO,EAAEH;AAAX,KAAD,CAAhB;AACH;;AAED,MAAI,OAAOL,MAAP,KAAkB,UAAtB,EAAkC;AAC9BK,IAAAA,MAAM,GAAGL,MAAM,CAAC;AAAEU,MAAAA,MAAM,EAAEL;AAAV,KAAD,CAAf;AACH;;AAED,MAAIF,OAAJ,EAAa;AACTE,IAAAA,MAAM,GAAGC,4BAAA,CAACK,OAAD;AAASC,MAAAA,KAAK,EAAET;KAAhB,EAA0BE,MAA1B,CAAT;AACH;;AAED,SAAOA,MAAP;AACH;;;;"}
+{"version":3,"file":"util.js","sources":["../../../../src/components/Button/util.tsx"],"sourcesContent":["import React from 'react';\nimport { Appearance } from '../../types';\nimport * as ButtonPrimitive from '../../primitives/Button';\nimport { Tooltip } from '../Tooltip/Tooltip';\n\nexport const getButtonClasses = () => {\n    return 'min-h-[theme(spacing.8)] min-w-[theme(spacing.8)] gap-1 h-max leading-5 inline-flex items-center justify-center border';\n};\n\nexport const getAppearanceClasses = (value: Appearance | undefined, icon = false): string => {\n    switch (value) {\n        case 'primary':\n            return `yt-blue-solid border-blue focus:bg-blue focus:text-white focus:yt-focus active:bg-blue-dark active:text-white hover:bg-blue-light hover:border-blue-light hover:text-white hover:focus:bg-blue-light hover:focus:border-blue-light hover:focus:text-white disabled:hover:yt-blue-solid disabled:hover:hover:border-blue`;\n\n        case 'danger':\n            return `yt-red-solid border-red focus:bg-red focus:text-white focus:yt-focus-red active:bg-red-dark active:text-white hover:bg-red-light hover:text-white hover:focus:bg-red-light hover:focus:text-white disabled:hover:yt-red-solid`;\n\n        case 'ghost':\n            return `yt-blue-inverted focus:bg-transparent focus:text-blue focus:yt-focus active:bg-blue-lightest active:border-blue active:text-blue-dark hover:bg-blue-lightest hover:border-blue-light hover:text-blue-light hover:focus:bg-blue-lightest hover:focus:border-blue-light hover:focus:text-blue-light disabled:hover:yt-blue-inverted`;\n\n        case 'discrete': {\n            if (icon) {\n                return `bg-transparent text-black border-transparent focus:text-black focus:yt-focus active:text-black hover:text-grey-darkest hover:focus:text-grey-darkest disabled:hover:text-black `;\n            }\n\n            return `yt-transparent border-transparent focus:text-blue focus:yt-focus active:text-blue-dark hover:text-blue-light hover:focus:text-blue-light disabled:hover:yt-transparent`;\n        }\n\n        default:\n            return `yt-grey-solid border-grey focus:bg-grey focus:yt-focus active:bg-grey-dark active:text-black hover:bg-grey-light hover:text-grey-darkest hover:focus:bg-grey-light hover:focus:text-grey-darkest disabled:hover:yt-grey-solid`;\n    }\n};\n\nexport const createButton = (\n    props: any,\n    className: string,\n    ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>\n): JSX.Element => {\n    const { dialog, hanger, menu, popover, tooltip, ...otherProps } = props;\n\n    let button = <ButtonPrimitive.Button {...otherProps} className={className} ref={ref} />;\n\n    if (typeof dialog === 'function') {\n        button = dialog({ trigger: button });\n    } else if (typeof menu === 'function') {\n        button = menu({ trigger: button, appearance: otherProps.appearance });\n    } else if (typeof popover === 'function') {\n        button = popover({ trigger: button });\n    }\n\n    if (typeof hanger === 'function') {\n        button = hanger({ anchor: button });\n    }\n\n    if (tooltip) {\n        button = <Tooltip title={tooltip}>{button}</Tooltip>;\n    }\n\n    return button;\n};\n"],"names":["getButtonClasses","getAppearanceClasses","value","icon","createButton","props","className","ref","dialog","hanger","menu","popover","tooltip","otherProps","button","React","ButtonPrimitive","trigger","appearance","anchor","Tooltip","title"],"mappings":";;;;;;IAKaA,gBAAgB,GAAG,SAAnBA,gBAAmB;AAC5B,SAAO,wHAAP;AACH;IAEYC,oBAAoB,GAAG,SAAvBA,oBAAuB,CAACC,KAAD,EAAgCC,IAAhC;MAAgCA;AAAAA,IAAAA,OAAO;;;AACvE,UAAQD,KAAR;AACI,SAAK,SAAL;AACI;;AAEJ,SAAK,QAAL;AACI;;AAEJ,SAAK,OAAL;AACI;;AAEJ,SAAK,UAAL;AAAiB;AACb,YAAIC,IAAJ,EAAU;AACN;AACH;;AAED;AACH;;AAED;AACI;AAnBR;AAqBH;IAEYC,YAAY,GAAG,SAAfA,YAAe,CACxBC,KADwB,EAExBC,SAFwB,EAGxBC,GAHwB;AAKxB,MAAQC,MAAR,GAAkEH,KAAlE,CAAQG,MAAR;AAAA,MAAgBC,MAAhB,GAAkEJ,KAAlE,CAAgBI,MAAhB;AAAA,MAAwBC,IAAxB,GAAkEL,KAAlE,CAAwBK,IAAxB;AAAA,MAA8BC,OAA9B,GAAkEN,KAAlE,CAA8BM,OAA9B;AAAA,MAAuCC,OAAvC,GAAkEP,KAAlE,CAAuCO,OAAvC;AAAA,MAAmDC,UAAnD,iCAAkER,KAAlE;;AAEA,MAAIS,MAAM,GAAGC,4BAAA,CAACC,MAAD,oBAA4BH;AAAYP,IAAAA,SAAS,EAAEA;AAAWC,IAAAA,GAAG,EAAEA;IAAnE,CAAb;;AAEA,MAAI,OAAOC,MAAP,KAAkB,UAAtB,EAAkC;AAC9BM,IAAAA,MAAM,GAAGN,MAAM,CAAC;AAAES,MAAAA,OAAO,EAAEH;AAAX,KAAD,CAAf;AACH,GAFD,MAEO,IAAI,OAAOJ,IAAP,KAAgB,UAApB,EAAgC;AACnCI,IAAAA,MAAM,GAAGJ,IAAI,CAAC;AAAEO,MAAAA,OAAO,EAAEH,MAAX;AAAmBI,MAAAA,UAAU,EAAEL,UAAU,CAACK;AAA1C,KAAD,CAAb;AACH,GAFM,MAEA,IAAI,OAAOP,OAAP,KAAmB,UAAvB,EAAmC;AACtCG,IAAAA,MAAM,GAAGH,OAAO,CAAC;AAAEM,MAAAA,OAAO,EAAEH;AAAX,KAAD,CAAhB;AACH;;AAED,MAAI,OAAOL,MAAP,KAAkB,UAAtB,EAAkC;AAC9BK,IAAAA,MAAM,GAAGL,MAAM,CAAC;AAAEU,MAAAA,MAAM,EAAEL;AAAV,KAAD,CAAf;AACH;;AAED,MAAIF,OAAJ,EAAa;AACTE,IAAAA,MAAM,GAAGC,4BAAA,CAACK,OAAD;AAASC,MAAAA,KAAK,EAAET;KAAhB,EAA0BE,MAA1B,CAAT;AACH;;AAED,SAAOA,MAAP;AACH;;;;"}

package/dist/esm/components/HoverCard/HoverCard.js

@@ -0,0 +1,33 @@
+import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
+import { createElement, forwardRef } from 'react';
+import cn from 'classnames';
+import { Root, Trigger as Trigger$1, Content as Content$1 } from '@radix-ui/react-hover-card';
+
+var _excluded = ["placement"];
+var Trigger = /*#__PURE__*/forwardRef(function HoverCardTrigger(props, ref) {
+  return createElement(Trigger$1, Object.assign({}, props, {
+    asChild: true,
+    ref: ref
+  }));
+});
+var Content = /*#__PURE__*/forwardRef(function HoverCardContent(externalProps, ref) {
+  var placement = externalProps.placement,
+      props = _objectWithoutPropertiesLoose(externalProps, _excluded);
+
+  var className = cn('bg-white rounded p-3 yt-shadow', props.className);
+  return createElement(Content$1, Object.assign({}, props, {
+    className: className,
+    ref: ref,
+    side: placement
+  }));
+});
+var HoverCard = function HoverCard(props) {
+  return createElement(Root, Object.assign({}, props, {
+    openDelay: 300
+  }));
+};
+HoverCard.Trigger = Trigger;
+HoverCard.Content = Content;
+
+export { HoverCard };
+//# sourceMappingURL=HoverCard.js.map

package/dist/esm/components/HoverCard/HoverCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HoverCard.js","sources":["../../../../src/components/HoverCard/HoverCard.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as HoverCardPrimitive from '@radix-ui/react-hover-card';\nimport { Placement } from '../..';\n\nexport type HoverCardTriggerProps = React.HTMLAttributes<HTMLAnchorElement>;\nconst Trigger = React.forwardRef(function HoverCardTrigger(props: HoverCardTriggerProps, ref: React.Ref<HTMLAnchorElement>) {\n    return <HoverCardPrimitive.Trigger {...props} asChild ref={ref} />;\n});\n\nexport type HoverCardContentProps = React.HTMLAttributes<HTMLDivElement> & {\n    /** Set the position of the HoverCard relative to its trigger. Default value is `bottom` */\n    placement?: Placement;\n};\nconst Content = React.forwardRef(function HoverCardContent(externalProps: HoverCardContentProps, ref: React.Ref<HTMLDivElement>) {\n    const { placement, ...props } = externalProps;\n    const className = cn('bg-white rounded p-3 yt-shadow', props.className);\n\n    return <HoverCardPrimitive.Content {...props} className={className} ref={ref} side={placement} />;\n});\n\nexport type HoverCardProps = React.PropsWithChildren<{}>;\n\nexport const HoverCard = (props: HoverCardProps) => {\n    return <HoverCardPrimitive.Root {...props} openDelay={300} />;\n};\nHoverCard.Trigger = Trigger;\nHoverCard.Content = Content;\n"],"names":["Trigger","React","HoverCardTrigger","props","ref","HoverCardPrimitive","asChild","Content","HoverCardContent","externalProps","placement","className","cn","side","HoverCard","openDelay"],"mappings":";;;;;;AAMA,IAAMA,OAAO,gBAAGC,UAAA,CAAiB,SAASC,gBAAT,CAA0BC,KAA1B,EAAwDC,GAAxD;AAC7B,SAAOH,aAAA,CAACI,SAAD,oBAAgCF;AAAOG,IAAAA,OAAO;AAACF,IAAAA,GAAG,EAAEA;IAApD,CAAP;AACH,CAFe,CAAhB;AAQA,IAAMG,OAAO,gBAAGN,UAAA,CAAiB,SAASO,gBAAT,CAA0BC,aAA1B,EAAgEL,GAAhE;AAC7B,MAAQM,SAAR,GAAgCD,aAAhC,CAAQC,SAAR;AAAA,MAAsBP,KAAtB,iCAAgCM,aAAhC;;AACA,MAAME,SAAS,GAAGC,EAAE,CAAC,gCAAD,EAAmCT,KAAK,CAACQ,SAAzC,CAApB;AAEA,SAAOV,aAAA,CAACI,SAAD,oBAAgCF;AAAOQ,IAAAA,SAAS,EAAEA;AAAWP,IAAAA,GAAG,EAAEA;AAAKS,IAAAA,IAAI,EAAEH;IAA7E,CAAP;AACH,CALe,CAAhB;IASaI,SAAS,GAAG,SAAZA,SAAY,CAACX,KAAD;AACrB,SAAOF,aAAA,CAACI,IAAD,oBAA6BF;AAAOY,IAAAA,SAAS,EAAE;IAA/C,CAAP;AACH;AACDD,SAAS,CAACd,OAAV,GAAoBA,OAApB;AACAc,SAAS,CAACP,OAAV,GAAoBA,OAApB;;;;"}

package/dist/esm/components/SearchInput/SearchInput.js

@@ -29,6 +29,7 @@ import '../Field/Field.js';
 import '../Form/Form.js';
 import '../Group/Group.js';
 import '../Hanger/Hanger.js';
+import '../HoverCard/HoverCard.js';
 import '../Listbox/Listbox.js';
 import '../RadioGroup/RadioGroup.js';
 import '../Menu/Menu.js';
@@ -64,11 +65,15 @@ var SearchInput = /*#__PURE__*/forwardRef(function SearchInput(_ref, ref) {
   };
 
   var handleKeyDown = function handleKeyDown(event) {
+    var _props$onKeyDown;
+
     var isEnterKeyPressed = event.keyCode === keycode('enter');
 
     if (isEnterKeyPressed) {
       handleClick();
     }
+
+    (_props$onKeyDown = props.onKeyDown) === null || _props$onKeyDown === void 0 ? void 0 : _props$onKeyDown.call(props, event);
   };
 
   return createElement(Input, Object.assign({

package/dist/esm/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 keycode from 'keycode';\nimport { Input, InputProps, useLocalization, IconButton } from '../..';\n\nexport type SearchInputTexts = {\n    /**\n     * aria-label text for input\n     */\n    inputLabel: string;\n};\n\nexport type SearchInputProps = Omit<InputProps, 'icon'> & {\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 { texts } = useLocalization();\n\n    const handleClick = (): void => {\n        if (!props.disabled) {\n            onSearch?.(props.value);\n        }\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n        const isEnterKeyPressed = event.keyCode === keycode('enter');\n\n        if (isEnterKeyPressed) {\n            handleClick();\n        }\n    };\n\n    return (\n        <Input\n            aria-label={texts.searchInput.inputLabel}\n            {...props}\n            button={\n                <IconButton\n                    icon=\"search\"\n                    className=\"!border-transparent !bg-transparent focus:!border-transparent peer-focus:!border-transparent peer-focus:peer-active:!border-transparent\"\n                    disabled={props.disabled}\n                    onClick={handleClick}\n                />\n            }\n            onKeyDown={handleKeyDown}\n            ref={ref}\n            type=\"search\"\n        />\n    );\n});\n"],"names":["SearchInput","React","ref","onSearch","props","useLocalization","texts","handleClick","disabled","value","handleKeyDown","event","isEnterKeyPressed","keyCode","keycode","Input","searchInput","inputLabel","button","IconButton","icon","className","onClick","onKeyDown","type"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAgBaA,WAAW,gBAAGC,UAAA,CAAiB,SAASD,WAAT,OAExCE,GAFwC;MACtCC,gBAAAA;MAAaC;;AAGf,yBAAkBC,eAAe,EAAjC;AAAA,MAAQC,KAAR,oBAAQA,KAAR;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc;AAChB,QAAI,CAACH,KAAK,CAACI,QAAX,EAAqB;AACjBL,MAAAA,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGC,KAAK,CAACK,KAAT,CAAR;AACH;AACJ,GAJD;;AAMA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD;AAClB,QAAMC,iBAAiB,GAAGD,KAAK,CAACE,OAAN,KAAkBC,OAAO,CAAC,OAAD,CAAnD;;AAEA,QAAIF,iBAAJ,EAAuB;AACnBL,MAAAA,WAAW;AACd;AACJ,GAND;;AAQA,SACIN,aAAA,CAACc,KAAD;kBACgBT,KAAK,CAACU,WAAN,CAAkBC;KAC1Bb;AACJc,IAAAA,MAAM,EACFjB,aAAA,CAACkB,UAAD;AACIC,MAAAA,IAAI,EAAC;AACLC,MAAAA,SAAS,EAAC;AACVb,MAAAA,QAAQ,EAAEJ,KAAK,CAACI;AAChBc,MAAAA,OAAO,EAAEf;KAJb;AAOJgB,IAAAA,SAAS,EAAEb;AACXR,IAAAA,GAAG,EAAEA;AACLsB,IAAAA,IAAI,EAAC;IAbT,CADJ;AAiBH,CArC0B;;;;"}
+{"version":3,"file":"SearchInput.js","sources":["../../../../src/components/SearchInput/SearchInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport keycode from 'keycode';\nimport { Input, InputProps, useLocalization, IconButton } from '../..';\n\nexport type SearchInputTexts = {\n    /**\n     * aria-label text for input\n     */\n    inputLabel: string;\n};\n\nexport type SearchInputProps = Omit<InputProps, 'icon'> & {\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 { texts } = useLocalization();\n\n    const handleClick = (): void => {\n        if (!props.disabled) {\n            onSearch?.(props.value);\n        }\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n        const isEnterKeyPressed = event.keyCode === keycode('enter');\n\n        if (isEnterKeyPressed) {\n            handleClick();\n        }\n\n        props.onKeyDown?.(event);\n    };\n\n    return (\n        <Input\n            aria-label={texts.searchInput.inputLabel}\n            {...props}\n            button={\n                <IconButton\n                    icon=\"search\"\n                    className=\"!border-transparent !bg-transparent focus:!border-transparent peer-focus:!border-transparent peer-focus:peer-active:!border-transparent\"\n                    disabled={props.disabled}\n                    onClick={handleClick}\n                />\n            }\n            onKeyDown={handleKeyDown}\n            ref={ref}\n            type=\"search\"\n        />\n    );\n});\n"],"names":["SearchInput","React","ref","onSearch","props","useLocalization","texts","handleClick","disabled","value","handleKeyDown","event","isEnterKeyPressed","keyCode","keycode","onKeyDown","Input","searchInput","inputLabel","button","IconButton","icon","className","onClick","type"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAgBaA,WAAW,gBAAGC,UAAA,CAAiB,SAASD,WAAT,OAExCE,GAFwC;MACtCC,gBAAAA;MAAaC;;AAGf,yBAAkBC,eAAe,EAAjC;AAAA,MAAQC,KAAR,oBAAQA,KAAR;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc;AAChB,QAAI,CAACH,KAAK,CAACI,QAAX,EAAqB;AACjBL,MAAAA,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGC,KAAK,CAACK,KAAT,CAAR;AACH;AACJ,GAJD;;AAMA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD;;;AAClB,QAAMC,iBAAiB,GAAGD,KAAK,CAACE,OAAN,KAAkBC,OAAO,CAAC,OAAD,CAAnD;;AAEA,QAAIF,iBAAJ,EAAuB;AACnBL,MAAAA,WAAW;AACd;;AAED,wBAAAH,KAAK,CAACW,SAAN,2EAAAX,KAAK,EAAaO,KAAb,CAAL;AACH,GARD;;AAUA,SACIV,aAAA,CAACe,KAAD;kBACgBV,KAAK,CAACW,WAAN,CAAkBC;KAC1Bd;AACJe,IAAAA,MAAM,EACFlB,aAAA,CAACmB,UAAD;AACIC,MAAAA,IAAI,EAAC;AACLC,MAAAA,SAAS,EAAC;AACVd,MAAAA,QAAQ,EAAEJ,KAAK,CAACI;AAChBe,MAAAA,OAAO,EAAEhB;KAJb;AAOJQ,IAAAA,SAAS,EAAEL;AACXR,IAAAA,GAAG,EAAEA;AACLsB,IAAAA,IAAI,EAAC;IAbT,CADJ;AAiBH,CAvC0B;;;;"}

package/dist/esm/components/Table/hooks/plugins/useRowSelect.js

@@ -63,8 +63,7 @@ var useRowSelect = function useRowSelect(onSelectedRows) {
             };
 
             return React__default.createElement(Checkbox, Object.assign({}, props, {
-              onChange: onChange,
-              className: "mt-px"
+              onChange: onChange
             }));
           },
           Cell: function Cell(_ref2) {
@@ -96,7 +95,7 @@ var useRowSelect = function useRowSelect(onSelectedRows) {
             };
 
             return React__default.createElement(Checkbox, Object.assign({}, props, {
-              className: "mt-px",
+              className: "mt-2.5",
               onClick: onClick,
               // this is necessary to remove console spam from eslint
               onChange: function onChange() {
@@ -105,7 +104,7 @@ var useRowSelect = function useRowSelect(onSelectedRows) {
             }));
           },
           flex: '0 0 36px',
-          className: 'flex-col justify-start !pb-0'
+          className: 'flex-col justify-start !py-0'
         }].concat(columns);
       });
     }

package/dist/esm/components/Table/hooks/plugins/useRowSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"useRowSelect.js","sources":["../../../../../../src/components/Table/hooks/plugins/useRowSelect.tsx"],"sourcesContent":["// this wraps react-table's internal useRowSelect hook\nimport React from 'react';\nimport { useRowSelect as useBaseRowSelect, Row, PluginHook } from 'react-table';\nimport { Checkbox } from '../../../Checkbox/Checkbox';\nimport { SelectedRowsHandler } from '../../types';\n\nconst toggleBetween = (fromRowIndex: number, toRowIndex: number): [number, number] => {\n    const fromIndex = toRowIndex < fromRowIndex ? toRowIndex : fromRowIndex;\n    const toIndex = toRowIndex > fromRowIndex ? toRowIndex : fromRowIndex;\n\n    return [fromIndex, toIndex];\n};\n\n// react-table calls \"index paths\" row ids. we named them indexPaths to reduce confusion with natural ids\n// the selection hook usess react-table's row selection, so this hok references row.id - it is the index path\n\nexport const useRowSelect = (onSelectedRows: SelectedRowsHandler | undefined): PluginHook<{}> => {\n    const plugin = (hooks: any): void => {\n        // eslint-disable-next-line react-hooks/rules-of-hooks\n        useBaseRowSelect(hooks);\n\n        if (onSelectedRows) {\n            const toggleRowSelected = (indexPath: string, checked: boolean): void =>\n                onSelectedRows(state => {\n                    const nextState = { ...state };\n\n                    if (checked) {\n                        nextState[indexPath] = true;\n                    } else {\n                        delete nextState[indexPath];\n                    }\n\n                    return nextState;\n                });\n\n            const prepareRow = (row: any) => {\n                row.toggleRowSelected = () => toggleRowSelected(row.id, !row.isSelected);\n            };\n\n            hooks.prepareRow.push(prepareRow);\n\n            // eslint-disable-next-line react-hooks/rules-of-hooks\n            const lastSelectedSortedIndex = React.useRef();\n\n            hooks.visibleColumns.push((columns: any) => [\n                {\n                    id: 'selection',\n                    Header: ({ getToggleAllRowsSelectedProps, rows }: any) => {\n                        const { onChange: _, ...props } = getToggleAllRowsSelectedProps();\n\n                        const onChange = (checked): void => {\n                            if (checked) {\n                                // this intentionally only selects top level rows - sub rows add too much complexity\n                                onSelectedRows(Object.assign({}, Array(rows.length).fill(true)));\n                            } else {\n                                onSelectedRows({});\n                            }\n                        };\n\n                        return <Checkbox {...props} onChange={onChange} className=\"mt-px\" />;\n                    },\n                    Cell: ({ row, rows }: any) => {\n                        const { onChange: _, ...props } = row.getToggleRowSelectedProps();\n                        // row.index refers to the index in the original data, not the current index\n                        const sortedIndex = rows.findIndex((r: Row) => r.index === row.index);\n\n                        const onClick = (event: React.MouseEvent): void => {\n                            if (event.shiftKey) {\n                                const [fromIndex, toIndex] = toggleBetween(lastSelectedSortedIndex.current || 0, sortedIndex);\n\n                                for (let i = fromIndex; i <= toIndex; i++) {\n                                    toggleRowSelected(rows[i].id, true);\n                                }\n                            } else {\n                                toggleRowSelected(row.id, !props.checked);\n                            }\n\n                            lastSelectedSortedIndex.current = sortedIndex;\n                        };\n\n                        return (\n                            <Checkbox\n                                {...props}\n                                className=\"mt-px\"\n                                onClick={onClick}\n                                // this is necessary to remove console spam from eslint\n                                onChange={() => false}\n                            />\n                        );\n                    },\n                    flex: '0 0 36px',\n                    className: 'flex-col justify-start !pb-0',\n                },\n                ...columns,\n            ]);\n        }\n    };\n    plugin.pluginName = 'useRowSelect';\n    return plugin;\n};\n"],"names":["toggleBetween","fromRowIndex","toRowIndex","fromIndex","toIndex","useRowSelect","onSelectedRows","plugin","hooks","useBaseRowSelect","toggleRowSelected","indexPath","checked","state","nextState","prepareRow","row","id","isSelected","push","lastSelectedSortedIndex","React","useRef","visibleColumns","columns","Header","getToggleAllRowsSelectedProps","rows","props","onChange","Object","assign","Array","length","fill","Checkbox","className","Cell","getToggleRowSelectedProps","sortedIndex","findIndex","r","index","onClick","event","shiftKey","current","i","flex","pluginName"],"mappings":"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"}
+{"version":3,"file":"useRowSelect.js","sources":["../../../../../../src/components/Table/hooks/plugins/useRowSelect.tsx"],"sourcesContent":["// this wraps react-table's internal useRowSelect hook\nimport React from 'react';\nimport { useRowSelect as useBaseRowSelect, Row, PluginHook } from 'react-table';\nimport { Checkbox } from '../../../Checkbox/Checkbox';\nimport { SelectedRowsHandler } from '../../types';\n\nconst toggleBetween = (fromRowIndex: number, toRowIndex: number): [number, number] => {\n    const fromIndex = toRowIndex < fromRowIndex ? toRowIndex : fromRowIndex;\n    const toIndex = toRowIndex > fromRowIndex ? toRowIndex : fromRowIndex;\n\n    return [fromIndex, toIndex];\n};\n\n// react-table calls \"index paths\" row ids. we named them indexPaths to reduce confusion with natural ids\n// the selection hook usess react-table's row selection, so this hok references row.id - it is the index path\n\nexport const useRowSelect = (onSelectedRows: SelectedRowsHandler | undefined): PluginHook<{}> => {\n    const plugin = (hooks: any): void => {\n        // eslint-disable-next-line react-hooks/rules-of-hooks\n        useBaseRowSelect(hooks);\n\n        if (onSelectedRows) {\n            const toggleRowSelected = (indexPath: string, checked: boolean): void =>\n                onSelectedRows(state => {\n                    const nextState = { ...state };\n\n                    if (checked) {\n                        nextState[indexPath] = true;\n                    } else {\n                        delete nextState[indexPath];\n                    }\n\n                    return nextState;\n                });\n\n            const prepareRow = (row: any) => {\n                row.toggleRowSelected = () => toggleRowSelected(row.id, !row.isSelected);\n            };\n\n            hooks.prepareRow.push(prepareRow);\n\n            // eslint-disable-next-line react-hooks/rules-of-hooks\n            const lastSelectedSortedIndex = React.useRef();\n\n            hooks.visibleColumns.push((columns: any) => [\n                {\n                    id: 'selection',\n                    Header: ({ getToggleAllRowsSelectedProps, rows }: any) => {\n                        const { onChange: _, ...props } = getToggleAllRowsSelectedProps();\n\n                        const onChange = (checked): void => {\n                            if (checked) {\n                                // this intentionally only selects top level rows - sub rows add too much complexity\n                                onSelectedRows(Object.assign({}, Array(rows.length).fill(true)));\n                            } else {\n                                onSelectedRows({});\n                            }\n                        };\n\n                        return <Checkbox {...props} onChange={onChange} />;\n                    },\n                    Cell: ({ row, rows }: any) => {\n                        const { onChange: _, ...props } = row.getToggleRowSelectedProps();\n                        // row.index refers to the index in the original data, not the current index\n                        const sortedIndex = rows.findIndex((r: Row) => r.index === row.index);\n\n                        const onClick = (event: React.MouseEvent): void => {\n                            if (event.shiftKey) {\n                                const [fromIndex, toIndex] = toggleBetween(lastSelectedSortedIndex.current || 0, sortedIndex);\n\n                                for (let i = fromIndex; i <= toIndex; i++) {\n                                    toggleRowSelected(rows[i].id, true);\n                                }\n                            } else {\n                                toggleRowSelected(row.id, !props.checked);\n                            }\n\n                            lastSelectedSortedIndex.current = sortedIndex;\n                        };\n\n                        return (\n                            <Checkbox\n                                {...props}\n                                className=\"mt-2.5\"\n                                onClick={onClick}\n                                // this is necessary to remove console spam from eslint\n                                onChange={() => false}\n                            />\n                        );\n                    },\n                    flex: '0 0 36px',\n                    className: 'flex-col justify-start !py-0',\n                },\n                ...columns,\n            ]);\n        }\n    };\n    plugin.pluginName = 'useRowSelect';\n    return plugin;\n};\n"],"names":["toggleBetween","fromRowIndex","toRowIndex","fromIndex","toIndex","useRowSelect","onSelectedRows","plugin","hooks","useBaseRowSelect","toggleRowSelected","indexPath","checked","state","nextState","prepareRow","row","id","isSelected","push","lastSelectedSortedIndex","React","useRef","visibleColumns","columns","Header","getToggleAllRowsSelectedProps","rows","props","onChange","Object","assign","Array","length","fill","Checkbox","Cell","getToggleRowSelectedProps","sortedIndex","findIndex","r","index","onClick","event","shiftKey","current","i","className","flex","pluginName"],"mappings":"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"}

package/dist/esm/components/Table/util/renderColumn.js

@@ -31,7 +31,8 @@ var Column = function Column(_ref) {
   }), React__default.createElement("span", {
     className: "truncate"
   }, cell.render('Header')), cell.isSorted ? React__default.createElement(Icon, {
-    name: cell.isSortedDesc ? 'chevron-down-solid' : 'chevron-up-solid'
+    name: cell.isSortedDesc ? 'chevron-down-solid' : 'chevron-up-solid',
+    className: "-mt-0.5"
   }) : null);
 };
 

package/dist/esm/components/Table/util/renderColumn.js.map

@@ -1 +1 @@
-{"version":3,"file":"renderColumn.js","sources":["../../../../../src/components/Table/util/renderColumn.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { Icon } from '../../Icon/Icon';\n\nexport const Column = ({ cell }: any): any => {\n    const props = {\n        ...cell.getHeaderProps(),\n        ...(cell.getSortByToggleProps && cell.getSortByToggleProps({ title: undefined })),\n        className: cn('yt-table__cell flex flex-1 truncate p-2 align-middle text-grey-darkest hover:text-black', cell.className, {\n            'yt-table__cell__group': !!cell.columns,\n            'cursor-pointer': !cell.disableSorting,\n            'justify-start text-left': cell.align === 'left',\n            'justify-end text-right': cell.align === 'right',\n            'justify-center text-center': cell.align === 'center' || !cell.align,\n        }),\n        style: { ...cell.style, flex: cell.flex },\n    };\n\n    if (cell.isSorted) {\n        props['aria-sort'] = cell.isSortedDesc ? 'descending' : 'ascending';\n    }\n\n    return (\n        <div {...props} key={cell.id} data-taco=\"table-column\">\n            <span className=\"truncate\">{cell.render('Header')}</span>\n            {cell.isSorted ? <Icon name={cell.isSortedDesc ? 'chevron-down-solid' : 'chevron-up-solid'} /> : null}\n        </div>\n    );\n};\n"],"names":["Column","cell","props","getHeaderProps","getSortByToggleProps","title","undefined","className","cn","columns","disableSorting","align","style","flex","isSorted","isSortedDesc","React","key","id","render","Icon","name"],"mappings":";;;;;IAIaA,MAAM,GAAG,SAATA,MAAS;MAAGC,YAAAA;;AACrB,MAAMC,KAAK,gBACJD,IAAI,CAACE,cAAL,EADI,EAEHF,IAAI,CAACG,oBAAL,IAA6BH,IAAI,CAACG,oBAAL,CAA0B;AAAEC,IAAAA,KAAK,EAAEC;AAAT,GAA1B,CAF1B;AAGPC,IAAAA,SAAS,EAAEC,EAAE,CAAC,yFAAD,EAA4FP,IAAI,CAACM,SAAjG,EAA4G;AACrH,+BAAyB,CAAC,CAACN,IAAI,CAACQ,OADqF;AAErH,wBAAkB,CAACR,IAAI,CAACS,cAF6F;AAGrH,iCAA2BT,IAAI,CAACU,KAAL,KAAe,MAH2E;AAIrH,gCAA0BV,IAAI,CAACU,KAAL,KAAe,OAJ4E;AAKrH,oCAA8BV,IAAI,CAACU,KAAL,KAAe,QAAf,IAA2B,CAACV,IAAI,CAACU;AALsD,KAA5G,CAHN;AAUPC,IAAAA,KAAK,eAAOX,IAAI,CAACW,KAAZ;AAAmBC,MAAAA,IAAI,EAAEZ,IAAI,CAACY;AAA9B;AAVE,IAAX;;AAaA,MAAIZ,IAAI,CAACa,QAAT,EAAmB;AACfZ,IAAAA,KAAK,CAAC,WAAD,CAAL,GAAqBD,IAAI,CAACc,YAAL,GAAoB,YAApB,GAAmC,WAAxD;AACH;;AAED,SACIC,4BAAA,MAAA,oBAASd;AAAOe,IAAAA,GAAG,EAAEhB,IAAI,CAACiB;iBAAc;IAAxC,EACIF,4BAAA,OAAA;AAAMT,IAAAA,SAAS,EAAC;GAAhB,EAA4BN,IAAI,CAACkB,MAAL,CAAY,QAAZ,CAA5B,CADJ,EAEKlB,IAAI,CAACa,QAAL,GAAgBE,4BAAA,CAACI,IAAD;AAAMC,IAAAA,IAAI,EAAEpB,IAAI,CAACc,YAAL,GAAoB,oBAApB,GAA2C;GAAvD,CAAhB,GAAgG,IAFrG,CADJ;AAMH;;;;"}
+{"version":3,"file":"renderColumn.js","sources":["../../../../../src/components/Table/util/renderColumn.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { Icon } from '../../Icon/Icon';\n\nexport const Column = ({ cell }: any): any => {\n    const props = {\n        ...cell.getHeaderProps(),\n        ...(cell.getSortByToggleProps && cell.getSortByToggleProps({ title: undefined })),\n        className: cn('yt-table__cell flex flex-1 truncate p-2 align-middle text-grey-darkest hover:text-black', cell.className, {\n            'yt-table__cell__group': !!cell.columns,\n            'cursor-pointer': !cell.disableSorting,\n            'justify-start text-left': cell.align === 'left',\n            'justify-end text-right': cell.align === 'right',\n            'justify-center text-center': cell.align === 'center' || !cell.align,\n        }),\n        style: { ...cell.style, flex: cell.flex },\n    };\n\n    if (cell.isSorted) {\n        props['aria-sort'] = cell.isSortedDesc ? 'descending' : 'ascending';\n    }\n\n    return (\n        <div {...props} key={cell.id} data-taco=\"table-column\">\n            <span className=\"truncate\">{cell.render('Header')}</span>\n            {cell.isSorted ? (\n                <Icon name={cell.isSortedDesc ? 'chevron-down-solid' : 'chevron-up-solid'} className=\"-mt-0.5\" />\n            ) : null}\n        </div>\n    );\n};\n"],"names":["Column","cell","props","getHeaderProps","getSortByToggleProps","title","undefined","className","cn","columns","disableSorting","align","style","flex","isSorted","isSortedDesc","React","key","id","render","Icon","name"],"mappings":";;;;;IAIaA,MAAM,GAAG,SAATA,MAAS;MAAGC,YAAAA;;AACrB,MAAMC,KAAK,gBACJD,IAAI,CAACE,cAAL,EADI,EAEHF,IAAI,CAACG,oBAAL,IAA6BH,IAAI,CAACG,oBAAL,CAA0B;AAAEC,IAAAA,KAAK,EAAEC;AAAT,GAA1B,CAF1B;AAGPC,IAAAA,SAAS,EAAEC,EAAE,CAAC,yFAAD,EAA4FP,IAAI,CAACM,SAAjG,EAA4G;AACrH,+BAAyB,CAAC,CAACN,IAAI,CAACQ,OADqF;AAErH,wBAAkB,CAACR,IAAI,CAACS,cAF6F;AAGrH,iCAA2BT,IAAI,CAACU,KAAL,KAAe,MAH2E;AAIrH,gCAA0BV,IAAI,CAACU,KAAL,KAAe,OAJ4E;AAKrH,oCAA8BV,IAAI,CAACU,KAAL,KAAe,QAAf,IAA2B,CAACV,IAAI,CAACU;AALsD,KAA5G,CAHN;AAUPC,IAAAA,KAAK,eAAOX,IAAI,CAACW,KAAZ;AAAmBC,MAAAA,IAAI,EAAEZ,IAAI,CAACY;AAA9B;AAVE,IAAX;;AAaA,MAAIZ,IAAI,CAACa,QAAT,EAAmB;AACfZ,IAAAA,KAAK,CAAC,WAAD,CAAL,GAAqBD,IAAI,CAACc,YAAL,GAAoB,YAApB,GAAmC,WAAxD;AACH;;AAED,SACIC,4BAAA,MAAA,oBAASd;AAAOe,IAAAA,GAAG,EAAEhB,IAAI,CAACiB;iBAAc;IAAxC,EACIF,4BAAA,OAAA;AAAMT,IAAAA,SAAS,EAAC;GAAhB,EAA4BN,IAAI,CAACkB,MAAL,CAAY,QAAZ,CAA5B,CADJ,EAEKlB,IAAI,CAACa,QAAL,GACGE,4BAAA,CAACI,IAAD;AAAMC,IAAAA,IAAI,EAAEpB,IAAI,CAACc,YAAL,GAAoB,oBAApB,GAA2C;AAAoBR,IAAAA,SAAS,EAAC;GAArF,CADH,GAEG,IAJR,CADJ;AAQH;;;;"}

package/dist/esm/index.js

@@ -26,6 +26,7 @@ export { Field } from './components/Field/Field.js';
 export { Form } from './components/Form/Form.js';
 export { Group } from './components/Group/Group.js';
 export { Hanger, Title } from './components/Hanger/Hanger.js';
+export { HoverCard } from './components/HoverCard/HoverCard.js';
 export { SearchInput } from './components/SearchInput/SearchInput.js';
 export { Listbox, MultiListbox } from './components/Listbox/Listbox.js';
 export { RadioGroup, findByValue, getRadioGroupItemValueAsString, useRadioGroup } from './components/RadioGroup/RadioGroup.js';

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/index.d.ts

@@ -13,6 +13,7 @@ export * from './components/Field/Field';
 export * from './components/Form/Form';
 export * from './components/Group/Group';
 export * from './components/Hanger/Hanger';
+export * from './components/HoverCard/HoverCard';
 export * from './components/Icon/Icon';
 export * from './components/IconButton/IconButton';
 export * from './components/Input/Input';