@hitachivantara/uikit-react-core 3.72.1 → 4.0.1-next.0

package/dist/modern/ProgressBar/ProgressBar.js

@@ -0,0 +1,141 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+const _excluded = ["className", "classes", "value", "status", "labelProps"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+import React from "react";
+import PropTypes from "prop-types";
+import clsx from "clsx";
+import clamp from "lodash/clamp";
+import { withStyles } from "@mui/styles";
+import { HvTypography } from "..";
+import styles from "./styles";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const statusCategories = Object.freeze({
+  inProgress: "inProgress",
+  completed: "completed",
+  error: "error"
+});
+/**
+ * ProgressBar provides feedback about a process that is taking place in the application.
+ */
+
+const HvProgressBar = props => {
+  const {
+    className,
+    classes,
+    value = 0,
+    status = statusCategories.inProgress,
+    labelProps
+  } = props,
+        others = _objectWithoutProperties(props, _excluded);
+
+  const clampedValue = clamp(value, 0, 100);
+  return /*#__PURE__*/_jsx("div", _objectSpread(_objectSpread({
+    className: clsx(className, classes.root, classes.progress),
+    role: "progressbar",
+    "aria-valuemin": "0",
+    "aria-valuemax": "100",
+    "aria-valuenow": clampedValue
+  }, others), {}, {
+    children: /*#__PURE__*/_jsxs("div", {
+      className: classes.progressContainer,
+      children: [/*#__PURE__*/_jsx(HvTypography, _objectSpread(_objectSpread({
+        variant: "vizText",
+        style: {
+          width: `${clampedValue}%`
+        },
+        className: clsx(classes.progressBarLabel, status === statusCategories.completed && classes.progressDone)
+      }, labelProps), {}, {
+        children: `${clampedValue}%`
+      })), /*#__PURE__*/_jsx("div", {
+        className: classes.progressBarContainer,
+        children: /*#__PURE__*/_jsx("div", {
+          style: {
+            width: `${clampedValue}%`
+          },
+          className: clsx(classes.progressBar, status === statusCategories.completed && classes.progressDone, status === statusCategories.error && classes.progressError)
+        })
+      })]
+    })
+  }));
+};
+
+process.env.NODE_ENV !== "production" ? HvProgressBar.propTypes = {
+  /**
+   * Class names to be applied.
+   */
+  className: PropTypes.string,
+
+  /**
+   * A Jss Object used to override or extend the styles applied.
+   */
+  classes: PropTypes.shape({
+    /**
+     * Styles applied to the component root class.
+     */
+    root: PropTypes.string,
+
+    /**
+     * Style applied to the overall container when in progress mode.
+     */
+    progress: PropTypes.string,
+
+    /**
+     * Style applied to the specifc container when in progress mode.
+     */
+    progressContainer: PropTypes.string,
+
+    /**
+     * Style applied to progress bar container.
+     */
+    progressBarContainer: PropTypes.string,
+
+    /**
+     * Style applied to the progress bar.
+     */
+    progressBar: PropTypes.string,
+
+    /**
+     * Style applied to the progress bar when the loading is done.
+     */
+    progressDone: PropTypes.string,
+
+    /**
+     * Style applied to the progress bar when an error occurs.
+     */
+    progressError: PropTypes.string,
+
+    /**
+     * Style applied to the progress bar label.
+     */
+    progressBarLabel: PropTypes.string
+  }).isRequired,
+
+  /**
+   * The value of the progress bar.
+   */
+  value: PropTypes.number,
+
+  /**
+   * The status of the progress bar.
+   *
+   * inProgress is black, error is red and completed is green.
+   *
+   * When uncontrolled and unspecified it will default to "inProgress".
+   */
+  status: PropTypes.oneOf([statusCategories.inProgress, statusCategories.completed, statusCategories.error]),
+
+  /**
+   * Aria Properties passed on to the progress bar.
+   */
+  labelProps: PropTypes.instanceOf(Object)
+} : void 0;
+export default withStyles(styles, {
+  name: "HvProgressBar"
+})(HvProgressBar);
+//# sourceMappingURL=ProgressBar.js.map

package/dist/modern/ProgressBar/ProgressBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProgressBar.js","names":["React","PropTypes","clsx","clamp","withStyles","HvTypography","styles","statusCategories","Object","freeze","inProgress","completed","error","HvProgressBar","props","className","classes","value","status","labelProps","others","clampedValue","root","progress","progressContainer","width","progressBarLabel","progressDone","progressBarContainer","progressBar","progressError","propTypes","string","shape","isRequired","number","oneOf","instanceOf","name"],"sources":["../../../src/ProgressBar/ProgressBar.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\n\nimport clamp from \"lodash/clamp\";\nimport { withStyles } from \"@mui/styles\";\n\nimport { HvTypography } from \"..\";\nimport styles from \"./styles\";\n\nconst statusCategories = Object.freeze({\n  inProgress: \"inProgress\",\n  completed: \"completed\",\n  error: \"error\",\n});\n\n/**\n * ProgressBar provides feedback about a process that is taking place in the application.\n */\nconst HvProgressBar = (props) => {\n  const {\n    className,\n    classes,\n    value = 0,\n    status = statusCategories.inProgress,\n    labelProps,\n    ...others\n  } = props;\n\n  const clampedValue = clamp(value, 0, 100);\n\n  return (\n    <div\n      className={clsx(className, classes.root, classes.progress)}\n      role=\"progressbar\"\n      aria-valuemin=\"0\"\n      aria-valuemax=\"100\"\n      aria-valuenow={clampedValue}\n      {...others}\n    >\n      <div className={classes.progressContainer}>\n        <HvTypography\n          variant=\"vizText\"\n          style={{ width: `${clampedValue}%` }}\n          className={clsx(\n            classes.progressBarLabel,\n            status === statusCategories.completed && classes.progressDone\n          )}\n          {...labelProps}\n        >\n          {`${clampedValue}%`}\n        </HvTypography>\n        <div className={classes.progressBarContainer}>\n          <div\n            style={{ width: `${clampedValue}%` }}\n            className={clsx(\n              classes.progressBar,\n              status === statusCategories.completed && classes.progressDone,\n              status === statusCategories.error && classes.progressError\n            )}\n          />\n        </div>\n      </div>\n    </div>\n  );\n};\n\nHvProgressBar.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root class.\n     */\n    root: PropTypes.string,\n\n    /**\n     * Style applied to the overall container when in progress mode.\n     */\n    progress: PropTypes.string,\n    /**\n     * Style applied to the specifc container when in progress mode.\n     */\n    progressContainer: PropTypes.string,\n    /**\n     * Style applied to progress bar container.\n     */\n    progressBarContainer: PropTypes.string,\n    /**\n     * Style applied to the progress bar.\n     */\n    progressBar: PropTypes.string,\n    /**\n     * Style applied to the progress bar when the loading is done.\n     */\n    progressDone: PropTypes.string,\n    /**\n     * Style applied to the progress bar when an error occurs.\n     */\n    progressError: PropTypes.string,\n    /**\n     * Style applied to the progress bar label.\n     */\n    progressBarLabel: PropTypes.string,\n  }).isRequired,\n  /**\n   * The value of the progress bar.\n   */\n  value: PropTypes.number,\n  /**\n   * The status of the progress bar.\n   *\n   * inProgress is black, error is red and completed is green.\n   *\n   * When uncontrolled and unspecified it will default to \"inProgress\".\n   */\n  status: PropTypes.oneOf([\n    statusCategories.inProgress,\n    statusCategories.completed,\n    statusCategories.error,\n  ]),\n  /**\n   * Aria Properties passed on to the progress bar.\n   */\n  labelProps: PropTypes.instanceOf(Object),\n};\n\nexport default withStyles(styles, { name: \"HvProgressBar\" })(HvProgressBar);\n"],"mappings":"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"}

