@razorpay/blade 12.0.3 → 12.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (61) hide show
  1. package/build/lib/native/components/Button/IconButton/IconButton.js +1 -1
  2. package/build/lib/native/components/Button/IconButton/IconButton.js.map +1 -1
  3. package/build/lib/native/components/Radio/Radio.js +1 -1
  4. package/build/lib/native/components/Radio/Radio.js.map +1 -1
  5. package/build/lib/native/components/Radio/RadioGroup/RadioGroup.js.map +1 -1
  6. package/build/lib/native/components/Radio/RadioGroup/useRadioGroup.js +1 -1
  7. package/build/lib/native/components/Radio/RadioGroup/useRadioGroup.js.map +1 -1
  8. package/build/lib/native/components/Radio/useRadio.js.map +1 -1
  9. package/build/lib/native/utils/useControllable.js +1 -1
  10. package/build/lib/native/utils/useControllable.js.map +1 -1
  11. package/build/lib/web/development/components/BottomSheet/BottomSheet.web.js +17 -1
  12. package/build/lib/web/development/components/BottomSheet/BottomSheet.web.js.map +1 -1
  13. package/build/lib/web/development/components/Button/IconButton/IconButton.js +2 -2
  14. package/build/lib/web/development/components/Button/IconButton/IconButton.js.map +1 -1
  15. package/build/lib/web/development/components/Button/IconButton/StyledIconButton.web.js +7 -4
  16. package/build/lib/web/development/components/Button/IconButton/StyledIconButton.web.js.map +1 -1
  17. package/build/lib/web/development/components/ButtonGroup/ButtonGroup.web.js +7 -17
  18. package/build/lib/web/development/components/ButtonGroup/ButtonGroup.web.js.map +1 -1
  19. package/build/lib/web/development/components/Drawer/Drawer.web.js +6 -4
  20. package/build/lib/web/development/components/Drawer/Drawer.web.js.map +1 -1
  21. package/build/lib/web/development/components/Radio/Radio.js +3 -2
  22. package/build/lib/web/development/components/Radio/Radio.js.map +1 -1
  23. package/build/lib/web/development/components/Radio/RadioGroup/RadioGroup.js.map +1 -1
  24. package/build/lib/web/development/components/Radio/RadioGroup/useRadioGroup.js +7 -6
  25. package/build/lib/web/development/components/Radio/RadioGroup/useRadioGroup.js.map +1 -1
  26. package/build/lib/web/development/components/Radio/useRadio.js.map +1 -1
  27. package/build/lib/web/development/components/SideNav/SideNavItems/SideNavLink.web.js +14 -7
  28. package/build/lib/web/development/components/SideNav/SideNavItems/SideNavLink.web.js.map +1 -1
  29. package/build/lib/web/development/components/Tooltip/Tooltip.web.js +7 -1
  30. package/build/lib/web/development/components/Tooltip/Tooltip.web.js.map +1 -1
  31. package/build/lib/web/development/components/Tooltip/componentIds.js +6 -0
  32. package/build/lib/web/development/components/Tooltip/componentIds.js.map +1 -0
  33. package/build/lib/web/development/utils/useControllable.js +2 -1
  34. package/build/lib/web/development/utils/useControllable.js.map +1 -1
  35. package/build/lib/web/production/components/BottomSheet/BottomSheet.web.js +17 -1
  36. package/build/lib/web/production/components/BottomSheet/BottomSheet.web.js.map +1 -1
  37. package/build/lib/web/production/components/Button/IconButton/IconButton.js +2 -2
  38. package/build/lib/web/production/components/Button/IconButton/IconButton.js.map +1 -1
  39. package/build/lib/web/production/components/Button/IconButton/StyledIconButton.web.js +7 -4
  40. package/build/lib/web/production/components/Button/IconButton/StyledIconButton.web.js.map +1 -1
  41. package/build/lib/web/production/components/ButtonGroup/ButtonGroup.web.js +7 -17
  42. package/build/lib/web/production/components/ButtonGroup/ButtonGroup.web.js.map +1 -1
  43. package/build/lib/web/production/components/Drawer/Drawer.web.js +6 -4
  44. package/build/lib/web/production/components/Drawer/Drawer.web.js.map +1 -1
  45. package/build/lib/web/production/components/Radio/Radio.js +3 -2
  46. package/build/lib/web/production/components/Radio/Radio.js.map +1 -1
  47. package/build/lib/web/production/components/Radio/RadioGroup/RadioGroup.js.map +1 -1
  48. package/build/lib/web/production/components/Radio/RadioGroup/useRadioGroup.js +7 -6
  49. package/build/lib/web/production/components/Radio/RadioGroup/useRadioGroup.js.map +1 -1
  50. package/build/lib/web/production/components/Radio/useRadio.js.map +1 -1
  51. package/build/lib/web/production/components/SideNav/SideNavItems/SideNavLink.web.js +14 -7
  52. package/build/lib/web/production/components/SideNav/SideNavItems/SideNavLink.web.js.map +1 -1
  53. package/build/lib/web/production/components/Tooltip/Tooltip.web.js +7 -1
  54. package/build/lib/web/production/components/Tooltip/Tooltip.web.js.map +1 -1
  55. package/build/lib/web/production/components/Tooltip/componentIds.js +6 -0
  56. package/build/lib/web/production/components/Tooltip/componentIds.js.map +1 -0
  57. package/build/lib/web/production/utils/useControllable.js +2 -1
  58. package/build/lib/web/production/utils/useControllable.js.map +1 -1
  59. package/build/types/components/index.d.ts +1168 -45
  60. package/build/types/components/index.native.d.ts +345 -4
  61. package/package.json +1 -1
