@fluentui/react-utilities 9.0.0-alpha.9 → 9.0.0-beta.4

package/lib-commonjs/hooks/useControllableState.d.ts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+export declare type UseControllableStateOptions<State> = {
+    /**
+     * User provided default state or factory initializer
+     */
+    defaultState?: State | (() => State);
+    /**
+     * User provided controllable state, undefined state means internal state will be used
+     */
+    state: State | undefined;
+    /**
+     * Used to initialize state if all user provided states are undefined
+     */
+    initialState: State;
+};
+/**
+ * A useState 'like' hook that allows optional user control
+ * Useful for components which allow uncontrolled and controlled behaviour for users
+ * @returns - https://reactjs.org/docs/hooks-state.html
+ */
+export declare const useControllableState: <State>(options: UseControllableStateOptions<State>) => [State, React.Dispatch<React.SetStateAction<State>>];

package/lib-commonjs/hooks/useControllableState.js

@@ -0,0 +1,78 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useControllableState = void 0;
+
+const React = /*#__PURE__*/require("react");
+
+const useConst_1 = /*#__PURE__*/require("./useConst");
+
+function isUndefined(state) {
+  return typeof state === 'undefined';
+}
+
+function isFactoryDispatch(newState) {
+  return typeof newState === 'function';
+}
+/**
+ * A useState 'like' hook that allows optional user control
+ * Useful for components which allow uncontrolled and controlled behaviour for users
+ * @returns - https://reactjs.org/docs/hooks-state.html
+ */
+
+
+const useControllableState = options => {
+  const isControlled = useIsControlled(options.state);
+  const initialState = isUndefined(options.defaultState) ? options.initialState : options.defaultState;
+  const [internalState, setInternalState] = React.useState(initialState);
+  const state = isControlled ? options.state : internalState;
+  const stateRef = React.useRef(state);
+  React.useEffect(() => {
+    stateRef.current = state;
+  }, [state]); // To match the behavior of the setter returned by React.useState, this callback's identity
+  // should never change. This means it MUST NOT directly reference variables that can change.
+
+  const setState = React.useCallback(newState => {
+    // React dispatch can use a factory
+    // https://reactjs.org/docs/hooks-reference.html#functional-updates
+    if (isFactoryDispatch(newState)) {
+      stateRef.current = newState(stateRef.current);
+    } else {
+      stateRef.current = newState;
+    }
+
+    setInternalState(stateRef.current);
+  }, []);
+  return [state, setState];
+};
+
+exports.useControllableState = useControllableState;
+/**
+ * Helper hook to handle previous comparison of controlled/uncontrolled
+ * Prints an error when isControlled value switches between subsequent renders
+ * @returns - whether the value is controlled
+ */
+
+const useIsControlled = controlledValue => {
+  const isControlled = useConst_1.useConst(controlledValue !== undefined);
+
+  if (process.env.NODE_ENV !== 'production') {
+    // We don't want these warnings in production even though it is against native behaviour
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    React.useEffect(() => {
+      if (isControlled !== (controlledValue !== undefined)) {
+        const error = new Error();
+        const controlWarning = isControlled ? 'a controlled value to be uncontrolled' : 'an uncontrolled value to be controlled';
+        const undefinedWarning = isControlled ? 'defined to an undefined' : 'undefined to a defined'; // eslint-disable-next-line no-console
+
+        console.error([// Default react error
+        'A component is changing ' + controlWarning + '. This is likely caused by the value', 'changing from ' + undefinedWarning + ' value, which should not happen.', 'Decide between using a controlled or uncontrolled input element for the lifetime of the component.', 'More info: https://reactjs.org/link/controlled-components', error.stack].join(' '));
+      }
+    }, [isControlled, controlledValue]);
+  }
+
+  return isControlled;
+};
+//# sourceMappingURL=useControllableState.js.map

