@vygruppen/spor-react 3.4.3 → 3.4.4

package/.turbo/turbo-build.log

@@ -1,5 +1,5 @@
 
-> @vygruppen/spor-react@3.4.3 build
+> @vygruppen/spor-react@3.4.4 build
 > tsup src/index.tsx --dts --treeshake --format cjs,esm
 
 CLI Building entry: src/index.tsx
@@ -9,13 +9,13 @@
 CJS Build start
 ESM Build start
 DTS Build start
-"toZoned" and "toTime" are imported from external module "@internationalized/date" but never used in "dist/chunk-LHZ4TUAK.mjs".
 "toZoned" and "toTime" are imported from external module "@internationalized/date" but never used in "dist/index.js".
+"toZoned" and "toTime" are imported from external module "@internationalized/date" but never used in "dist/chunk-QBIZVUPL.mjs".
+CJS dist/index.js 903.84 KB
+CJS ⚡️ Build success in 6056ms
 ESM dist/index.mjs                      2.01 KB
-ESM dist/CountryCodeSelect-EGTCLFUV.mjs 350.82 KB
-ESM dist/chunk-LHZ4TUAK.mjs             420.93 KB
-ESM ⚡️ Build success in 6586ms
-CJS dist/index.js 903.79 KB
-CJS ⚡️ Build success in 6587ms
-DTS ⚡️ Build success in 22311ms
+ESM dist/CountryCodeSelect-7GGNROZW.mjs 350.82 KB
+ESM dist/chunk-QBIZVUPL.mjs             420.97 KB
+ESM ⚡️ Build success in 6061ms
+DTS ⚡️ Build success in 22140ms
 DTS dist/index.d.ts 252.53 KB

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @vygruppen/spor-react
 
+## 3.4.4
+
+### Patch Changes
+
+- 548d9b9f: Input: Make hover-effect work as expected over icons
+
 ## 3.4.3
 
 ### Patch Changes

package/dist/{CountryCodeSelect-EGTCLFUV.mjs → CountryCodeSelect-7GGNROZW.mjs}

@@ -1,4 +1,4 @@
-import { createTexts, useTranslation, InfoSelect, Item } from './chunk-LHZ4TUAK.mjs';
+import { createTexts, useTranslation, InfoSelect, Item } from './chunk-QBIZVUPL.mjs';
 import React from 'react';
 
 // ../../node_modules/awesome-phonenumber/index-esm.mjs

package/dist/{chunk-LHZ4TUAK.mjs → chunk-QBIZVUPL.mjs}

@@ -4692,7 +4692,7 @@ var Input = forwardRef(
     const formControlProps = useFormControlContext();
     const fallbackId = `input-${useId()}`;
     const inputId = id ?? (formControlProps == null ? void 0 : formControlProps.id) ?? fallbackId;
-    return /* @__PURE__ */ React49__default.createElement(InputGroup, { position: "relative" }, leftIcon && /* @__PURE__ */ React49__default.createElement(InputLeftElement, null, leftIcon), /* @__PURE__ */ React49__default.createElement(
+    return /* @__PURE__ */ React49__default.createElement(InputGroup, { position: "relative" }, leftIcon && /* @__PURE__ */ React49__default.createElement(InputLeftElement, { pointerEvents: "none" }, leftIcon), /* @__PURE__ */ React49__default.createElement(
       Input$1,
       {
         "data-attachable": true,
@@ -4703,7 +4703,7 @@ var Input = forwardRef(
         ref,
         placeholder: " "
       }
-    ), /* @__PURE__ */ React49__default.createElement(FormLabel, { htmlFor: inputId }, label), rightIcon && /* @__PURE__ */ React49__default.createElement(InputRightElement, null, rightIcon));
+    ), /* @__PURE__ */ React49__default.createElement(FormLabel, { htmlFor: inputId }, label), rightIcon && /* @__PURE__ */ React49__default.createElement(InputRightElement, { pointerEvents: "none" }, rightIcon));
   }
 );
 var InputLeftElement2 = forwardRef(
@@ -5084,7 +5084,7 @@ var texts14 = createTexts({
     sv: "Telefonnummer"
   }
 });