@@ -6,6 +6,7 @@ import React__default from 'react';
6
6
  import { TooltipContent } from './TooltipContent.js';
7
7
  import { ARROW_HEIGHT, ARROW_WIDTH } from './constants.js';
8
8
  import { TooltipContext } from './TooltipContext.js';
9
+ import { componentIds } from './componentIds.js';
9
10
  import '../BladeProvider/index.js';
10
11
  import '../Box/BaseBox/index.js';
11
12
  import '../../utils/metaAttribute/index.js';
@@ -17,6 +18,7 @@ import '../PopupArrow/index.js';
17
18
  import { getFloatingPlacementParts } from '../../utils/getFloatingPlacementParts.js';
18
19
  import { componentZIndices } from '../../utils/componentZIndices.js';
19
20
  import '../../utils/makeAnalyticsAttribute/index.js';
21
+ import '../../utils/assignWithoutSideEffects/index.js';
20
22
  import { jsxs, jsx } from 'react/jsx-runtime';
21
23
  import useTheme from '../BladeProvider/useTheme.js';
22
24
  import { size } from '../../tokens/global/size.js';
@@ -26,11 +28,12 @@ import { metaAttribute } from '../../utils/metaAttribute/metaAttribute.web.js';
26
28
  import { MetaConstants } from '../../utils/metaAttribute/metaConstants.js';
27
29
  import { makeAnalyticsAttribute } from '../../utils/makeAnalyticsAttribute/makeAnalyticsAttribute.js';
28
30
  import { PopupArrow } from '../PopupArrow/PopupArrow.web.js';
31
+ import { assignWithoutSideEffects } from '../../utils/assignWithoutSideEffects/assignWithoutSideEffects.js';
29
32
 
30
33
  var _excluded = ["title", "content", "children", "placement", "onOpenChange", "zIndex"];
31
34
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
32
35
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
33
- var Tooltip = function Tooltip(_ref) {
36
+ var _Tooltip = function _Tooltip(_ref) {
34
37
  var title = _ref.title,
35
38
  content = _ref.content,
36
39
  children = _ref.children,
@@ -136,6 +139,9 @@ var Tooltip = function Tooltip(_ref) {
136
139
  })]
137
140
  });
138
141
  };
142
+ var Tooltip = /*#__PURE__*/assignWithoutSideEffects(_Tooltip, {
143
+ componentId: componentIds.Tooltip
144
+ });
139
145
 
140
146
  export { Tooltip };