package/dist/modern/ProgressBar/ProgressBarSimulator.js

@@ -0,0 +1,70 @@
+import "core-js/modules/web.dom-collections.iterator.js";
+import React, { useEffect, useState } from "react";
+import { HvButton } from "..";
+import HvProgressBar from "./ProgressBar"; // eslint-disable-next-line react/prop-types
+
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export const ProgressBarSimulator = ({
+  inc,
+  error,
+  ariaLabel,
+  ariaLive
+}) => {
+  const [status, setStatus] = useState("inProgress");
+  const [value, setValue] = useState(0);
+  const [run, setRun] = useState(false);
+  useEffect(() => {
+    const interval = setInterval(() => {
+      if (value === 100) {
+        setRun(false);
+        clearInterval(interval);
+        setStatus("completed");
+      } else if (error && value === error) {
+        clearInterval(interval);
+        setStatus("error");
+      } else if (run) setValue(inc);
+    }, 150);
+    return () => clearInterval(interval);
+  }, [inc, value, run, error]);
+
+  const reset = () => {
+    setValue(0);
+    setStatus("inProgress");
+  };
+
+  const start = () => {
+    setRun(true);
+  };
+
+  return /*#__PURE__*/_jsxs("div", {
+    style: {
+      width: 400
+    },
+    children: [/*#__PURE__*/_jsx(HvProgressBar, {
+      value: value,
+      status: status,
+      labelProps: {
+        "aria-label": ariaLabel,
+        "aria-busy": false,
+        "aria-live": ariaLive
+      }
+    }), /*#__PURE__*/_jsxs("div", {
+      style: {
+        marginTop: 10
+      },
+      children: [/*#__PURE__*/_jsx(HvButton, {
+        onClick: start,
+        children: "Start"
+      }), /*#__PURE__*/_jsx(HvButton, {
+        style: {
+          marginLeft: 10
+        },
+        onClick: reset,
+        children: "Reset"
+      })]
+    })]
+  });
+};
+export { ProgressBarSimulator as default };
+//# sourceMappingURL=ProgressBarSimulator.js.map