-var LazyCountryCodeSelect = React49__default.lazy(() => import('./CountryCodeSelect-EGTCLFUV.mjs'));
+var LazyCountryCodeSelect = React49__default.lazy(() => import('./CountryCodeSelect-7GGNROZW.mjs'));
 var Radio = forwardRef((props, ref) => {
   return /* @__PURE__ */ React49__default.createElement(Radio$1, { ...props, ref });
 });

package/dist/index.js

@@ -5243,7 +5243,7 @@ var init_Input = __esm({
         const formControlProps = react.useFormControlContext();
         const fallbackId = `input-${React49.useId()}`;
         const inputId = id ?? (formControlProps == null ? void 0 : formControlProps.id) ?? fallbackId;
-        return /* @__PURE__ */ React49__namespace.default.createElement(react.InputGroup, { position: "relative" }, leftIcon && /* @__PURE__ */ React49__namespace.default.createElement(react.InputLeftElement, null, leftIcon), /* @__PURE__ */ React49__namespace.default.createElement(
+        return /* @__PURE__ */ React49__namespace.default.createElement(react.InputGroup, { position: "relative" }, leftIcon && /* @__PURE__ */ React49__namespace.default.createElement(react.InputLeftElement, { pointerEvents: "none" }, leftIcon), /* @__PURE__ */ React49__namespace.default.createElement(
           react.Input,
           {
             "data-attachable": true,
@@ -5254,7 +5254,7 @@ var init_Input = __esm({
             ref,
             placeholder: " "
           }
-        ), /* @__PURE__ */ React49__namespace.default.createElement(react.FormLabel, { htmlFor: inputId }, label), rightIcon && /* @__PURE__ */ React49__namespace.default.createElement(react.InputRightElement, null, rightIcon));
+        ), /* @__PURE__ */ React49__namespace.default.createElement(react.FormLabel, { htmlFor: inputId }, label), rightIcon && /* @__PURE__ */ React49__namespace.default.createElement(react.InputRightElement, { pointerEvents: "none" }, rightIcon));
       }
     );
   }

package/dist/index.mjs

@@ -1 +1 @@
-export { Accordion, AccordionButton, AccordionIcon, AccordionItem, AccordionPanel, AttachedInputs, Badge, Box, Button, ButtonGroup, Card, CardSelect, Center, Checkbox, CheckboxGroup, ChoiceChip, ClosableAlert, CloseButton, Code, Collapse, ColorInlineLoader, ColorSpinner, Combobox, Container, ContentLoader, DarkFullScreenLoader, DarkInlineLoader, DarkMode, DarkSpinner, DatePicker, DateRangePicker, Divider, Drawer, DrawerBody, DrawerCloseButton, DrawerContent, DrawerFooter, ModalHeader as DrawerHeader, DrawerOverlay, Expandable, ExpandableAlert, ExpandableItem, Fade, Flex, FloatingActionButton, FormControl, FormErrorMessage, FormHelperText, FormLabel, Grid, GridItem, HStack, Heading, IconButton, Image, Img, InfoSelect, InfoTag, Input, InputGroup, InputLeftElement, InputRightElement, Item, ItemDescription, ItemLabel, JumpButton, Language, LanguageProvider, LightFullScreenLoader, LightInlineLoader, LightMode, LightSpinner, LineIcon, ListBox, Modal, ModalBody, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalOverlay, NativeSelect, NumericStepper, PasswordInput, PhoneNumberInput, PlayPauseButton, Popover, PopoverAnchor, PopoverArrow, PopoverBody, PopoverCloseButton, PopoverContent, PopoverFooter, PopoverHeader, PopoverTrigger, PopoverWizardBody, ProgressBar, ProgressLoader, Radio, RadioGroup, ScaleFade, SearchInput, Section, SimpleDrawer, SimpleGrid, SimplePopover, Skeleton, SkeletonCircle, SkeletonText, SkipButton, Slide, SlideFade, Spacer, SporProvider, Stack, StaticAlert, Stepper, StepperStep, Switch, Tab, TabList, TabPanel, TabPanels, Table, TableCaption, Tabs, Tbody, Td, Text, TextLink, Textarea, Tfoot, Th, Thead, Time, TimePicker, Tr, TravelTag, VStack, VyLogo, WizardPopover, Wrap, WrapItem, createTexts, extendTheme, fontFaces, theme, tokens, useBreakpointValue, useClipboard, useColorMode, useColorModePreference, useColorModeValue, useControllableProp, useDisclosure, useMediaQuery, useMergeRefs, useOutsideClick, usePrefersReducedMotion, useTheme, useToast, useToken, useTranslation } from './chunk-LHZ4TUAK.mjs';
+export { Accordion, AccordionButton, AccordionIcon, AccordionItem, AccordionPanel, AttachedInputs, Badge, Box, Button, ButtonGroup, Card, CardSelect, Center, Checkbox, CheckboxGroup, ChoiceChip, ClosableAlert, CloseButton, Code, Collapse, ColorInlineLoader, ColorSpinner, Combobox, Container, ContentLoader, DarkFullScreenLoader, DarkInlineLoader, DarkMode, DarkSpinner, DatePicker, DateRangePicker, Divider, Drawer, DrawerBody, DrawerCloseButton, DrawerContent, DrawerFooter, ModalHeader as DrawerHeader, DrawerOverlay, Expandable, ExpandableAlert, ExpandableItem, Fade, Flex, FloatingActionButton, FormControl, FormErrorMessage, FormHelperText, FormLabel, Grid, GridItem, HStack, Heading, IconButton, Image, Img, InfoSelect, InfoTag, Input, InputGroup, InputLeftElement, InputRightElement, Item, ItemDescription, ItemLabel, JumpButton, Language, LanguageProvider, LightFullScreenLoader, LightInlineLoader, LightMode, LightSpinner, LineIcon, ListBox, Modal, ModalBody, ModalCloseButton, ModalContent, ModalFooter, ModalHeader, ModalOverlay, NativeSelect, NumericStepper, PasswordInput, PhoneNumberInput, PlayPauseButton, Popover, PopoverAnchor, PopoverArrow, PopoverBody, PopoverCloseButton, PopoverContent, PopoverFooter, PopoverHeader, PopoverTrigger, PopoverWizardBody, ProgressBar, ProgressLoader, Radio, RadioGroup, ScaleFade, SearchInput, Section, SimpleDrawer, SimpleGrid, SimplePopover, Skeleton, SkeletonCircle, SkeletonText, SkipButton, Slide, SlideFade, Spacer, SporProvider, Stack, StaticAlert, Stepper, StepperStep, Switch, Tab, TabList, TabPanel, TabPanels, Table, TableCaption, Tabs, Tbody, Td, Text, TextLink, Textarea, Tfoot, Th, Thead, Time, TimePicker, Tr, TravelTag, VStack, VyLogo, WizardPopover, Wrap, WrapItem, createTexts, extendTheme, fontFaces, theme, tokens, useBreakpointValue, useClipboard, useColorMode, useColorModePreference, useColorModeValue, useControllableProp, useDisclosure, useMediaQuery, useMergeRefs, useOutsideClick, usePrefersReducedMotion, useTheme, useToast, useToken, useTranslation } from './chunk-QBIZVUPL.mjs';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vygruppen/spor-react",
-  "version": "3.4.3",
+  "version": "3.4.4",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",

package/src/input/Input.tsx

@@ -40,7 +40,9 @@ export const Input = forwardRef<InputProps, "input">(
     const inputId = id ?? formControlProps?.id ?? fallbackId;
     return (
       <InputGroup position="relative">
-        {leftIcon && <InputLeftElement>{leftIcon}</InputLeftElement>}
+        {leftIcon && (
+          <InputLeftElement pointerEvents="none">{leftIcon}</InputLeftElement>
+        )}
         <ChakraInput
           data-attachable
           paddingLeft={leftIcon ? 7 : undefined}
@@ -51,7 +53,11 @@ export const Input = forwardRef<InputProps, "input">(
           placeholder=" " // This is needed to make the label work as expected
         />
         <FormLabel htmlFor={inputId}>{label}</FormLabel>
-        {rightIcon && <InputRightElement>{rightIcon}</InputRightElement>}
+        {rightIcon && (
+          <InputRightElement pointerEvents="none">
+            {rightIcon}
+          </InputRightElement>
+        )}
       </InputGroup>
     );
   }