141
147
  //# sourceMappingURL=Tooltip.web.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.web.js","sources":["../../../../../../src/components/Tooltip/Tooltip.web.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/restrict-plus-operands */\nimport {\n shift,\n FloatingPortal,\n arrow,\n flip,\n offset,\n useDelayGroup,\n useDelayGroupContext,\n useFloating,\n useFocus,\n useHover,\n useInteractions,\n useRole,\n useTransitionStyles,\n autoUpdate,\n} from '@floating-ui/react';\nimport React from 'react';\nimport type { TooltipProps } from './types';\nimport { TooltipContent } from './TooltipContent';\nimport { ARROW_HEIGHT, ARROW_WIDTH } from './constants';\nimport { TooltipContext } from './TooltipContext';\nimport { useTheme } from '~components/BladeProvider';\nimport BaseBox from '~components/Box/BaseBox';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { size } from '~tokens/global';\nimport { useId } from '~utils/useId';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { mergeProps } from '~utils/mergeProps';\nimport { PopupArrow } from '~components/PopupArrow';\nimport { getFloatingPlacementParts } from '~utils/getFloatingPlacementParts';\nimport { componentZIndices } from '~utils/componentZIndices';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\n\nconst Tooltip = ({\n title,\n content,\n children,\n placement = 'top',\n onOpenChange,\n zIndex = componentZIndices.tooltip,\n ...rest\n}: TooltipProps): React.ReactElement => {\n const { theme } = useTheme();\n const id = useId();\n const [isOpen, setIsOpen] = React.useState(false);\n const arrowRef = React.useRef<SVGSVGElement>(null);\n\n const GAP = theme.spacing[2];\n const [side] = getFloatingPlacementParts(placement);\n const isHorizontal = side === 'left' || side === 'right';\n const isOppositeAxis = side === 'right' || side === 'bottom';\n\n const { refs, floatingStyles, context } = useFloating({\n placement,\n open: isOpen,\n strategy: 'fixed',\n onOpenChange: (open) => {\n setIsOpen(open);\n onOpenChange?.({ isOpen: open });\n },\n middleware: [\n shift({ crossAxis: false, padding: GAP }),\n flip({ padding: GAP }),\n offset(GAP + ARROW_HEIGHT),\n arrow({\n element: arrowRef,\n padding: isHorizontal ? 0 : ARROW_WIDTH,\n }),\n ],\n whileElementsMounted: autoUpdate,\n });\n\n const animationOffset = isOppositeAxis ? -size[4] : size[4];\n const { isMounted, styles } = useTransitionStyles(context, {\n duration: theme.motion.duration.quick,\n initial: {\n opacity: 0,\n transform: `translate${isHorizontal ? 'X' : 'Y'}(${animationOffset}px)`,\n },\n });\n\n useDelayGroup(context, { id });\n const { delay } = useDelayGroupContext();\n const hover = useHover(context, {\n delay,\n move: false,\n });\n const focus = useFocus(context);\n const role = useRole(context, { role: 'tooltip' });\n const { getReferenceProps, getFloatingProps } = useInteractions([role, hover, focus]);\n\n return (\n <TooltipContext.Provider value={true}>\n {React.cloneElement(children, {\n ref: refs.setReference,\n ...makeAccessible({ label: content }),\n ...mergeProps(children.props, getReferenceProps()),\n })}\n {isMounted && (\n <FloatingPortal>\n <BaseBox\n ref={refs.setFloating}\n style={floatingStyles}\n pointerEvents=\"none\"\n zIndex={zIndex}\n {...getFloatingProps()}\n {...metaAttribute({ name: MetaConstants.Tooltip })}\n {...makeAnalyticsAttribute(rest)}\n >\n <TooltipContent\n title={title}\n style={styles}\n arrow={\n <PopupArrow\n ref={arrowRef}\n context={context}\n width={ARROW_WIDTH}\n height={ARROW_HEIGHT}\n fillColor={theme.colors.popup.background.intense}\n strokeColor={theme.colors.popup.border.intense}\n />\n }\n >\n {content}\n </TooltipContent>\n </BaseBox>\n </FloatingPortal>\n )}\n </TooltipContext.Provider>\n );\n};\n\nexport { Tooltip };\n"],"names":["Tooltip","_ref","title","content","children","_ref$placement","placement","onOpenChange","_ref$zIndex","zIndex","componentZIndices","tooltip","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","id","useId","_React$useState","React","useState","_React$useState2","_slicedToArray","isOpen","setIsOpen","arrowRef","useRef","GAP","spacing","_getFloatingPlacement","getFloatingPlacementParts","_getFloatingPlacement2","side","isHorizontal","isOppositeAxis","_useFloating","useFloating","open","strategy","middleware","shift","crossAxis","padding","flip","offset","ARROW_HEIGHT","arrow","element","ARROW_WIDTH","whileElementsMounted","autoUpdate","refs","floatingStyles","context","animationOffset","size","_useTransitionStyles","useTransitionStyles","duration","motion","quick","initial","opacity","transform","concat","isMounted","styles","useDelayGroup","_useDelayGroupContext","useDelayGroupContext","delay","hover","useHover","move","focus","useFocus","role","useRole","_useInteractions","useInteractions","getReferenceProps","getFloatingProps","_jsxs","TooltipContext","Provider","value","cloneElement","_objectSpread","ref","setReference","makeAccessible","label","mergeProps","props","_jsx","FloatingPortal","BaseBox","setFloating","style","pointerEvents","metaAttribute","name","MetaConstants","makeAnalyticsAttribute","TooltipContent","PopupArrow","width","height","fillColor","colors","popup","background","intense","strokeColor","border"],"mappings":"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"}