package/lib-commonjs/hooks/useControllableState.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/hooks/useControllableState.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,UAAA,gBAAA,OAAA,CAAA,YAAA,CAAA;;AAiBA,SAAS,WAAT,CAAqB,KAArB,EAAmC;AACjC,SAAO,OAAO,KAAP,KAAiB,WAAxB;AACD;;AAED,SAAS,iBAAT,CAAkC,QAAlC,EAAuE;AACrE,SAAO,OAAO,QAAP,KAAoB,UAA3B;AACD;AAED;;;;AAIG;;;AACI,MAAM,oBAAoB,GAC/B,OADkC,IAEsB;AACxD,QAAM,YAAY,GAAG,eAAe,CAAC,OAAO,CAAC,KAAT,CAApC;AACA,QAAM,YAAY,GAAG,WAAW,CAAC,OAAO,CAAC,YAAT,CAAX,GAAoC,OAAO,CAAC,YAA5C,GAA2D,OAAO,CAAC,YAAxF;AACA,QAAM,CAAC,aAAD,EAAgB,gBAAhB,IAAoC,KAAK,CAAC,QAAN,CAAsB,YAAtB,CAA1C;AAEA,QAAM,KAAK,GAAG,YAAY,GAAI,OAAO,CAAC,KAAZ,GAA8B,aAAxD;AAEA,QAAM,QAAQ,GAAG,KAAK,CAAC,MAAN,CAAa,KAAb,CAAjB;AACA,EAAA,KAAK,CAAC,SAAN,CAAgB,MAAK;AACnB,IAAA,QAAQ,CAAC,OAAT,GAAmB,KAAnB;AACD,GAFD,EAEG,CAAC,KAAD,CAFH,EARwD,CAYxD;AACA;;AACA,QAAM,QAAQ,GAAG,KAAK,CAAC,WAAN,CAAmB,QAAD,IAA0C;AAC3E;AACA;AACA,QAAI,iBAAiB,CAAC,QAAD,CAArB,EAAiC;AAC/B,MAAA,QAAQ,CAAC,OAAT,GAAmB,QAAQ,CAAC,QAAQ,CAAC,OAAV,CAA3B;AACD,KAFD,MAEO;AACL,MAAA,QAAQ,CAAC,OAAT,GAAmB,QAAnB;AACD;;AAED,IAAA,gBAAgB,CAAC,QAAQ,CAAC,OAAV,CAAhB;AACD,GAVgB,EAUd,EAVc,CAAjB;AAYA,SAAO,CAAC,KAAD,EAAQ,QAAR,CAAP;AACD,CA7BM;;AAAM,OAAA,CAAA,oBAAA,GAAoB,oBAApB;AA+Bb;;;;AAIG;;AACH,MAAM,eAAe,GAAI,eAAD,IAA6B;AACnD,QAAM,YAAY,GAAG,UAAA,CAAA,QAAA,CAAkB,eAAe,KAAK,SAAtC,CAArB;;AAEA,MAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAA7B,EAA2C;AACzC;AACA;AACA,IAAA,KAAK,CAAC,SAAN,CAAgB,MAAK;AACnB,UAAI,YAAY,MAAM,eAAe,KAAK,SAA1B,CAAhB,EAAsD;AACpD,cAAM,KAAK,GAAG,IAAI,KAAJ,EAAd;AAEA,cAAM,cAAc,GAAG,YAAY,GAC/B,uCAD+B,GAE/B,wCAFJ;AAIA,cAAM,gBAAgB,GAAG,YAAY,GAAG,yBAAH,GAA+B,wBAApE,CAPoD,CASpD;;AACA,QAAA,OAAO,CAAC,KAAR,CACE,CACE;AACA,qCAA6B,cAA7B,GAA8C,sCAFhD,EAGE,mBAAmB,gBAAnB,GAAsC,kCAHxC,EAIE,oGAJF,EAKE,2DALF,EAME,KAAK,CAAC,KANR,EAOE,IAPF,CAOO,GAPP,CADF;AAUD;AACF,KAtBD,EAsBG,CAAC,YAAD,EAAe,eAAf,CAtBH;AAuBD;;AAED,SAAO,YAAP;AACD,CAhCD","sourceRoot":""}

package/lib-commonjs/hooks/useControllableValue.js

@@ -1,63 +1,68 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var React = require("react");
-var useConst_1 = require("./useConst");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useControllableValue = void 0;
+
+const React = /*#__PURE__*/require("react");
+
+const useConst_1 = /*#__PURE__*/require("./useConst");
+
 function useControllableValue(controlledValue, defaultUncontrolledValue, onChange) {
-    var _a = React.useState(defaultUncontrolledValue), value = _a[0], setValue = _a[1];
-    var isControlled = useIsControlled(controlledValue);
-    var currentValue = isControlled ? controlledValue : value;
-    // Duplicate the current value and onChange in refs so they're accessible from
-    // setValueOrCallOnChange without creating a new callback every time
-    var valueRef = React.useRef(currentValue);
-    var onChangeRef = React.useRef(onChange);
-    React.useEffect(function () {
-        valueRef.current = currentValue;
-        onChangeRef.current = onChange;
-    });
-    // To match the behavior of the setter returned by React.useState, this callback's identity
-    // should never change. This means it MUST NOT directly reference variables that can change.
-    var setValueOrCallOnChange = useConst_1.useConst(function () { return function (update, ev) {
-        // Assuming here that TValue is not a function, because a controllable value will typically
-        // be something a user can enter as input
-        var newValue = typeof update === 'function' ? update(valueRef.current) : update;
-        if (onChangeRef.current) {
-            onChangeRef.current(ev, newValue);
-        }
-        if (!isControlled) {
-            setValue(newValue);
-        }
-    }; });
-    return [currentValue, setValueOrCallOnChange];
+  const [value, setValue] = React.useState(defaultUncontrolledValue);
+  const isControlled = useIsControlled(controlledValue);
+  const currentValue = isControlled ? controlledValue : value; // Duplicate the current value and onChange in refs so they're accessible from
+  // setValueOrCallOnChange without creating a new callback every time
+
+  const valueRef = React.useRef(currentValue);
+  const onChangeRef = React.useRef(onChange);
+  React.useEffect(() => {
+    valueRef.current = currentValue;
+    onChangeRef.current = onChange;
+  }); // To match the behavior of the setter returned by React.useState, this callback's identity
+  // should never change. This means it MUST NOT directly reference variables that can change.
+
+  const setValueOrCallOnChange = useConst_1.useConst(() => (update, ev) => {
+    // Assuming here that TValue is not a function, because a controllable value will typically
+    // be something a user can enter as input
+    const newValue = typeof update === 'function' ? update(valueRef.current) : update;
+
+    if (onChangeRef.current) {
+      onChangeRef.current(ev, newValue);
+    }
+
+    if (!isControlled) {
+      setValue(newValue);
+    }
+  });
+  return [currentValue, setValueOrCallOnChange];
 }
+
 exports.useControllableValue = useControllableValue;
 /**
  * Helper hook to handle previous comparison of controlled/uncontrolled
  * Prints an error when isControlled value switches between subsequent renders
  */