package/dist/modern/ProgressBar/ProgressBarSimulator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProgressBarSimulator.js","names":["React","useEffect","useState","HvButton","HvProgressBar","ProgressBarSimulator","inc","error","ariaLabel","ariaLive","status","setStatus","value","setValue","run","setRun","interval","setInterval","clearInterval","reset","start","width","marginTop","marginLeft","default"],"sources":["../../../src/ProgressBar/ProgressBarSimulator.js"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\n\nimport { HvButton } from \"..\";\n\nimport HvProgressBar from \"./ProgressBar\";\n\n// eslint-disable-next-line react/prop-types\nexport const ProgressBarSimulator = ({ inc, error, ariaLabel, ariaLive }) => {\n  const [status, setStatus] = useState(\"inProgress\");\n  const [value, setValue] = useState(0);\n  const [run, setRun] = useState(false);\n\n  useEffect(() => {\n    const interval = setInterval(() => {\n      if (value === 100) {\n        setRun(false);\n        clearInterval(interval);\n        setStatus(\"completed\");\n      } else if (error && value === error) {\n        clearInterval(interval);\n        setStatus(\"error\");\n      } else if (run) setValue(inc);\n    }, 150);\n    return () => clearInterval(interval);\n  }, [inc, value, run, error]);\n\n  const reset = () => {\n    setValue(0);\n    setStatus(\"inProgress\");\n  };\n\n  const start = () => {\n    setRun(true);\n  };\n\n  return (\n    <div style={{ width: 400 }}>\n      <HvProgressBar\n        value={value}\n        status={status}\n        labelProps={{\n          \"aria-label\": ariaLabel,\n          \"aria-busy\": false,\n          \"aria-live\": ariaLive,\n        }}\n      />\n      <div style={{ marginTop: 10 }}>\n        <HvButton onClick={start}>Start</HvButton>\n        <HvButton style={{ marginLeft: 10 }} onClick={reset}>\n          Reset\n        </HvButton>\n      </div>\n    </div>\n  );\n};\n\nexport { ProgressBarSimulator as default };\n"],"mappings":";AAAA,OAAOA,KAAP,IAAgBC,SAAhB,EAA2BC,QAA3B,QAA2C,OAA3C;AAEA,SAASC,QAAT,QAAyB,IAAzB;AAEA,OAAOC,aAAP,MAA0B,eAA1B,C,CAEA;;;;AACA,OAAO,MAAMC,oBAAoB,GAAG,CAAC;EAAEC,GAAF;EAAOC,KAAP;EAAcC,SAAd;EAAyBC;AAAzB,CAAD,KAAyC;EAC3E,MAAM,CAACC,MAAD,EAASC,SAAT,IAAsBT,QAAQ,CAAC,YAAD,CAApC;EACA,MAAM,CAACU,KAAD,EAAQC,QAAR,IAAoBX,QAAQ,CAAC,CAAD,CAAlC;EACA,MAAM,CAACY,GAAD,EAAMC,MAAN,IAAgBb,QAAQ,CAAC,KAAD,CAA9B;EAEAD,SAAS,CAAC,MAAM;IACd,MAAMe,QAAQ,GAAGC,WAAW,CAAC,MAAM;MACjC,IAAIL,KAAK,KAAK,GAAd,EAAmB;QACjBG,MAAM,CAAC,KAAD,CAAN;QACAG,aAAa,CAACF,QAAD,CAAb;QACAL,SAAS,CAAC,WAAD,CAAT;MACD,CAJD,MAIO,IAAIJ,KAAK,IAAIK,KAAK,KAAKL,KAAvB,EAA8B;QACnCW,aAAa,CAACF,QAAD,CAAb;QACAL,SAAS,CAAC,OAAD,CAAT;MACD,CAHM,MAGA,IAAIG,GAAJ,EAASD,QAAQ,CAACP,GAAD,CAAR;IACjB,CAT2B,EASzB,GATyB,CAA5B;IAUA,OAAO,MAAMY,aAAa,CAACF,QAAD,CAA1B;EACD,CAZQ,EAYN,CAACV,GAAD,EAAMM,KAAN,EAAaE,GAAb,EAAkBP,KAAlB,CAZM,CAAT;;EAcA,MAAMY,KAAK,GAAG,MAAM;IAClBN,QAAQ,CAAC,CAAD,CAAR;IACAF,SAAS,CAAC,YAAD,CAAT;EACD,CAHD;;EAKA,MAAMS,KAAK,GAAG,MAAM;IAClBL,MAAM,CAAC,IAAD,CAAN;EACD,CAFD;;EAIA,oBACE;IAAK,KAAK,EAAE;MAAEM,KAAK,EAAE;IAAT,CAAZ;IAAA,wBACE,KAAC,aAAD;MACE,KAAK,EAAET,KADT;MAEE,MAAM,EAAEF,MAFV;MAGE,UAAU,EAAE;QACV,cAAcF,SADJ;QAEV,aAAa,KAFH;QAGV,aAAaC;MAHH;IAHd,EADF,eAUE;MAAK,KAAK,EAAE;QAAEa,SAAS,EAAE;MAAb,CAAZ;MAAA,wBACE,KAAC,QAAD;QAAU,OAAO,EAAEF,KAAnB;QAAA;MAAA,EADF,eAEE,KAAC,QAAD;QAAU,KAAK,EAAE;UAAEG,UAAU,EAAE;QAAd,CAAjB;QAAqC,OAAO,EAAEJ,KAA9C;QAAA;MAAA,EAFF;IAAA,EAVF;EAAA,EADF;AAmBD,CA/CM;AAiDP,SAASd,oBAAoB,IAAImB,OAAjC"}

package/dist/modern/ProgressBar/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./ProgressBar";
+export * from "./ProgressBar";

package/dist/modern/ProgressBar/index.js

@@ -0,0 +1,2 @@
+export { default } from "./ProgressBar";
+//# sourceMappingURL=index.js.map

package/dist/modern/ProgressBar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default"],"sources":["../../../src/ProgressBar/index.js"],"sourcesContent":["export { default } from \"./ProgressBar\";\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,eAAxB"}

package/dist/modern/ProgressBar/styles.js