1
+ {"version":3,"file":"Tooltip.web.js","sources":["../../../../../../src/components/Tooltip/Tooltip.web.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/restrict-plus-operands */\nimport {\n shift,\n FloatingPortal,\n arrow,\n flip,\n offset,\n useDelayGroup,\n useDelayGroupContext,\n useFloating,\n useFocus,\n useHover,\n useInteractions,\n useRole,\n useTransitionStyles,\n autoUpdate,\n} from '@floating-ui/react';\nimport React from 'react';\nimport type { TooltipProps } from './types';\nimport { TooltipContent } from './TooltipContent';\nimport { ARROW_HEIGHT, ARROW_WIDTH } from './constants';\nimport { TooltipContext } from './TooltipContext';\nimport { componentIds } from './componentIds';\nimport { useTheme } from '~components/BladeProvider';\nimport BaseBox from '~components/Box/BaseBox';\nimport { metaAttribute, MetaConstants } from '~utils/metaAttribute';\nimport { size } from '~tokens/global';\nimport { useId } from '~utils/useId';\nimport { makeAccessible } from '~utils/makeAccessible';\nimport { mergeProps } from '~utils/mergeProps';\nimport { PopupArrow } from '~components/PopupArrow';\nimport { getFloatingPlacementParts } from '~utils/getFloatingPlacementParts';\nimport { componentZIndices } from '~utils/componentZIndices';\nimport { makeAnalyticsAttribute } from '~utils/makeAnalyticsAttribute';\nimport { assignWithoutSideEffects } from '~utils/assignWithoutSideEffects';\n\nconst _Tooltip = ({\n title,\n content,\n children,\n placement = 'top',\n onOpenChange,\n zIndex = componentZIndices.tooltip,\n ...rest\n}: TooltipProps): React.ReactElement => {\n const { theme } = useTheme();\n const id = useId();\n const [isOpen, setIsOpen] = React.useState(false);\n const arrowRef = React.useRef<SVGSVGElement>(null);\n\n const GAP = theme.spacing[2];\n const [side] = getFloatingPlacementParts(placement);\n const isHorizontal = side === 'left' || side === 'right';\n const isOppositeAxis = side === 'right' || side === 'bottom';\n\n const { refs, floatingStyles, context } = useFloating({\n placement,\n open: isOpen,\n strategy: 'fixed',\n onOpenChange: (open) => {\n setIsOpen(open);\n onOpenChange?.({ isOpen: open });\n },\n middleware: [\n shift({ crossAxis: false, padding: GAP }),\n flip({ padding: GAP }),\n offset(GAP + ARROW_HEIGHT),\n arrow({\n element: arrowRef,\n padding: isHorizontal ? 0 : ARROW_WIDTH,\n }),\n ],\n whileElementsMounted: autoUpdate,\n });\n\n const animationOffset = isOppositeAxis ? -size[4] : size[4];\n const { isMounted, styles } = useTransitionStyles(context, {\n duration: theme.motion.duration.quick,\n initial: {\n opacity: 0,\n transform: `translate${isHorizontal ? 'X' : 'Y'}(${animationOffset}px)`,\n },\n });\n\n useDelayGroup(context, { id });\n const { delay } = useDelayGroupContext();\n const hover = useHover(context, {\n delay,\n move: false,\n });\n const focus = useFocus(context);\n const role = useRole(context, { role: 'tooltip' });\n const { getReferenceProps, getFloatingProps } = useInteractions([role, hover, focus]);\n\n return (\n <TooltipContext.Provider value={true}>\n {React.cloneElement(children, {\n ref: refs.setReference,\n ...makeAccessible({ label: content }),\n ...mergeProps(children.props, getReferenceProps()),\n })}\n {isMounted && (\n <FloatingPortal>\n <BaseBox\n ref={refs.setFloating}\n style={floatingStyles}\n pointerEvents=\"none\"\n zIndex={zIndex}\n {...getFloatingProps()}\n {...metaAttribute({ name: MetaConstants.Tooltip })}\n {...makeAnalyticsAttribute(rest)}\n >\n <TooltipContent\n title={title}\n style={styles}\n arrow={\n <PopupArrow\n ref={arrowRef}\n context={context}\n width={ARROW_WIDTH}\n height={ARROW_HEIGHT}\n fillColor={theme.colors.popup.background.intense}\n strokeColor={theme.colors.popup.border.intense}\n />\n }\n >\n {content}\n </TooltipContent>\n </BaseBox>\n </FloatingPortal>\n )}\n </TooltipContext.Provider>\n );\n};\n\nconst Tooltip = assignWithoutSideEffects(_Tooltip, {\n componentId: componentIds.Tooltip,\n});\n\nexport { Tooltip };\n"],"names":["_Tooltip","_ref","title","content","children","_ref$placement","placement","onOpenChange","_ref$zIndex","zIndex","componentZIndices","tooltip","rest","_objectWithoutProperties","_excluded","_useTheme","useTheme","theme","id","useId","_React$useState","React","useState","_React$useState2","_slicedToArray","isOpen","setIsOpen","arrowRef","useRef","GAP","spacing","_getFloatingPlacement","getFloatingPlacementParts","_getFloatingPlacement2","side","isHorizontal","isOppositeAxis","_useFloating","useFloating","open","strategy","middleware","shift","crossAxis","padding","flip","offset","ARROW_HEIGHT","arrow","element","ARROW_WIDTH","whileElementsMounted","autoUpdate","refs","floatingStyles","context","animationOffset","size","_useTransitionStyles","useTransitionStyles","duration","motion","quick","initial","opacity","transform","concat","isMounted","styles","useDelayGroup","_useDelayGroupContext","useDelayGroupContext","delay","hover","useHover","move","focus","useFocus","role","useRole","_useInteractions","useInteractions","getReferenceProps","getFloatingProps","_jsxs","TooltipContext","Provider","value","cloneElement","_objectSpread","ref","setReference","makeAccessible","label","mergeProps","props","_jsx","FloatingPortal","BaseBox","setFloating","style","pointerEvents","metaAttribute","name","MetaConstants","Tooltip","makeAnalyticsAttribute","TooltipContent","PopupArrow","width","height","fillColor","colors","popup","background","intense","strokeColor","border","assignWithoutSideEffects","componentId","componentIds"],"mappings":"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"}
@@ -0,0 +1,6 @@
1
+ var componentIds = {
2
+ Tooltip: 'Tooltip'
3
+ };
4
+
5
+ export { componentIds };
6
+ //# sourceMappingURL=componentIds.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"componentIds.js","sources":["../../../../../../src/components/Tooltip/componentIds.ts"],"sourcesContent":["const componentIds = {\n Tooltip: 'Tooltip',\n};\n\nexport { componentIds };\n"],"names":["componentIds","Tooltip"],"mappings":"AAAA,IAAMA,YAAY,GAAG;AACnBC,EAAAA,OAAO,EAAE,SAAA;AACX;;;;"}
@@ -31,12 +31,13 @@ function useControllableState(props) {
31
31
  var value = isControlled && typeof valueProp !== 'undefined' ? valueProp : valueState;
32
32
  var updateValue = useCallbackRef(function (next) {
33
33
  var skipUpdate = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
34
+ var extraData = arguments.length > 2 ? arguments[2] : undefined;
34
35
  var nextValue = next(value);
35
36
  if (!isControlled) setValue(nextValue);
36
37
  // We don't want to call onChange if skipUpdate is true or if the value is not changed
37
38
  if (!shouldUpdateProp(value, nextValue)) return;
38
39
  if (skipUpdate) return;
39
- onChangeProp === null || onChangeProp === void 0 ? void 0 : onChangeProp(nextValue);
40
+ onChangeProp === null || onChangeProp === void 0 ? void 0 : onChangeProp(nextValue, extraData);
40
41
  }, [isControlled, onChangeProp, value, shouldUpdateProp]);
41
42
  return [value, updateValue];
42
43
  }