-var useIsControlled = function (controlledValue) {
-    var isControlled = useConst_1.useConst(controlledValue !== undefined);
-    if (process.env.NODE_ENV !== 'production') {
-        // We don't want these warnings in production even though it is against native behaviour
-        // eslint-disable-next-line react-hooks/rules-of-hooks
-        React.useEffect(function () {
-            if (isControlled !== (controlledValue !== undefined)) {
-                var error = new Error();
-                var controlWarning = isControlled
-                    ? 'a controlled value to be uncontrolled'
-                    : 'an uncontrolled value to be controlled';
-                var undefinedWarning = isControlled ? 'defined to an undefined' : 'undefined to a defined';
-                // eslint-disable-next-line no-console
-                console.error([
-                    // Default react error
-                    'A component is changing ' + controlWarning + '. This is likely caused by the value',
-                    'changing from ' + undefinedWarning + ' value, which should not happen.',
-                    'Decide between using a controlled or uncontrolled input element for the lifetime of the component.',
-                    'More info: https://reactjs.org/link/controlled-components',
-                    error.stack,
-                ].join(' '));
-            }
-        }, [isControlled, controlledValue]);
-    }
-    return isControlled;
+
+const useIsControlled = controlledValue => {
+  const isControlled = useConst_1.useConst(controlledValue !== undefined);
+
+  if (process.env.NODE_ENV !== 'production') {
+    // We don't want these warnings in production even though it is against native behaviour
+    // eslint-disable-next-line react-hooks/rules-of-hooks
+    React.useEffect(() => {
+      if (isControlled !== (controlledValue !== undefined)) {
+        const error = new Error();
+        const controlWarning = isControlled ? 'a controlled value to be uncontrolled' : 'an uncontrolled value to be controlled';
+        const undefinedWarning = isControlled ? 'defined to an undefined' : 'undefined to a defined'; // eslint-disable-next-line no-console
+
+        console.error([// Default react error
+        'A component is changing ' + controlWarning + '. This is likely caused by the value', 'changing from ' + undefinedWarning + ' value, which should not happen.', 'Decide between using a controlled or uncontrolled input element for the lifetime of the component.', 'More info: https://reactjs.org/link/controlled-components', error.stack].join(' '));
+      }
+    }, [isControlled, controlledValue]);
+  }
+
+  return isControlled;
 };
 //# sourceMappingURL=useControllableValue.js.map

package/lib-commonjs/hooks/useControllableValue.js.map

@@ -1 +1 @@
-{"version":3,"file":"useControllableValue.js","sourceRoot":"../src/","sources":["hooks/useControllableValue.ts"],"names":[],"mappings":";;AAAA,6BAA+B;AAC/B,uCAAsC;AAqCtC,SAAgB,oBAAoB,CAKlC,eAAuB,EACvB,wBAA8C,EAC9C,QAAmD;IAE7C,IAAA,6CAAgF,EAA/E,aAAK,EAAE,gBAAwE,CAAC;IACvF,IAAM,YAAY,GAAG,eAAe,CAAC,eAAe,CAAC,CAAC;IACtD,IAAM,YAAY,GAAG,YAAY,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,KAAK,CAAC;IAE5D,8EAA8E;IAC9E,oEAAoE;IACpE,IAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;IAC5C,IAAM,WAAW,GAAG,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;IAC3C,KAAK,CAAC,SAAS,CAAC;QACd,QAAQ,CAAC,OAAO,GAAG,YAAY,CAAC;QAChC,WAAW,CAAC,OAAO,GAAG,QAAQ,CAAC;IACjC,CAAC,CAAC,CAAC;IAEH,2FAA2F;IAC3F,4FAA4F;IAC5F,IAAM,sBAAsB,GAAG,mBAAQ,CAAC,cAAM,OAAA,UAAC,MAAgD,EAAE,EAAW;QAC1G,2FAA2F;QAC3F,yCAAyC;QACzC,IAAM,QAAQ,GAAG,OAAO,MAAM,KAAK,UAAU,CAAC,CAAC,CAAE,MAAmB,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC;QAEhG,IAAI,WAAW,CAAC,OAAO,EAAE;YACvB,WAAW,CAAC,OAAO,CAAC,EAAG,EAAE,QAAQ,CAAC,CAAC;SACpC;QAED,IAAI,CAAC,YAAY,EAAE;YACjB,QAAQ,CAAC,QAAQ,CAAC,CAAC;SACpB;IACH,CAAC,EAZ6C,CAY7C,CAAC,CAAC;IAEH,OAAO,CAAC,YAAY,EAAE,sBAAsB,CAAU,CAAC;AACzD,CAAC;AAvCD,oDAuCC;AAED;;;GAGG;AACH,IAAM,eAAe,GAAG,UAAS,eAAuB;IACtD,IAAM,YAAY,GAAG,mBAAQ,CAAU,eAAe,KAAK,SAAS,CAAC,CAAC;IAEtE,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,KAAK,YAAY,EAAE;QACzC,wFAAwF;QACxF,sDAAsD;QACtD,KAAK,CAAC,SAAS,CAAC;YACd,IAAI,YAAY,KAAK,CAAC,eAAe,KAAK,SAAS,CAAC,EAAE;gBACpD,IAAM,KAAK,GAAG,IAAI,KAAK,EAAE,CAAC;gBAE1B,IAAM,cAAc,GAAG,YAAY;oBACjC,CAAC,CAAC,uCAAuC;oBACzC,CAAC,CAAC,wCAAwC,CAAC;gBAE7C,IAAM,gBAAgB,GAAG,YAAY,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,wBAAwB,CAAC;gBAE7F,sCAAsC;gBACtC,OAAO,CAAC,KAAK,CACX;oBACE,sBAAsB;oBACtB,0BAA0B,GAAG,cAAc,GAAG,sCAAsC;oBACpF,gBAAgB,GAAG,gBAAgB,GAAG,kCAAkC;oBACxE,oGAAoG;oBACpG,2DAA2D;oBAC3D,KAAK,CAAC,KAAK;iBACZ,CAAC,IAAI,CAAC,GAAG,CAAC,CACZ,CAAC;aACH;QACH,CAAC,EAAE,CAAC,YAAY,EAAE,eAAe,CAAC,CAAC,CAAC;KACrC;IAED,OAAO,YAAY,CAAC;AACtB,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport { useConst } from './useConst';\n\nexport type ChangeCallback<\n  TElement extends HTMLElement,\n  TValue,\n  TEvent extends React.SyntheticEvent<TElement> | undefined\n> = (ev: TEvent, newValue: TValue | undefined) => void;\n\n/**\n * Default value can be a value or an initializer\n */\ntype DefaultValue<TValue> = TValue | (() => TValue);\n\n/**\n * Hook to manage a value that could be either controlled or uncontrolled, such as a checked state or\n * text box string.\n * @param controlledValue - The controlled value passed in the props. This value will always be used if provided,\n * and the internal state will be updated to reflect it.\n * @param defaultUncontrolledValue - Initial value for the internal state in the uncontrolled case.\n * @returns An array of the current value and an updater callback. Like `React.useState`, the updater\n * callback always has the same identity, and it can take either a new value, or a function which\n * is passed the previous value and returns the new value.\n * @see https://reactjs.org/docs/uncontrolled-components.html\n */\nexport function useControllableValue<TValue, TElement extends HTMLElement>(\n  controlledValue: TValue,\n  defaultUncontrolledValue: DefaultValue<TValue>,\n): Readonly<[TValue, (update: React.SetStateAction<TValue>) => void]>;\nexport function useControllableValue<\n  TValue,\n  TElement extends HTMLElement,\n  TEvent extends React.SyntheticEvent<TElement> | undefined\n>(\n  controlledValue: TValue,\n  defaultUncontrolledValue: DefaultValue<TValue>,\n  onChange: ChangeCallback<TElement, TValue, TEvent>,\n): Readonly<[TValue, (update: React.SetStateAction<TValue>, ev?: React.FormEvent<TElement>) => void]>;\nexport function useControllableValue<\n  TValue,\n  TElement extends HTMLElement,\n  TEvent extends React.SyntheticEvent<TElement> | undefined\n>(\n  controlledValue: TValue,\n  defaultUncontrolledValue: DefaultValue<TValue>,\n  onChange?: ChangeCallback<TElement, TValue, TEvent>,\n) {\n  const [value, setValue] = React.useState<TValue | undefined>(defaultUncontrolledValue);\n  const isControlled = useIsControlled(controlledValue);\n  const currentValue = isControlled ? controlledValue : value;\n\n  // Duplicate the current value and onChange in refs so they're accessible from\n  // setValueOrCallOnChange without creating a new callback every time\n  const valueRef = React.useRef(currentValue);\n  const onChangeRef = React.useRef(onChange);\n  React.useEffect(() => {\n    valueRef.current = currentValue;\n    onChangeRef.current = onChange;\n  });\n\n  // To match the behavior of the setter returned by React.useState, this callback's identity\n  // should never change. This means it MUST NOT directly reference variables that can change.\n  const setValueOrCallOnChange = useConst(() => (update: React.SetStateAction<TValue | undefined>, ev?: TEvent) => {\n    // Assuming here that TValue is not a function, because a controllable value will typically\n    // be something a user can enter as input\n    const newValue = typeof update === 'function' ? (update as Function)(valueRef.current) : update;\n\n    if (onChangeRef.current) {\n      onChangeRef.current(ev!, newValue);\n    }\n\n    if (!isControlled) {\n      setValue(newValue);\n    }\n  });\n\n  return [currentValue, setValueOrCallOnChange] as const;\n}\n\n/**\n * Helper hook to handle previous comparison of controlled/uncontrolled\n * Prints an error when isControlled value switches between subsequent renders\n */\nconst useIsControlled = <TValue>(controlledValue: TValue) => {\n  const isControlled = useConst<boolean>(controlledValue !== undefined);\n\n  if (process.env.NODE_ENV !== 'production') {\n    // We don't want these warnings in production even though it is against native behaviour\n    // eslint-disable-next-line react-hooks/rules-of-hooks\n    React.useEffect(() => {\n      if (isControlled !== (controlledValue !== undefined)) {\n        const error = new Error();\n\n        const controlWarning = isControlled\n          ? 'a controlled value to be uncontrolled'\n          : 'an uncontrolled value to be controlled';\n\n        const undefinedWarning = isControlled ? 'defined to an undefined' : 'undefined to a defined';\n\n        // eslint-disable-next-line no-console\n        console.error(\n          [\n            // Default react error\n            'A component is changing ' + controlWarning + '. This is likely caused by the value',\n            'changing from ' + undefinedWarning + ' value, which should not happen.',\n            'Decide between using a controlled or uncontrolled input element for the lifetime of the component.',\n            'More info: https://reactjs.org/link/controlled-components',\n            error.stack,\n          ].join(' '),\n        );\n      }\n    }, [isControlled, controlledValue]);\n  }\n\n  return isControlled;\n};\n"]}
+{"version":3,"sources":["../../src/hooks/useControllableValue.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,UAAA,gBAAA,OAAA,CAAA,YAAA,CAAA;;AAqCA,SAAgB,oBAAhB,CAKE,eALF,EAME,wBANF,EAOE,QAPF,EAOqD;AAEnD,QAAM,CAAC,KAAD,EAAQ,QAAR,IAAoB,KAAK,CAAC,QAAN,CAAmC,wBAAnC,CAA1B;AACA,QAAM,YAAY,GAAG,eAAe,CAAC,eAAD,CAApC;AACA,QAAM,YAAY,GAAG,YAAY,GAAG,eAAH,GAAqB,KAAtD,CAJmD,CAMnD;AACA;;AACA,QAAM,QAAQ,GAAG,KAAK,CAAC,MAAN,CAAa,YAAb,CAAjB;AACA,QAAM,WAAW,GAAG,KAAK,CAAC,MAAN,CAAa,QAAb,CAApB;AACA,EAAA,KAAK,CAAC,SAAN,CAAgB,MAAK;AACnB,IAAA,QAAQ,CAAC,OAAT,GAAmB,YAAnB;AACA,IAAA,WAAW,CAAC,OAAZ,GAAsB,QAAtB;AACD,GAHD,EAVmD,CAenD;AACA;;AACA,QAAM,sBAAsB,GAAG,UAAA,CAAA,QAAA,CAAS,MAAM,CAAC,MAAD,EAAmD,EAAnD,KAAkE;AAC9G;AACA;AACA,UAAM,QAAQ,GAAG,OAAO,MAAP,KAAkB,UAAlB,GAAgC,MAAmB,CAAC,QAAQ,CAAC,OAAV,CAAnD,GAAwE,MAAzF;;AAEA,QAAI,WAAW,CAAC,OAAhB,EAAyB;AACvB,MAAA,WAAW,CAAC,OAAZ,CAAoB,EAApB,EAAyB,QAAzB;AACD;;AAED,QAAI,CAAC,YAAL,EAAmB;AACjB,MAAA,QAAQ,CAAC,QAAD,CAAR;AACD;AACF,GAZ8B,CAA/B;AAcA,SAAO,CAAC,YAAD,EAAe,sBAAf,CAAP;AACD;;AAvCD,OAAA,CAAA,oBAAA,GAAA,oBAAA;AAyCA;;;AAGG;;AACH,MAAM,eAAe,GAAY,eAAT,IAAoC;AAC1D,QAAM,YAAY,GAAG,UAAA,CAAA,QAAA,CAAkB,eAAe,KAAK,SAAtC,CAArB;;AAEA,MAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAA7B,EAA2C;AACzC;AACA;AACA,IAAA,KAAK,CAAC,SAAN,CAAgB,MAAK;AACnB,UAAI,YAAY,MAAM,eAAe,KAAK,SAA1B,CAAhB,EAAsD;AACpD,cAAM,KAAK,GAAG,IAAI,KAAJ,EAAd;AAEA,cAAM,cAAc,GAAG,YAAY,GAC/B,uCAD+B,GAE/B,wCAFJ;AAIA,cAAM,gBAAgB,GAAG,YAAY,GAAG,yBAAH,GAA+B,wBAApE,CAPoD,CASpD;;AACA,QAAA,OAAO,CAAC,KAAR,CACE,CACE;AACA,qCAA6B,cAA7B,GAA8C,sCAFhD,EAGE,mBAAmB,gBAAnB,GAAsC,kCAHxC,EAIE,oGAJF,EAKE,2DALF,EAME,KAAK,CAAC,KANR,EAOE,IAPF,CAOO,GAPP,CADF;AAUD;AACF,KAtBD,EAsBG,CAAC,YAAD,EAAe,eAAf,CAtBH;AAuBD;;AAED,SAAO,YAAP;AACD,CAhCD","sourceRoot":""}

package/lib-commonjs/hooks/useEventCallback.d.ts

@@ -2,11 +2,11 @@
  * https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback
  *
  * Modified `useCallback` that can be used when dependencies change too frequently. Can occur when
- * e.g. user props are depedencies which could change on every render
+ * e.g. user props are dependencies which could change on every render
  * e.g. volatile values (i.e. useState/useDispatch) are dependencies which could change frequently
  *
  * This should not be used often, but can be a useful re-render optimization since the callback is a ref and
- * will not be invalidated between rerenders
+ * will not be invalidated between re-renders
  *
  * @param fn - The callback function that will be used
  */

package/lib-commonjs/hooks/useEventCallback.js

@@ -1,33 +1,39 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var React = require("react");
-var useIsomorphicLayoutEffect_1 = require("./useIsomorphicLayoutEffect");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useEventCallback = void 0;
+
+const React = /*#__PURE__*/require("react");
+
+const useIsomorphicLayoutEffect_1 = /*#__PURE__*/require("./useIsomorphicLayoutEffect");
 /**
  * https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback
  *
  * Modified `useCallback` that can be used when dependencies change too frequently. Can occur when
- * e.g. user props are depedencies which could change on every render
+ * e.g. user props are dependencies which could change on every render
  * e.g. volatile values (i.e. useState/useDispatch) are dependencies which could change frequently
  *
  * This should not be used often, but can be a useful re-render optimization since the callback is a ref and
- * will not be invalidated between rerenders
+ * will not be invalidated between re-renders
  *
  * @param fn - The callback function that will be used
  */
-exports.useEventCallback = function (fn) {
-    var callbackRef = React.useRef(function () {
-        throw new Error('Cannot call an event handler while rendering');
-    });
-    useIsomorphicLayoutEffect_1.useIsomorphicLayoutEffect(function () {
-        callbackRef.current = fn;
-    }, [fn]);
-    return React.useCallback(function () {
-        var args = [];
-        for (var _i = 0; _i < arguments.length; _i++) {
-            args[_i] = arguments[_i];
-        }
-        var callback = callbackRef.current;
-        return callback.apply(void 0, args);
-    }, [callbackRef]);
+
+
+const useEventCallback = fn => {
+  const callbackRef = React.useRef(() => {
+    throw new Error('Cannot call an event handler while rendering');
+  });
+  useIsomorphicLayoutEffect_1.useIsomorphicLayoutEffect(() => {
+    callbackRef.current = fn;
+  }, [fn]);
+  return React.useCallback((...args) => {
+    const callback = callbackRef.current;
+    return callback(...args);
+  }, [callbackRef]);
 };
+
+exports.useEventCallback = useEventCallback;
 //# sourceMappingURL=useEventCallback.js.map

package/lib-commonjs/hooks/useEventCallback.js.map

@@ -1 +1 @@
-{"version":3,"file":"useEventCallback.js","sourceRoot":"../src/","sources":["hooks/useEventCallback.ts"],"names":[],"mappings":";;AAAA,6BAA+B;AAC/B,yEAAwE;AAExE;;;;;;;;;;;GAWG;AACU,QAAA,gBAAgB,GAAG,UAAiC,EAA6B;IAC5F,IAAM,WAAW,GAAG,KAAK,CAAC,MAAM,CAAY;QAC1C,MAAM,IAAI,KAAK,CAAC,8CAA8C,CAAC,CAAC;IAClE,CAAC,CAAC,CAAC;IAEH,qDAAyB,CAAC;QACxB,WAAW,CAAC,OAAO,GAAG,EAAE,CAAC;IAC3B,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAET,OAAO,KAAK,CAAC,WAAW,CACtB;QAAC,cAAa;aAAb,UAAa,EAAb,qBAAa,EAAb,IAAa;YAAb,yBAAa;;QACZ,IAAM,QAAQ,GAAG,WAAW,CAAC,OAAO,CAAC;QACrC,OAAO,QAAQ,eAAI,IAAI,EAAE;IAC3B,CAAC,EACD,CAAC,WAAW,CAAC,CACd,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import * as React from 'react';\nimport { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect';\n\n/**\n * https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback\n *\n * Modified `useCallback` that can be used when dependencies change too frequently. Can occur when\n * e.g. user props are depedencies which could change on every render\n * e.g. volatile values (i.e. useState/useDispatch) are dependencies which could change frequently\n *\n * This should not be used often, but can be a useful re-render optimization since the callback is a ref and\n * will not be invalidated between rerenders\n *\n * @param fn - The callback function that will be used\n */\nexport const useEventCallback = <Args extends unknown[], Return>(fn: (...args: Args) => Return) => {\n  const callbackRef = React.useRef<typeof fn>(() => {\n    throw new Error('Cannot call an event handler while rendering');\n  });\n\n  useIsomorphicLayoutEffect(() => {\n    callbackRef.current = fn;\n  }, [fn]);\n\n  return React.useCallback(\n    (...args: Args) => {\n      const callback = callbackRef.current;\n      return callback(...args);\n    },\n    [callbackRef],\n  );\n};\n"]}
+{"version":3,"sources":["../../src/hooks/useEventCallback.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,2BAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;AAEA;;;;;;;;;;;AAWG;;;AACI,MAAM,gBAAgB,GAAoC,EAAjC,IAAkE;AAChG,QAAM,WAAW,GAAG,KAAK,CAAC,MAAN,CAAwB,MAAK;AAC/C,UAAM,IAAI,KAAJ,CAAU,8CAAV,CAAN;AACD,GAFmB,CAApB;AAIA,EAAA,2BAAA,CAAA,yBAAA,CAA0B,MAAK;AAC7B,IAAA,WAAW,CAAC,OAAZ,GAAsB,EAAtB;AACD,GAFD,EAEG,CAAC,EAAD,CAFH;AAIA,SAAO,KAAK,CAAC,WAAN,CACL,CAAC,GAAG,IAAJ,KAAkB;AAChB,UAAM,QAAQ,GAAG,WAAW,CAAC,OAA7B;AACA,WAAO,QAAQ,CAAC,GAAG,IAAJ,CAAf;AACD,GAJI,EAKL,CAAC,WAAD,CALK,CAAP;AAOD,CAhBM;;AAAM,OAAA,CAAA,gBAAA,GAAgB,gBAAhB","sourceRoot":""}

package/lib-commonjs/hooks/useFirstMount.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Checks if components was mounted the first time.
+ * Since concurrent mode will be released in the future this needs to be verified
+ * Currently (React 17) will always render the initial mount once
+ * https://codesandbox.io/s/heuristic-brook-s4w0q?file=/src/App.jsx
+ * https://codesandbox.io/s/holy-grass-8nieu?file=/src/App.jsx
+ *
+ * @example
+ * const isFirstMount = useFirstMount();
+ */
+export declare function useFirstMount(): boolean;

package/lib-commonjs/hooks/useFirstMount.js

@@ -0,0 +1,33 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useFirstMount = void 0;
+
+const React = /*#__PURE__*/require("react");
+/**
+ * Checks if components was mounted the first time.
+ * Since concurrent mode will be released in the future this needs to be verified
+ * Currently (React 17) will always render the initial mount once
+ * https://codesandbox.io/s/heuristic-brook-s4w0q?file=/src/App.jsx
+ * https://codesandbox.io/s/holy-grass-8nieu?file=/src/App.jsx
+ *
+ * @example
+ * const isFirstMount = useFirstMount();
+ */
+
+
+function useFirstMount() {
+  const isFirst = React.useRef(true);
+
+  if (isFirst.current) {
+    isFirst.current = false;
+    return true;
+  }
+
+  return isFirst.current;
+}
+
+exports.useFirstMount = useFirstMount;
+//# sourceMappingURL=useFirstMount.js.map

package/lib-commonjs/hooks/useFirstMount.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/hooks/useFirstMount.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;AAEA;;;;;;;;;AASG;;;AACH,SAAgB,aAAhB,GAA6B;AAC3B,QAAM,OAAO,GAAG,KAAK,CAAC,MAAN,CAAa,IAAb,CAAhB;;AAEA,MAAI,OAAO,CAAC,OAAZ,EAAqB;AACnB,IAAA,OAAO,CAAC,OAAR,GAAkB,KAAlB;AACA,WAAO,IAAP;AACD;;AAED,SAAO,OAAO,CAAC,OAAf;AACD;;AATD,OAAA,CAAA,aAAA,GAAA,aAAA","sourceRoot":""}

package/lib-commonjs/hooks/useForceUpdate.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Forces a re-render, similar to `forceUpdate` in class components.
+ */
+export declare function useForceUpdate(): import("react").DispatchWithoutAction;

package/lib-commonjs/hooks/useForceUpdate.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useForceUpdate = void 0;
+
+const react_1 = /*#__PURE__*/require("react");
+/**
+ * Forces a re-render, similar to `forceUpdate` in class components.
+ */
+
+
+function useForceUpdate() {
+  return react_1.useReducer(x => x + 1, 0)[1];
+}
+
+exports.useForceUpdate = useForceUpdate;
+//# sourceMappingURL=useForceUpdate.js.map

package/lib-commonjs/hooks/useForceUpdate.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/hooks/useForceUpdate.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;AAEA;;AAEG;;;AACH,SAAgB,cAAhB,GAA8B;AAC5B,SAAO,OAAA,CAAA,UAAA,CAAW,CAAC,IAAI,CAAC,GAAG,CAApB,EAAuB,CAAvB,EAA0B,CAA1B,CAAP;AACD;;AAFD,OAAA,CAAA,cAAA,GAAA,cAAA","sourceRoot":""}

package/lib-commonjs/hooks/useId.d.ts

@@ -1,7 +1,11 @@
-export declare function getId(prefix?: string): string;
-export declare function resetIds(): void;
 /**
- * Hook to generate a unique ID in the global scope (spanning across duplicate copies of the same library).
+ * Resets generated IDs, should be used only in tests.
+ *
+ * @private
+ */
+export declare function resetIdsForTests(): void;
+/**
+ * Hook to generate a unique ID.
  *
  * @param prefix - Optional prefix for the ID
  * @param providedId - Optional id provided by a parent component. Defaults to the provided value if present,

package/lib-commonjs/hooks/useId.js

@@ -1,34 +1,38 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var React = require("react");
-// TODO
-// getId() is a temporary approach, useId() should be reimplemented to properly support SSR & scenarios with
-// different globals (document, window)
-var id = 0;
-function getId(prefix) {
-    return (prefix || '') + id++;
-}
-exports.getId = getId;
-function resetIds() {
-    id = 0;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useId = exports.resetIdsForTests = void 0;
+
+const React = /*#__PURE__*/require("react");
+
+const index_1 = /*#__PURE__*/require("../ssr/index");
+/**
+ * Resets generated IDs, should be used only in tests.
+ *
+ * @private
+ */
+
+
+function resetIdsForTests() {
+  index_1.defaultSSRContextValue.current = 0;
 }
-exports.resetIds = resetIds;
+
+exports.resetIdsForTests = resetIdsForTests;
 /**
- * Hook to generate a unique ID in the global scope (spanning across duplicate copies of the same library).
+ * Hook to generate a unique ID.
  *
  * @param prefix - Optional prefix for the ID
  * @param providedId - Optional id provided by a parent component. Defaults to the provided value if present,
  *  without conditioning the hook call
  * @returns The ID
  */
+
 function useId(prefix, providedId) {
-    // getId should only be called once since it updates the global constant for the next ID value.
-    // (While an extra update isn't likely to cause problems in practice, it's better to avoid it.)
-    var ref = React.useRef(providedId);
-    if (!ref.current) {
-        ref.current = getId(prefix);
-    }
-    return ref.current;
+  const contextValue = index_1.useSSRContext();
+  return React.useMemo(() => providedId || `${prefix}${++contextValue.current}`, [prefix, providedId, contextValue]);
 }
+
 exports.useId = useId;
 //# sourceMappingURL=useId.js.map

package/lib-commonjs/hooks/useId.js.map

@@ -1 +1 @@
-{"version":3,"file":"useId.js","sourceRoot":"../src/","sources":["hooks/useId.ts"],"names":[],"mappings":";;AAAA,6BAA+B;AAC/B,OAAO;AACP,4GAA4G;AAC5G,uCAAuC;AACvC,IAAI,EAAE,GAAG,CAAC,CAAC;AAEX,SAAgB,KAAK,CAAC,MAAe;IACnC,OAAO,CAAC,MAAM,IAAI,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC;AAC/B,CAAC;AAFD,sBAEC;AAED,SAAgB,QAAQ;IACtB,EAAE,GAAG,CAAC,CAAC;AACT,CAAC;AAFD,4BAEC;AAED;;;;;;;GAOG;AACH,SAAgB,KAAK,CAAC,MAAe,EAAE,UAAmB;IACxD,+FAA+F;IAC/F,+FAA+F;IAC/F,IAAM,GAAG,GAAG,KAAK,CAAC,MAAM,CAAqB,UAAU,CAAC,CAAC;IACzD,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE;QAChB,GAAG,CAAC,OAAO,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC;KAC7B;IACD,OAAO,GAAG,CAAC,OAAO,CAAC;AACrB,CAAC;AARD,sBAQC","sourcesContent":["import * as React from 'react';\n// TODO\n// getId() is a temporary approach, useId() should be reimplemented to properly support SSR & scenarios with\n// different globals (document, window)\nlet id = 0;\n\nexport function getId(prefix?: string): string {\n  return (prefix || '') + id++;\n}\n\nexport function resetIds(): void {\n  id = 0;\n}\n\n/**\n * Hook to generate a unique ID in the global scope (spanning across duplicate copies of the same library).\n *\n * @param prefix - Optional prefix for the ID\n * @param providedId - Optional id provided by a parent component. Defaults to the provided value if present,\n *  without conditioning the hook call\n * @returns The ID\n */\nexport function useId(prefix?: string, providedId?: string): string {\n  // getId should only be called once since it updates the global constant for the next ID value.\n  // (While an extra update isn't likely to cause problems in practice, it's better to avoid it.)\n  const ref = React.useRef<string | undefined>(providedId);\n  if (!ref.current) {\n    ref.current = getId(prefix);\n  }\n  return ref.current;\n}\n"]}
+{"version":3,"sources":["../../src/hooks/useId.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AAEA;;;;AAIG;;;AACH,SAAgB,gBAAhB,GAAgC;AAC9B,EAAA,OAAA,CAAA,sBAAA,CAAuB,OAAvB,GAAiC,CAAjC;AACD;;AAFD,OAAA,CAAA,gBAAA,GAAA,gBAAA;AAIA;;;;;;;AAOG;;AACH,SAAgB,KAAhB,CAAsB,MAAtB,EAAuC,UAAvC,EAA0D;AACxD,QAAM,YAAY,GAAG,OAAA,CAAA,aAAA,EAArB;AAEA,SAAO,KAAK,CAAC,OAAN,CAAc,MAAM,UAAU,IAAI,GAAG,MAAM,GAAG,EAAE,YAAY,CAAC,OAAO,EAApE,EAAwE,CAAC,MAAD,EAAS,UAAT,EAAqB,YAArB,CAAxE,CAAP;AACD;;AAJD,OAAA,CAAA,KAAA,GAAA,KAAA","sourceRoot":""}

package/lib-commonjs/hooks/useIsomorphicLayoutEffect.d.ts

@@ -1,2 +1,11 @@
 import * as React from 'react';
+/**
+ * React currently throws a warning when using useLayoutEffect on the server. To get around it, we can conditionally
+ * useEffect on the server (no-op) and useLayoutEffect in the browser. We occasionally need useLayoutEffect to
+ * ensure we don't get a render flash for certain operations, but we may also need affected components to render on
+ * the server.
+ *
+ * https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85
+ * https://github.com/reduxjs/react-redux/blob/master/src/utils/useIsomorphicLayoutEffect.js
+ */
 export declare const useIsomorphicLayoutEffect: typeof React.useEffect;

package/lib-commonjs/hooks/useIsomorphicLayoutEffect.js

@@ -1,8 +1,24 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var React = require("react");
-var isSSR = typeof window === 'undefined' || /ServerSideRendering/.test(window.navigator && window.navigator.userAgent);
-// useLayoutEffect() produces a warning with SSR rendering
-// https://medium.com/@alexandereardon/uselayouteffect-and-ssr-192986cdcf7a
-exports.useIsomorphicLayoutEffect = isSSR ? React.useEffect : React.useLayoutEffect;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useIsomorphicLayoutEffect = void 0;
+
+const React = /*#__PURE__*/require("react");
+
+const index_1 = /*#__PURE__*/require("../ssr/index");
+/**
+ * React currently throws a warning when using useLayoutEffect on the server. To get around it, we can conditionally
+ * useEffect on the server (no-op) and useLayoutEffect in the browser. We occasionally need useLayoutEffect to
+ * ensure we don't get a render flash for certain operations, but we may also need affected components to render on
+ * the server.
+ *
+ * https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85
+ * https://github.com/reduxjs/react-redux/blob/master/src/utils/useIsomorphicLayoutEffect.js
+ */
+// eslint-disable-next-line no-restricted-properties
+
+
+exports.useIsomorphicLayoutEffect = /*#__PURE__*/index_1.canUseDOM() ? React.useLayoutEffect : React.useEffect;
 //# sourceMappingURL=useIsomorphicLayoutEffect.js.map

package/lib-commonjs/hooks/useIsomorphicLayoutEffect.js.map

@@ -1 +1 @@
-{"version":3,"file":"useIsomorphicLayoutEffect.js","sourceRoot":"../src/","sources":["hooks/useIsomorphicLayoutEffect.ts"],"names":[],"mappings":";;AAAA,6BAA+B;AAE/B,IAAM,KAAK,GACT,OAAO,MAAM,KAAK,WAAW,IAAI,qBAAqB,CAAC,IAAI,CAAC,MAAM,CAAC,SAAS,IAAI,MAAM,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;AAE9G,0DAA0D;AAC1D,2EAA2E;AAC9D,QAAA,yBAAyB,GAAG,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,eAAe,CAAC","sourcesContent":["import * as React from 'react';\n\nconst isSSR =\n  typeof window === 'undefined' || /ServerSideRendering/.test(window.navigator && window.navigator.userAgent);\n\n// useLayoutEffect() produces a warning with SSR rendering\n// https://medium.com/@alexandereardon/uselayouteffect-and-ssr-192986cdcf7a\nexport const useIsomorphicLayoutEffect = isSSR ? React.useEffect : React.useLayoutEffect;\n"]}
+{"version":3,"sources":["../../src/hooks/useIsomorphicLayoutEffect.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AAEA;;;;;;;;AAQG;AACH;;;AACa,OAAA,CAAA,yBAAA,GAAoD,aAAA,OAAA,CAAA,SAAA,KAAc,KAAK,CAAC,eAApB,GAAsC,KAAK,CAAC,SAAhG","sourceRoot":""}