@@ -0,0 +1,38 @@
+const styles = theme => ({
+  root: {
+    display: "flex",
+    flexDirection: "column",
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  progress: {
+    width: "100%"
+  },
+  progressContainer: {
+    width: "100%"
+  },
+  progressBarContainer: {
+    display: "flex",
+    width: "100%",
+    height: 4,
+    backgroundColor: theme.hv.palette.atmosphere.atmo4
+  },
+  progressBar: {
+    backgroundColor: "#000",
+    height: 4
+  },
+  progressDone: {
+    backgroundColor: theme.hv.palette.semantic.sema1
+  },
+  progressError: {
+    backgroundColor: theme.hv.palette.semantic.sema4
+  },
+  progressBarLabel: {
+    backgroundColor: "transparent",
+    display: "flex",
+    justifyContent: "end"
+  }
+});
+
+export default styles;
+//# sourceMappingURL=styles.js.map

package/dist/modern/ProgressBar/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","names":["styles","theme","root","display","flexDirection","alignItems","justifyContent","progress","width","progressContainer","progressBarContainer","height","backgroundColor","hv","palette","atmosphere","atmo4","progressBar","progressDone","semantic","sema1","progressError","sema4","progressBarLabel"],"sources":["../../../src/ProgressBar/styles.js"],"sourcesContent":["const styles = (theme) => ({\n  root: {\n    display: \"flex\",\n    flexDirection: \"column\",\n    alignItems: \"center\",\n    justifyContent: \"center\",\n  },\n\n  progress: {\n    width: \"100%\",\n  },\n\n  progressContainer: {\n    width: \"100%\",\n  },\n\n  progressBarContainer: {\n    display: \"flex\",\n    width: \"100%\",\n    height: 4,\n    backgroundColor: theme.hv.palette.atmosphere.atmo4,\n  },\n\n  progressBar: {\n    backgroundColor: \"#000\",\n    height: 4,\n  },\n\n  progressDone: {\n    backgroundColor: theme.hv.palette.semantic.sema1,\n  },\n\n  progressError: {\n    backgroundColor: theme.hv.palette.semantic.sema4,\n  },\n\n  progressBarLabel: {\n    backgroundColor: \"transparent\",\n    display: \"flex\",\n    justifyContent: \"end\",\n  },\n});\n\nexport default styles;\n"],"mappings":"AAAA,MAAMA,MAAM,GAAIC,KAAD,KAAY;EACzBC,IAAI,EAAE;IACJC,OAAO,EAAE,MADL;IAEJC,aAAa,EAAE,QAFX;IAGJC,UAAU,EAAE,QAHR;IAIJC,cAAc,EAAE;EAJZ,CADmB;EAQzBC,QAAQ,EAAE;IACRC,KAAK,EAAE;EADC,CARe;EAYzBC,iBAAiB,EAAE;IACjBD,KAAK,EAAE;EADU,CAZM;EAgBzBE,oBAAoB,EAAE;IACpBP,OAAO,EAAE,MADW;IAEpBK,KAAK,EAAE,MAFa;IAGpBG,MAAM,EAAE,CAHY;IAIpBC,eAAe,EAAEX,KAAK,CAACY,EAAN,CAASC,OAAT,CAAiBC,UAAjB,CAA4BC;EAJzB,CAhBG;EAuBzBC,WAAW,EAAE;IACXL,eAAe,EAAE,MADN;IAEXD,MAAM,EAAE;EAFG,CAvBY;EA4BzBO,YAAY,EAAE;IACZN,eAAe,EAAEX,KAAK,CAACY,EAAN,CAASC,OAAT,CAAiBK,QAAjB,CAA0BC;EAD/B,CA5BW;EAgCzBC,aAAa,EAAE;IACbT,eAAe,EAAEX,KAAK,CAACY,EAAN,CAASC,OAAT,CAAiBK,QAAjB,CAA0BG;EAD9B,CAhCU;EAoCzBC,gBAAgB,EAAE;IAChBX,eAAe,EAAE,aADD;IAEhBT,OAAO,EAAE,MAFO;IAGhBG,cAAc,EAAE;EAHA;AApCO,CAAZ,CAAf;;AA2CA,eAAeN,MAAf"}

package/dist/modern/Provider/Provider.js

@@ -10,10 +10,13 @@ import cloneDeep from "lodash/cloneDeep";
 import diff from "deep-diff";
 import "focus-within-polyfill";
 import "focus-visible";
-import { ThemeProvider as MuiThemeProvider, StylesProvider as MuiStylesProvider } from "@material-ui/core";
-import { createTheme } from "@material-ui/core/styles";
+import { createTheme, ThemeProvider } from "@mui/material";
+import { StylesProvider } from "@mui/styles";
+import { StyledEngineProvider } from "@mui/material/styles";
 import { themeBuilder, createGenerateClassName, HvCssBaseline, getTheme } from "../theme";
 import ConfigContext from "./context";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
 let warnedOnce = false;
 /**
  * Augments the target theme with the differences found in the source theme.
@@ -74,7 +77,7 @@ const HvProvider = ({
   locale = "en-US",
   generateClassName: generateClassNameProp,
   generateClassNameOptions,
-  injectStylesFirst = false,
+  injectStylesFirst = true,
   disableStylesGeneration = false,
   disableCssBaseline = false
 }) => {
@@ -100,15 +103,20 @@ const HvProvider = ({
     changeTheme,
     locale: localeSetting
   }), [changeTheme, localeSetting]);
-  return /*#__PURE__*/React.createElement(MuiStylesProvider, {
-    generateClassName: generateClassName,
+  return /*#__PURE__*/_jsx(StyledEngineProvider, {
     injectFirst: injectStylesFirst,
-    disableGeneration: disableStylesGeneration
-  }, /*#__PURE__*/React.createElement(MuiThemeProvider, {
-    theme: customTheme
-  }, !disableCssBaseline && (_HvCssBaseline || (_HvCssBaseline = /*#__PURE__*/React.createElement(HvCssBaseline, null))), /*#__PURE__*/React.createElement(ConfigContext.Provider, {
-    value: pConfig
-  }, children)));
+    children: /*#__PURE__*/_jsx(StylesProvider, {
+      generateClassName: generateClassName,
+      disableGeneration: disableStylesGeneration,
+      children: /*#__PURE__*/_jsxs(ThemeProvider, {
+        theme: customTheme,
+        children: [!disableCssBaseline && (_HvCssBaseline || (_HvCssBaseline = /*#__PURE__*/_jsx(HvCssBaseline, {}))), /*#__PURE__*/_jsx(ConfigContext.Provider, {
+          value: pConfig,
+          children: children
+        })]
+      })
+    })
+  });
 };
 
 process.env.NODE_ENV !== "production" ? HvProvider.propTypes = {

package/dist/modern/Provider/Provider.js.map

@@ -1 +1 @@
-{"version":3,"file":"Provider.js","names":["React","useState","useEffect","useMemo","PropTypes","set","merge","isEmpty","cloneDeep","diff","ThemeProvider","MuiThemeProvider","StylesProvider","MuiStylesProvider","createTheme","themeBuilder","createGenerateClassName","HvCssBaseline","getTheme","ConfigContext","warnedOnce","applyCustomTheme","InputTargetTheme","InputSourceTheme","muiDefaultTheme","targetTheme","sourceTheme","deleteDifference","observableDiff","difference","partialCustomTheme","path","rhs","kind","HvProvider","children","uiKitTheme","theme","changeTheme","locale","generateClassName","generateClassNameProp","generateClassNameOptions","injectStylesFirst","disableStylesGeneration","disableCssBaseline","process","env","NODE_ENV","console","warn","localeSetting","setLocaleStting","navigator","language","rawUiKitTheme","customTheme","pConfig","propTypes","node","isRequired","oneOf","instanceOf","Object","func","string","shape","disableGlobal","bool","productionPrefix","seed"],"sources":["../../../src/Provider/Provider.js"],"sourcesContent":["import React, { useState, useEffect, useMemo } from \"react\";\nimport PropTypes from \"prop-types\";\n\nimport set from \"lodash/set\";\nimport merge from \"lodash/merge\";\nimport isEmpty from \"lodash/isEmpty\";\nimport cloneDeep from \"lodash/cloneDeep\";\nimport diff from \"deep-diff\";\n\nimport \"focus-within-polyfill\";\nimport \"focus-visible\";\n\nimport {\n  ThemeProvider as MuiThemeProvider,\n  StylesProvider as MuiStylesProvider,\n} from \"@material-ui/core\";\nimport { createTheme } from \"@material-ui/core/styles\";\n\nimport { themeBuilder, createGenerateClassName, HvCssBaseline, getTheme } from \"../theme\";\n\nimport ConfigContext from \"./context\";\n\nlet warnedOnce = false;\n\n/**\n * Augments the target theme with the differences found in the source theme.\n *\n * @param {Object} InputTargetTheme - A material UI Theme to be changed.\n * @param {Object} InputSourceTheme - A material UI Theme to apply on top.\n * @returns {Object} - A new modified material UI theme.\n */\nconst applyCustomTheme = (InputTargetTheme, InputSourceTheme) => {\n  const muiDefaultTheme = createTheme();\n  const targetTheme = cloneDeep(InputTargetTheme);\n  const sourceTheme = cloneDeep(InputSourceTheme);\n  const deleteDifference = \"D\";\n  if (!isEmpty(targetTheme) && !isEmpty(sourceTheme)) {\n    diff.observableDiff(muiDefaultTheme, sourceTheme, (difference) => {\n      const partialCustomTheme = set({}, difference.path, difference.rhs);\n      if (difference.kind !== deleteDifference) {\n        // Do not include the differences of type \"delete\"\n        merge(targetTheme, partialCustomTheme);\n      }\n    });\n    return targetTheme;\n  }\n  return targetTheme;\n};\n\n/**\n * This component makes cross-component properties, like the active `theme` and `locale`,\n * available down the React tree thanks to React context.\n *\n * This component should preferably be used at **the root of your component tree** and\n * be unique in the App in most cases.\n *\n * ```jsx\n * <HvProvider>\n *   <MyApp />\n * <HvProvider/>\n * ```\n *\n * If several `HvProvider`'s are used, either nested or in parallel, the `generateClassNameOptions`\n * must be tweaked to avoid CSS classnames collision. Or a custom JSS's class name generator can\n * be provided via the `generateClassName` property.\n *\n * **UI Kit components will not work at all if the `HvProvider` is not configured correctly**,\n * as they will not be able to access the properties of the active theme..\n *\n */\nconst HvProvider = ({\n  children,\n\n  uiKitTheme = \"dawn\",\n  theme = null,\n  changeTheme = () => {},\n\n  locale = \"en-US\",\n\n  generateClassName: generateClassNameProp,\n  generateClassNameOptions,\n  injectStylesFirst = false,\n  disableStylesGeneration = false,\n\n  disableCssBaseline = false,\n}) => {\n  if (process.env.NODE_ENV !== \"production\") {\n    if (!warnedOnce && !disableCssBaseline) {\n      warnedOnce = true;\n      // eslint-disable-next-line no-console\n      console.warn(\n        \"UI Kit HvProvider's automatic definition of a css styles baseline will be removed in the next major version.\\n\" +\n          \"You can use the `disableCssBaseline` property to disable it already.\\n\" +\n          \"See https://lumada-design.github.io/uikit/master/?path=/docs/foundation-css-baseline--main\"\n      );\n    }\n  }\n\n  const [localeSetting, setLocaleStting] = useState(locale);\n\n  useEffect(() => {\n    // ssr - only runs at the rendering phase, so it won't run on the server\n    setLocaleStting(locale || navigator?.language);\n  }, [locale]);\n\n  const rawUiKitTheme = getTheme(uiKitTheme);\n  const customTheme = applyCustomTheme(themeBuilder(rawUiKitTheme), theme);\n\n  const generateClassName =\n    generateClassNameProp || createGenerateClassName(generateClassNameOptions);\n\n  const pConfig = useMemo(\n    () => ({ changeTheme, locale: localeSetting }),\n    [changeTheme, localeSetting]\n  );\n\n  return (\n    <MuiStylesProvider\n      generateClassName={generateClassName}\n      injectFirst={injectStylesFirst}\n      disableGeneration={disableStylesGeneration}\n    >\n      <MuiThemeProvider theme={customTheme}>\n        {!disableCssBaseline && <HvCssBaseline />}\n        <ConfigContext.Provider value={pConfig}>{children}</ConfigContext.Provider>\n      </MuiThemeProvider>\n    </MuiStylesProvider>\n  );\n};\n\nHvProvider.propTypes = {\n  /**\n   * Your component tree.\n   */\n  children: PropTypes.node.isRequired,\n\n  /**\n   * The Design System base theme in use. Defaults to `\"dawn\"`.\n   */\n  uiKitTheme: PropTypes.oneOf([\"dawn\", \"wicked\"]),\n  /**\n   * The UI Kit theme object to be applied on top of the base theme.\n   */\n  theme: PropTypes.instanceOf(Object),\n  /**\n   * Function stored in the provider's context to allow runtime switching of the active theme.\n   * The implementation is up to each App.\n   */\n  changeTheme: PropTypes.func,\n\n  /**\n   * The locale to be used.\n   * Defaults to the browser's configured locale or \"en-US\" if not available.\n   */\n  locale: PropTypes.string,\n\n  /**\n   * Custom JSS's class name generator.\n   */\n  generateClassName: PropTypes.func,\n  /**\n   * Built-in JSS's class name generator options.\n   * Ignored if a custom `generateClassName` is provided.\n   *\n   * `disableGlobal`: Disable the generation of deterministic class names. Defaults to `false`.\n   *\n   * `productionPrefix`: The string used to prefix the class names in production. Defaults to `\"jss-uikit\"`.\n   *\n   * `seed`: The string used to uniquely identify the generator. Defaults to `\"\"`.\n   *         It can be used to avoid class name collisions when using multiple generators in the same document.\n   */\n  generateClassNameOptions: PropTypes.shape({\n    /**\n     * Disable the generation of deterministic class names. Defaults to `false`.\n     */\n    disableGlobal: PropTypes.bool,\n    /**\n     * The string used to prefix the class names in production. Defaults to `\"jss-uikit\"`.\n     */\n    productionPrefix: PropTypes.string,\n    /**\n     * The string used to uniquely identify the generator. Defaults to `\"\"`.\n     * It can be used to avoid class name collisions when using multiple generators in the same document.\n     */\n    seed: PropTypes.string,\n  }),\n  /**\n   * Injects the generated stylesheets at the top of the `<head>` element of the page.\n   * This can ease the override of UI Kit components styles.\n   *\n   * By default, the styles are injected last in the `<head>` element of the page.\n   */\n  injectStylesFirst: PropTypes.bool,\n  /**\n   * Disables the generation of the styles.\n   */\n  disableStylesGeneration: PropTypes.bool,\n\n  /**\n   * Disables the generation of the baseline css styles.\n   *\n   * This will be the default behavior in the future.\n   *\n   * The application using UI Kit should be responsible for adding the baseline css styles, by\n   * either using the `<HvCssBaseline />` component, using the `<HvScopedCssBaseline />` component,\n   * or ensuring that the necessary base styles are applied.\n   *\n   * Defaults to `false`. Will be removed in the next major release.\n   *\n   * @see https://lumada-design.github.io/uikit/master/?path=/docs/foundation-css-baseline--main\n   */\n  disableCssBaseline: PropTypes.bool,\n};\n\nexport default HvProvider;\n"],"mappings":"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"}
+{"version":3,"file":"Provider.js","names":["React","useState","useEffect","useMemo","PropTypes","set","merge","isEmpty","cloneDeep","diff","createTheme","ThemeProvider","StylesProvider","StyledEngineProvider","themeBuilder","createGenerateClassName","HvCssBaseline","getTheme","ConfigContext","warnedOnce","applyCustomTheme","InputTargetTheme","InputSourceTheme","muiDefaultTheme","targetTheme","sourceTheme","deleteDifference","observableDiff","difference","partialCustomTheme","path","rhs","kind","HvProvider","children","uiKitTheme","theme","changeTheme","locale","generateClassName","generateClassNameProp","generateClassNameOptions","injectStylesFirst","disableStylesGeneration","disableCssBaseline","process","env","NODE_ENV","console","warn","localeSetting","setLocaleStting","navigator","language","rawUiKitTheme","customTheme","pConfig","propTypes","node","isRequired","oneOf","instanceOf","Object","func","string","shape","disableGlobal","bool","productionPrefix","seed"],"sources":["../../../src/Provider/Provider.js"],"sourcesContent":["import React, { useState, useEffect, useMemo } from \"react\";\nimport PropTypes from \"prop-types\";\n\nimport set from \"lodash/set\";\nimport merge from \"lodash/merge\";\nimport isEmpty from \"lodash/isEmpty\";\nimport cloneDeep from \"lodash/cloneDeep\";\nimport diff from \"deep-diff\";\n\nimport \"focus-within-polyfill\";\nimport \"focus-visible\";\n\nimport { createTheme, ThemeProvider } from \"@mui/material\";\nimport { StylesProvider } from \"@mui/styles\";\nimport { StyledEngineProvider } from \"@mui/material/styles\";\nimport { themeBuilder, createGenerateClassName, HvCssBaseline, getTheme } from \"../theme\";\n\nimport ConfigContext from \"./context\";\n\nlet warnedOnce = false;\n\n/**\n * Augments the target theme with the differences found in the source theme.\n *\n * @param {Object} InputTargetTheme - A material UI Theme to be changed.\n * @param {Object} InputSourceTheme - A material UI Theme to apply on top.\n * @returns {Object} - A new modified material UI theme.\n */\nconst applyCustomTheme = (InputTargetTheme, InputSourceTheme) => {\n  const muiDefaultTheme = createTheme();\n  const targetTheme = cloneDeep(InputTargetTheme);\n  const sourceTheme = cloneDeep(InputSourceTheme);\n  const deleteDifference = \"D\";\n  if (!isEmpty(targetTheme) && !isEmpty(sourceTheme)) {\n    diff.observableDiff(muiDefaultTheme, sourceTheme, (difference) => {\n      const partialCustomTheme = set({}, difference.path, difference.rhs);\n      if (difference.kind !== deleteDifference) {\n        // Do not include the differences of type \"delete\"\n        merge(targetTheme, partialCustomTheme);\n      }\n    });\n    return targetTheme;\n  }\n  return targetTheme;\n};\n\n/**\n * This component makes cross-component properties, like the active `theme` and `locale`,\n * available down the React tree thanks to React context.\n *\n * This component should preferably be used at **the root of your component tree** and\n * be unique in the App in most cases.\n *\n * ```jsx\n * <HvProvider>\n *   <MyApp />\n * <HvProvider/>\n * ```\n *\n * If several `HvProvider`'s are used, either nested or in parallel, the `generateClassNameOptions`\n * must be tweaked to avoid CSS classnames collision. Or a custom JSS's class name generator can\n * be provided via the `generateClassName` property.\n *\n * **UI Kit components will not work at all if the `HvProvider` is not configured correctly**,\n * as they will not be able to access the properties of the active theme..\n *\n */\nconst HvProvider = ({\n  children,\n\n  uiKitTheme = \"dawn\",\n  theme = null,\n  changeTheme = () => {},\n\n  locale = \"en-US\",\n\n  generateClassName: generateClassNameProp,\n  generateClassNameOptions,\n  injectStylesFirst = true,\n  disableStylesGeneration = false,\n\n  disableCssBaseline = false,\n}) => {\n  if (process.env.NODE_ENV !== \"production\") {\n    if (!warnedOnce && !disableCssBaseline) {\n      warnedOnce = true;\n      // eslint-disable-next-line no-console\n      console.warn(\n        \"UI Kit HvProvider's automatic definition of a css styles baseline will be removed in the next major version.\\n\" +\n          \"You can use the `disableCssBaseline` property to disable it already.\\n\" +\n          \"See https://lumada-design.github.io/uikit/master/?path=/docs/foundation-css-baseline--main\"\n      );\n    }\n  }\n\n  const [localeSetting, setLocaleStting] = useState(locale);\n\n  useEffect(() => {\n    // ssr - only runs at the rendering phase, so it won't run on the server\n    setLocaleStting(locale || navigator?.language);\n  }, [locale]);\n\n  const rawUiKitTheme = getTheme(uiKitTheme);\n  const customTheme = applyCustomTheme(themeBuilder(rawUiKitTheme), theme);\n\n  const generateClassName =\n    generateClassNameProp || createGenerateClassName(generateClassNameOptions);\n\n  const pConfig = useMemo(\n    () => ({ changeTheme, locale: localeSetting }),\n    [changeTheme, localeSetting]\n  );\n\n  return (\n    <StyledEngineProvider injectFirst={injectStylesFirst}>\n      <StylesProvider\n        generateClassName={generateClassName}\n        disableGeneration={disableStylesGeneration}\n      >\n        <ThemeProvider theme={customTheme}>\n          {!disableCssBaseline && <HvCssBaseline />}\n          <ConfigContext.Provider value={pConfig}>{children}</ConfigContext.Provider>\n        </ThemeProvider>\n      </StylesProvider>\n    </StyledEngineProvider>\n  );\n};\n\nHvProvider.propTypes = {\n  /**\n   * Your component tree.\n   */\n  children: PropTypes.node.isRequired,\n\n  /**\n   * The Design System base theme in use. Defaults to `\"dawn\"`.\n   */\n  uiKitTheme: PropTypes.oneOf([\"dawn\", \"wicked\"]),\n  /**\n   * The UI Kit theme object to be applied on top of the base theme.\n   */\n  theme: PropTypes.instanceOf(Object),\n  /**\n   * Function stored in the provider's context to allow runtime switching of the active theme.\n   * The implementation is up to each App.\n   */\n  changeTheme: PropTypes.func,\n\n  /**\n   * The locale to be used.\n   * Defaults to the browser's configured locale or \"en-US\" if not available.\n   */\n  locale: PropTypes.string,\n\n  /**\n   * Custom JSS's class name generator.\n   */\n  generateClassName: PropTypes.func,\n  /**\n   * Built-in JSS's class name generator options.\n   * Ignored if a custom `generateClassName` is provided.\n   *\n   * `disableGlobal`: Disable the generation of deterministic class names. Defaults to `false`.\n   *\n   * `productionPrefix`: The string used to prefix the class names in production. Defaults to `\"jss-uikit\"`.\n   *\n   * `seed`: The string used to uniquely identify the generator. Defaults to `\"\"`.\n   *         It can be used to avoid class name collisions when using multiple generators in the same document.\n   */\n  generateClassNameOptions: PropTypes.shape({\n    /**\n     * Disable the generation of deterministic class names. Defaults to `false`.\n     */\n    disableGlobal: PropTypes.bool,\n    /**\n     * The string used to prefix the class names in production. Defaults to `\"jss-uikit\"`.\n     */\n    productionPrefix: PropTypes.string,\n    /**\n     * The string used to uniquely identify the generator. Defaults to `\"\"`.\n     * It can be used to avoid class name collisions when using multiple generators in the same document.\n     */\n    seed: PropTypes.string,\n  }),\n  /**\n   * Injects the generated stylesheets at the top of the `<head>` element of the page.\n   * This can ease the override of UI Kit components styles.\n   *\n   * By default, the styles are injected last in the `<head>` element of the page.\n   */\n  injectStylesFirst: PropTypes.bool,\n  /**\n   * Disables the generation of the styles.\n   */\n  disableStylesGeneration: PropTypes.bool,\n\n  /**\n   * Disables the generation of the baseline css styles.\n   *\n   * This will be the default behavior in the future.\n   *\n   * The application using UI Kit should be responsible for adding the baseline css styles, by\n   * either using the `<HvCssBaseline />` component, using the `<HvScopedCssBaseline />` component,\n   * or ensuring that the necessary base styles are applied.\n   *\n   * Defaults to `false`. Will be removed in the next major release.\n   *\n   * @see https://lumada-design.github.io/uikit/master/?path=/docs/foundation-css-baseline--main\n   */\n  disableCssBaseline: PropTypes.bool,\n};\n\nexport default HvProvider;\n"],"mappings":"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"}

package/dist/modern/QueryBuilder/ConfirmationDialog/ConfirmationDialog.js

@@ -0,0 +1,66 @@
+import React from "react";
+import PropTypes from "prop-types";
+import { HvButton, HvDialog, HvDialogTitle, HvDialogContent, HvDialogActions } from "../..";
+import useStyles from "./styles";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+
+const ConfirmationDialog = ({
+  title,
+  message,
+  isOpen,
+  onConfirm,
+  onCancel,
+  confirmButtonLabel,
+  cancelButtonLabel,
+  closeButtonTooltip
+}) => {
+  const classes = useStyles();
+
+  const handleClose = (event, reason) => {
+    if (reason !== "backdropClick") {
+      onCancel === null || onCancel === void 0 ? void 0 : onCancel();
+    }
+  };
+
+  return /*#__PURE__*/_jsxs(HvDialog, {
+    classes: {
+      paper: classes.paper
+    },
+    open: isOpen,
+    onClose: handleClose,
+    firstFocusable: "confirmation-dialog-cancel",
+    buttonTitle: closeButtonTooltip,
+    children: [/*#__PURE__*/_jsx(HvDialogTitle, {
+      variant: "warning",
+      children: title
+    }), /*#__PURE__*/_jsx(HvDialogContent, {
+      indentContent: true,
+      children: message
+    }), /*#__PURE__*/_jsxs(HvDialogActions, {
+      children: [/*#__PURE__*/_jsx(HvButton, {
+        category: "ghost",
+        onClick: onConfirm,
+        children: confirmButtonLabel
+      }), /*#__PURE__*/_jsx(HvButton, {
+        id: "confirmation-dialog-cancel",
+        category: "ghost",
+        onClick: () => onCancel === null || onCancel === void 0 ? void 0 : onCancel(),
+        children: cancelButtonLabel
+      })]
+    })]
+  });
+};
+
+process.env.NODE_ENV !== "production" ? ConfirmationDialog.propTypes = {
+  title: PropTypes.string,
+  message: PropTypes.string,
+  isOpen: PropTypes.bool,
+  onConfirm: PropTypes.func,
+  onCancel: PropTypes.func,
+  confirmButtonLabel: PropTypes.string,
+  cancelButtonLabel: PropTypes.string,
+  closeButtonTooltip: PropTypes.string
+} : void 0;
+export default ConfirmationDialog;
+//# sourceMappingURL=ConfirmationDialog.js.map

package/dist/modern/QueryBuilder/ConfirmationDialog/ConfirmationDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConfirmationDialog.js","names":["React","PropTypes","HvButton","HvDialog","HvDialogTitle","HvDialogContent","HvDialogActions","useStyles","ConfirmationDialog","title","message","isOpen","onConfirm","onCancel","confirmButtonLabel","cancelButtonLabel","closeButtonTooltip","classes","handleClose","event","reason","paper","propTypes","string","bool","func"],"sources":["../../../../src/QueryBuilder/ConfirmationDialog/ConfirmationDialog.js"],"sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\n\nimport { HvButton, HvDialog, HvDialogTitle, HvDialogContent, HvDialogActions } from \"../..\";\n\nimport useStyles from \"./styles\";\n\nconst ConfirmationDialog = ({\n  title,\n  message,\n  isOpen,\n  onConfirm,\n  onCancel,\n  confirmButtonLabel,\n  cancelButtonLabel,\n  closeButtonTooltip,\n}) => {\n  const classes = useStyles();\n\n  const handleClose = (event, reason) => {\n    if (reason !== \"backdropClick\") {\n      onCancel?.();\n    }\n  };\n\n  return (\n    <HvDialog\n      classes={{ paper: classes.paper }}\n      open={isOpen}\n      onClose={handleClose}\n      firstFocusable=\"confirmation-dialog-cancel\"\n      buttonTitle={closeButtonTooltip}\n    >\n      <HvDialogTitle variant=\"warning\">{title}</HvDialogTitle>\n      <HvDialogContent indentContent>{message}</HvDialogContent>\n      <HvDialogActions>\n        <HvButton category=\"ghost\" onClick={onConfirm}>\n          {confirmButtonLabel}\n        </HvButton>\n        <HvButton id=\"confirmation-dialog-cancel\" category=\"ghost\" onClick={() => onCancel?.()}>\n          {cancelButtonLabel}\n        </HvButton>\n      </HvDialogActions>\n    </HvDialog>\n  );\n};\n\nConfirmationDialog.propTypes = {\n  title: PropTypes.string,\n  message: PropTypes.string,\n  isOpen: PropTypes.bool,\n  onConfirm: PropTypes.func,\n  onCancel: PropTypes.func,\n  confirmButtonLabel: PropTypes.string,\n  cancelButtonLabel: PropTypes.string,\n  closeButtonTooltip: PropTypes.string,\n};\n\nexport default ConfirmationDialog;\n"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AAEA,SAASC,QAAT,EAAmBC,QAAnB,EAA6BC,aAA7B,EAA4CC,eAA5C,EAA6DC,eAA7D,QAAoF,OAApF;AAEA,OAAOC,SAAP,MAAsB,UAAtB;;;;AAEA,MAAMC,kBAAkB,GAAG,CAAC;EAC1BC,KAD0B;EAE1BC,OAF0B;EAG1BC,MAH0B;EAI1BC,SAJ0B;EAK1BC,QAL0B;EAM1BC,kBAN0B;EAO1BC,iBAP0B;EAQ1BC;AAR0B,CAAD,KASrB;EACJ,MAAMC,OAAO,GAAGV,SAAS,EAAzB;;EAEA,MAAMW,WAAW,GAAG,CAACC,KAAD,EAAQC,MAAR,KAAmB;IACrC,IAAIA,MAAM,KAAK,eAAf,EAAgC;MAC9BP,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ;IACT;EACF,CAJD;;EAMA,oBACE,MAAC,QAAD;IACE,OAAO,EAAE;MAAEQ,KAAK,EAAEJ,OAAO,CAACI;IAAjB,CADX;IAEE,IAAI,EAAEV,MAFR;IAGE,OAAO,EAAEO,WAHX;IAIE,cAAc,EAAC,4BAJjB;IAKE,WAAW,EAAEF,kBALf;IAAA,wBAOE,KAAC,aAAD;MAAe,OAAO,EAAC,SAAvB;MAAA,UAAkCP;IAAlC,EAPF,eAQE,KAAC,eAAD;MAAiB,aAAa,MAA9B;MAAA,UAAgCC;IAAhC,EARF,eASE,MAAC,eAAD;MAAA,wBACE,KAAC,QAAD;QAAU,QAAQ,EAAC,OAAnB;QAA2B,OAAO,EAAEE,SAApC;QAAA,UACGE;MADH,EADF,eAIE,KAAC,QAAD;QAAU,EAAE,EAAC,4BAAb;QAA0C,QAAQ,EAAC,OAAnD;QAA2D,OAAO,EAAE,MAAMD,QAAN,aAAMA,QAAN,uBAAMA,QAAQ,EAAlF;QAAA,UACGE;MADH,EAJF;IAAA,EATF;EAAA,EADF;AAoBD,CAtCD;;AAwCA,wCAAAP,kBAAkB,CAACc,SAAnB,GAA+B;EAC7Bb,KAAK,EAAER,SAAS,CAACsB,MADY;EAE7Bb,OAAO,EAAET,SAAS,CAACsB,MAFU;EAG7BZ,MAAM,EAAEV,SAAS,CAACuB,IAHW;EAI7BZ,SAAS,EAAEX,SAAS,CAACwB,IAJQ;EAK7BZ,QAAQ,EAAEZ,SAAS,CAACwB,IALS;EAM7BX,kBAAkB,EAAEb,SAAS,CAACsB,MAND;EAO7BR,iBAAiB,EAAEd,SAAS,CAACsB,MAPA;EAQ7BP,kBAAkB,EAAEf,SAAS,CAACsB;AARD,CAA/B;AAWA,eAAef,kBAAf"}

package/dist/modern/QueryBuilder/ConfirmationDialog/index.js

@@ -0,0 +1,2 @@
+export { default } from "./ConfirmationDialog";
+//# sourceMappingURL=index.js.map

package/dist/modern/QueryBuilder/ConfirmationDialog/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default"],"sources":["../../../../src/QueryBuilder/ConfirmationDialog/index.js"],"sourcesContent":["export { default } from \"./ConfirmationDialog\";\n"],"mappings":"AAAA,SAASA,OAAT,QAAwB,sBAAxB"}

package/dist/modern/QueryBuilder/ConfirmationDialog/styles.js

@@ -0,0 +1,8 @@
+import { makeStyles } from "@mui/styles";
+const useStyles = makeStyles(() => ({
+  paper: {
+    width: 500
+  }
+}));
+export default useStyles;
+//# sourceMappingURL=styles.js.map

package/dist/modern/QueryBuilder/ConfirmationDialog/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","names":["makeStyles","useStyles","paper","width"],"sources":["../../../../src/QueryBuilder/ConfirmationDialog/styles.js"],"sourcesContent":["import { makeStyles } from \"@mui/styles\";\n\nconst useStyles = makeStyles(() => ({\n  paper: {\n    width: 500,\n  },\n}));\n\nexport default useStyles;\n"],"mappings":"AAAA,SAASA,UAAT,QAA2B,aAA3B;AAEA,MAAMC,SAAS,GAAGD,UAAU,CAAC,OAAO;EAClCE,KAAK,EAAE;IACLC,KAAK,EAAE;EADF;AAD2B,CAAP,CAAD,CAA5B;AAMA,eAAeF,SAAf"}