@@ -1 +1 @@
1
- {"version":3,"file":"useControllable.js","sources":["../../../../../src/utils/useControllable.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/explicit-module-boundary-types */\n/* eslint-disable @typescript-eslint/explicit-function-return-type */\n/* eslint-disable react-hooks/exhaustive-deps */\nimport * as React from 'react';\nimport { useCallbackRef } from './useCallbackRef';\n\ntype ControllableStateSetter<T> = (\n /**\n * Sets the state to the given value\n */\n next: (prevState: T) => T,\n /**\n * If `true`, `onChange` won't be called\n */\n skipUpdate?: boolean,\n) => void;\n\ntype UseControllableStateProps<T> = {\n /**\n * The value to used in controlled mode\n */\n value?: T;\n /**\n * The initial value to be used, in uncontrolled mode\n */\n defaultValue?: T | (() => T);\n /**\n * The callback fired when the value changes\n */\n onChange?: (value: T) => void;\n shouldUpdate?: (prev: T, next: T) => boolean;\n};\n\n/**\n * React hook for using controlling component state.\n *\n * It automatically handles controlled and uncontrolled state,\n * while internally giving us the state value so that we can react to the changes.\n *\n * @example\n * In checkbox we want to internally track the checked state to be able to render the correct Icon\n * but also want to provide controlled and uncontrolled behavior to user\n */\nfunction useControllableState<T>(props: UseControllableStateProps<T>) {\n const {\n value: valueProp,\n defaultValue,\n onChange,\n shouldUpdate = (prev, next) => prev !== next,\n } = props;\n\n const onChangeProp = useCallbackRef(onChange);\n const shouldUpdateProp = useCallbackRef(shouldUpdate);\n\n const [valueState, setValue] = React.useState(defaultValue as T);\n const { current: isControlled } = React.useRef(valueProp !== undefined);\n const value = isControlled && typeof valueProp !== 'undefined' ? valueProp : valueState;\n\n const updateValue: ControllableStateSetter<T> = useCallbackRef(\n (next, skipUpdate = false) => {\n const nextValue = next(value);\n if (!isControlled) setValue(nextValue);\n // We don't want to call onChange if skipUpdate is true or if the value is not changed\n if (!shouldUpdateProp(value, nextValue)) return;\n if (skipUpdate) return;\n onChangeProp?.(nextValue);\n },\n [isControlled, onChangeProp, value, shouldUpdateProp],\n );\n\n return [value, updateValue] as [T, ControllableStateSetter<T>];\n}\n\nexport { useControllableState };\nexport type { ControllableStateSetter };\n"],"names":["useControllableState","props","valueProp","value","defaultValue","onChange","_props$shouldUpdate","shouldUpdate","prev","next","onChangeProp","useCallbackRef","shouldUpdateProp","_React$useState","React","useState","_React$useState2","_slicedToArray","valueState","setValue","_React$useRef","useRef","undefined","isControlled","current","updateValue","skipUpdate","arguments","length","nextValue"],"mappings":";;;;AAiCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,oBAAoBA,CAAIC,KAAmC,EAAE;AACpE,EAAA,IACSC,SAAS,GAIdD,KAAK,CAJPE,KAAK;IACLC,YAAY,GAGVH,KAAK,CAHPG,YAAY;IACZC,QAAQ,GAENJ,KAAK,CAFPI,QAAQ;IAAAC,mBAAA,GAENL,KAAK,CADPM,YAAY;AAAZA,IAAAA,YAAY,GAAAD,mBAAA,KAAA,KAAA,CAAA,GAAG,UAACE,IAAI,EAAEC,IAAI,EAAA;MAAA,OAAKD,IAAI,KAAKC,IAAI,CAAA;AAAA,KAAA,GAAAH,mBAAA,CAAA;AAG9C,EAAA,IAAMI,YAAY,GAAGC,cAAc,CAACN,QAAQ,CAAC,CAAA;AAC7C,EAAA,IAAMO,gBAAgB,GAAGD,cAAc,CAACJ,YAAY,CAAC,CAAA;AAErD,EAAA,IAAAM,eAAA,GAA+BC,KAAK,CAACC,QAAQ,CAACX,YAAiB,CAAC;IAAAY,gBAAA,GAAAC,cAAA,CAAAJ,eAAA,EAAA,CAAA,CAAA;AAAzDK,IAAAA,UAAU,GAAAF,gBAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,QAAQ,GAAAH,gBAAA,CAAA,CAAA,CAAA,CAAA;EAC3B,IAAAI,aAAA,GAAkCN,KAAK,CAACO,MAAM,CAACnB,SAAS,KAAKoB,SAAS,CAAC;IAAtDC,YAAY,GAAAH,aAAA,CAArBI,OAAO,CAAA;EACf,IAAMrB,KAAK,GAAGoB,YAAY,IAAI,OAAOrB,SAAS,KAAK,WAAW,GAAGA,SAAS,GAAGgB,UAAU,CAAA;AAEvF,EAAA,IAAMO,WAAuC,GAAGd,cAAc,CAC5D,UAACF,IAAI,EAAyB;AAAA,IAAA,IAAvBiB,UAAU,GAAAC,SAAA,CAAAC,MAAA,GAAA,CAAA,IAAAD,SAAA,CAAA,CAAA,CAAA,KAAAL,SAAA,GAAAK,SAAA,CAAA,CAAA,CAAA,GAAG,KAAK,CAAA;AACvB,IAAA,IAAME,SAAS,GAAGpB,IAAI,CAACN,KAAK,CAAC,CAAA;AAC7B,IAAA,IAAI,CAACoB,YAAY,EAAEJ,QAAQ,CAACU,SAAS,CAAC,CAAA;AACtC;AACA,IAAA,IAAI,CAACjB,gBAAgB,CAACT,KAAK,EAAE0B,SAAS,CAAC,EAAE,OAAA;AACzC,IAAA,IAAIH,UAAU,EAAE,OAAA;AAChBhB,IAAAA,YAAY,aAAZA,YAAY,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAZA,YAAY,CAAGmB,SAAS,CAAC,CAAA;GAC1B,EACD,CAACN,YAAY,EAAEb,YAAY,EAAEP,KAAK,EAAES,gBAAgB,CACtD,CAAC,CAAA;AAED,EAAA,OAAO,CAACT,KAAK,EAAEsB,WAAW,CAAC,CAAA;AAC7B;;;;"}
1
+ {"version":3,"file":"useControllable.js","sources":["../../../../../src/utils/useControllable.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n/* eslint-disable @typescript-eslint/explicit-module-boundary-types */\n/* eslint-disable @typescript-eslint/explicit-function-return-type */\n/* eslint-disable react-hooks/exhaustive-deps */\nimport * as React from 'react';\nimport { useCallbackRef } from './useCallbackRef';\n\ntype ControllableStateSetter<T> = (\n /**\n * Sets the state to the given value\n */\n next: (prevState: T) => T,\n /**\n * If `true`, `onChange` won't be called\n */\n skipUpdate?: boolean,\n /**\n * Extra data to be passed to `onChange` callback\n * Example use case: passing event object to `onChange` callback\n */\n extraData?: any,\n) => void;\n\ntype UseControllableStateProps<T> = {\n /**\n * The value to used in controlled mode\n */\n value?: T;\n /**\n * The initial value to be used, in uncontrolled mode\n */\n defaultValue?: T | (() => T);\n /**\n * The callback fired when the value changes\n */\n onChange?: (value: T, extraData: any) => void;\n shouldUpdate?: (prev: T, next: T) => boolean;\n};\n\n/**\n * React hook for using controlling component state.\n *\n * It automatically handles controlled and uncontrolled state,\n * while internally giving us the state value so that we can react to the changes.\n *\n * @example\n * In checkbox we want to internally track the checked state to be able to render the correct Icon\n * but also want to provide controlled and uncontrolled behavior to user\n */\nfunction useControllableState<T>(props: UseControllableStateProps<T>) {\n const {\n value: valueProp,\n defaultValue,\n onChange,\n shouldUpdate = (prev, next) => prev !== next,\n } = props;\n\n const onChangeProp = useCallbackRef(onChange);\n const shouldUpdateProp = useCallbackRef(shouldUpdate);\n\n const [valueState, setValue] = React.useState(defaultValue as T);\n const { current: isControlled } = React.useRef(valueProp !== undefined);\n const value = isControlled && typeof valueProp !== 'undefined' ? valueProp : valueState;\n\n const updateValue: ControllableStateSetter<T> = useCallbackRef(\n (next, skipUpdate = false, extraData) => {\n const nextValue = next(value);\n if (!isControlled) setValue(nextValue);\n // We don't want to call onChange if skipUpdate is true or if the value is not changed\n if (!shouldUpdateProp(value, nextValue)) return;\n if (skipUpdate) return;\n onChangeProp?.(nextValue, extraData);\n },\n [isControlled, onChangeProp, value, shouldUpdateProp],\n );\n\n return [value, updateValue] as [T, ControllableStateSetter<T>];\n}\n\nexport { useControllableState };\nexport type { ControllableStateSetter };\n"],"names":["useControllableState","props","valueProp","value","defaultValue","onChange","_props$shouldUpdate","shouldUpdate","prev","next","onChangeProp","useCallbackRef","shouldUpdateProp","_React$useState","React","useState","_React$useState2","_slicedToArray","valueState","setValue","_React$useRef","useRef","undefined","isControlled","current","updateValue","skipUpdate","arguments","length","extraData","nextValue"],"mappings":";;;;AAuCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,oBAAoBA,CAAIC,KAAmC,EAAE;AACpE,EAAA,IACSC,SAAS,GAIdD,KAAK,CAJPE,KAAK;IACLC,YAAY,GAGVH,KAAK,CAHPG,YAAY;IACZC,QAAQ,GAENJ,KAAK,CAFPI,QAAQ;IAAAC,mBAAA,GAENL,KAAK,CADPM,YAAY;AAAZA,IAAAA,YAAY,GAAAD,mBAAA,KAAA,KAAA,CAAA,GAAG,UAACE,IAAI,EAAEC,IAAI,EAAA;MAAA,OAAKD,IAAI,KAAKC,IAAI,CAAA;AAAA,KAAA,GAAAH,mBAAA,CAAA;AAG9C,EAAA,IAAMI,YAAY,GAAGC,cAAc,CAACN,QAAQ,CAAC,CAAA;AAC7C,EAAA,IAAMO,gBAAgB,GAAGD,cAAc,CAACJ,YAAY,CAAC,CAAA;AAErD,EAAA,IAAAM,eAAA,GAA+BC,KAAK,CAACC,QAAQ,CAACX,YAAiB,CAAC;IAAAY,gBAAA,GAAAC,cAAA,CAAAJ,eAAA,EAAA,CAAA,CAAA;AAAzDK,IAAAA,UAAU,GAAAF,gBAAA,CAAA,CAAA,CAAA;AAAEG,IAAAA,QAAQ,GAAAH,gBAAA,CAAA,CAAA,CAAA,CAAA;EAC3B,IAAAI,aAAA,GAAkCN,KAAK,CAACO,MAAM,CAACnB,SAAS,KAAKoB,SAAS,CAAC;IAAtDC,YAAY,GAAAH,aAAA,CAArBI,OAAO,CAAA;EACf,IAAMrB,KAAK,GAAGoB,YAAY,IAAI,OAAOrB,SAAS,KAAK,WAAW,GAAGA,SAAS,GAAGgB,UAAU,CAAA;AAEvF,EAAA,IAAMO,WAAuC,GAAGd,cAAc,CAC5D,UAACF,IAAI,EAAoC;AAAA,IAAA,IAAlCiB,UAAU,GAAAC,SAAA,CAAAC,MAAA,GAAA,CAAA,IAAAD,SAAA,CAAA,CAAA,CAAA,KAAAL,SAAA,GAAAK,SAAA,CAAA,CAAA,CAAA,GAAG,KAAK,CAAA;IAAA,IAAEE,SAAS,GAAAF,SAAA,CAAAC,MAAA,GAAAD,CAAAA,GAAAA,SAAA,MAAAL,SAAA,CAAA;AAClC,IAAA,IAAMQ,SAAS,GAAGrB,IAAI,CAACN,KAAK,CAAC,CAAA;AAC7B,IAAA,IAAI,CAACoB,YAAY,EAAEJ,QAAQ,CAACW,SAAS,CAAC,CAAA;AACtC;AACA,IAAA,IAAI,CAAClB,gBAAgB,CAACT,KAAK,EAAE2B,SAAS,CAAC,EAAE,OAAA;AACzC,IAAA,IAAIJ,UAAU,EAAE,OAAA;IAChBhB,YAAY,KAAA,IAAA,IAAZA,YAAY,KAAZA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,YAAY,CAAGoB,SAAS,EAAED,SAAS,CAAC,CAAA;GACrC,EACD,CAACN,YAAY,EAAEb,YAAY,EAAEP,KAAK,EAAES,gBAAgB,CACtD,CAAC,CAAA;AAED,EAAA,OAAO,CAACT,KAAK,EAAEsB,WAAW,CAAC,CAAA;AAC7B;;;;"}