@cgi-learning-hub/ui 1.10.0-dev.1762507820 → 1.10.0-dev.1763111040

package/dist/index.cjs.js

@@ -8773,7 +8773,7 @@ function isClassComponent$1(elementType) {
   } = elementType;
   return Boolean(prototype.isReactComponent);
 }
-function elementTypeAcceptingRef(props, propName, componentName, location, propFullName) {
+function elementTypeAcceptingRef$1(props, propName, componentName, location, propFullName) {
   const propValue = props[propName];
   const safePropName = propFullName || propName;
   if (propValue == null || // When server-side rendering React doesn't warn either.
@@ -8792,7 +8792,7 @@ function elementTypeAcceptingRef(props, propName, componentName, location, propF
   }
   return null;
 }
-const elementTypeAcceptingRef$1 = chainPropTypes(PropTypes.elementType, elementTypeAcceptingRef);
+const elementTypeAcceptingRef = chainPropTypes(PropTypes.elementType, elementTypeAcceptingRef$1);
 function isFocusVisible(element) {
   try {
     return element.matches(":focus-visible");
@@ -10558,7 +10558,7 @@ process.env.NODE_ENV !== "production" ? ButtonBase.propTypes = {
    * The component used for the root node.
    * Either a string to use a HTML element or a component.
    */
-  component: elementTypeAcceptingRef$1,
+  component: elementTypeAcceptingRef,
   /**
    * If `true`, the component is disabled.
    * @default false
@@ -12645,7 +12645,7 @@ process.env.NODE_ENV !== "production" ? Collapse.propTypes = {
    * The component used for the root node.
    * Either a string to use a HTML element or a component.
    */
-  component: elementTypeAcceptingRef$1,
+  component: elementTypeAcceptingRef,
   /**
    * The transition timing function.
    * You may specify a single easing or a object containing enter and exit values.
@@ -15216,7 +15216,7 @@ function isShadowRoot(node2) {
   var OwnElement = getWindow(node2).ShadowRoot;
   return node2 instanceof OwnElement || node2 instanceof ShadowRoot;
 }
-function applyStyles(_ref) {
+function applyStyles$1(_ref) {
   var state = _ref.state;
   Object.keys(state.elements).forEach(function(name) {
     var style2 = state.styles[name] || {};
@@ -15274,11 +15274,11 @@ function effect$2(_ref2) {
     });
   };
 }
-const applyStyles$1 = {
+const applyStyles = {
   name: "applyStyles",
   enabled: true,
   phase: "write",
-  fn: applyStyles,
+  fn: applyStyles$1,
   effect: effect$2,
   requires: ["computeStyles"]
 };
@@ -15464,7 +15464,7 @@ var toPaddingObject = function toPaddingObject2(padding2, state) {
   })) : padding2;
   return mergePaddingObject(typeof padding2 !== "number" ? padding2 : expandToHashMap(padding2, basePlacements));
 };
-function arrow(_ref) {
+function arrow$1(_ref) {
   var _state$modifiersData$;
   var state = _ref.state, name = _ref.name, options = _ref.options;
   var arrowElement = state.elements.arrow;
@@ -15509,11 +15509,11 @@ function effect$1(_ref2) {
   }
   state.elements.arrow = arrowElement;
 }
-const arrow$1 = {
+const arrow = {
   name: "arrow",
   enabled: true,
   phase: "main",
-  fn: arrow,
+  fn: arrow$1,
   effect: effect$1,
   requires: ["popperOffsets"],
   requiresIfExists: ["preventOverflow"]
@@ -15602,7 +15602,7 @@ function mapToStyles(_ref2) {
   }
   return Object.assign({}, commonStyles, (_Object$assign2 = {}, _Object$assign2[sideY] = hasY ? y + "px" : "", _Object$assign2[sideX] = hasX ? x + "px" : "", _Object$assign2.transform = "", _Object$assign2));
 }
-function computeStyles(_ref5) {
+function computeStyles$1(_ref5) {
   var state = _ref5.state, options = _ref5.options;
   var _options$gpuAccelerat = options.gpuAcceleration, gpuAcceleration = _options$gpuAccelerat === void 0 ? true : _options$gpuAccelerat, _options$adaptive = options.adaptive, adaptive = _options$adaptive === void 0 ? true : _options$adaptive, _options$roundOffsets = options.roundOffsets, roundOffsets = _options$roundOffsets === void 0 ? true : _options$roundOffsets;
   var commonStyles = {
@@ -15633,11 +15633,11 @@ function computeStyles(_ref5) {
     "data-popper-placement": state.placement
   });
 }
-const computeStyles$1 = {
+const computeStyles = {
   name: "computeStyles",
   enabled: true,
   phase: "beforeWrite",
-  fn: computeStyles,
+  fn: computeStyles$1,
   data: {}
 };
 var passive = {
@@ -15953,7 +15953,7 @@ function getExpandedFallbackPlacements(placement) {
   var oppositePlacement = getOppositePlacement(placement);
   return [getOppositeVariationPlacement(placement), oppositePlacement, getOppositeVariationPlacement(oppositePlacement)];
 }
-function flip(_ref) {
+function flip$1(_ref) {
   var state = _ref.state, options = _ref.options, name = _ref.name;
   if (state.modifiersData[name]._skip) {
     return;
@@ -16039,11 +16039,11 @@ function flip(_ref) {
     state.reset = true;
   }
 }
-const flip$1 = {
+const flip = {
   name: "flip",
   enabled: true,
   phase: "main",
-  fn: flip,
+  fn: flip$1,
   requiresIfExists: ["offset"],
   data: {
     _skip: false
@@ -16068,7 +16068,7 @@ function isAnySideFullyClipped(overflow) {
     return overflow[side] >= 0;
   });
 }
-function hide(_ref) {
+function hide$1(_ref) {
   var state = _ref.state, name = _ref.name;
   var referenceRect = state.rects.reference;
   var popperRect = state.rects.popper;
@@ -16094,12 +16094,12 @@ function hide(_ref) {
     "data-popper-escaped": hasPopperEscaped
   });
 }
-const hide$1 = {
+const hide = {
   name: "hide",
   enabled: true,
   phase: "main",
   requiresIfExists: ["preventOverflow"],
-  fn: hide
+  fn: hide$1
 };
 function distanceAndSkiddingToXY(placement, rects, offset2) {
   var basePlacement = getBasePlacement(placement);
@@ -16117,7 +16117,7 @@ function distanceAndSkiddingToXY(placement, rects, offset2) {
     y: distance
   };
 }
-function offset(_ref2) {
+function offset$1(_ref2) {
   var state = _ref2.state, options = _ref2.options, name = _ref2.name;
   var _options$offset = options.offset, offset2 = _options$offset === void 0 ? [0, 0] : _options$offset;
   var data = placements.reduce(function(acc, placement) {
@@ -16131,14 +16131,14 @@ function offset(_ref2) {
   }
   state.modifiersData[name] = data;
 }
-const offset$1 = {
+const offset = {
   name: "offset",
   enabled: true,
   phase: "main",
   requires: ["popperOffsets"],
-  fn: offset
+  fn: offset$1
 };
-function popperOffsets(_ref) {
+function popperOffsets$1(_ref) {
   var state = _ref.state, name = _ref.name;
   state.modifiersData[name] = computeOffsets({
     reference: state.rects.reference,
@@ -16146,17 +16146,17 @@ function popperOffsets(_ref) {
     placement: state.placement
   });
 }
-const popperOffsets$1 = {
+const popperOffsets = {
   name: "popperOffsets",
   enabled: true,
   phase: "read",
-  fn: popperOffsets,
+  fn: popperOffsets$1,
   data: {}
 };
 function getAltAxis(axis) {
   return axis === "x" ? "y" : "x";
 }
-function preventOverflow(_ref) {
+function preventOverflow$1(_ref) {
   var state = _ref.state, options = _ref.options, name = _ref.name;
   var _options$mainAxis = options.mainAxis, checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis, _options$altAxis = options.altAxis, checkAltAxis = _options$altAxis === void 0 ? false : _options$altAxis, boundary = options.boundary, rootBoundary = options.rootBoundary, altBoundary = options.altBoundary, padding2 = options.padding, _options$tether = options.tether, tether = _options$tether === void 0 ? true : _options$tether, _options$tetherOffset = options.tetherOffset, tetherOffset = _options$tetherOffset === void 0 ? 0 : _options$tetherOffset;
   var overflow = detectOverflow(state, {
@@ -16240,11 +16240,11 @@ function preventOverflow(_ref) {
   }
   state.modifiersData[name] = data;
 }
-const preventOverflow$1 = {
+const preventOverflow = {
   name: "preventOverflow",
   enabled: true,
   phase: "main",
-  fn: preventOverflow,
+  fn: preventOverflow$1,
   requiresIfExists: ["offset"]
 };
 function getHTMLElementScroll(element) {
@@ -16502,7 +16502,7 @@ function popperGenerator(generatorOptions) {
     return instance;
   };
 }
-var defaultModifiers = [eventListeners, popperOffsets$1, computeStyles$1, applyStyles$1, offset$1, flip$1, preventOverflow$1, arrow$1, hide$1];
+var defaultModifiers = [eventListeners, popperOffsets, computeStyles, applyStyles, offset, flip, preventOverflow, arrow, hide];
 var createPopper = /* @__PURE__ */ popperGenerator({
   defaultModifiers
 });
@@ -19305,7 +19305,7 @@ process.env.NODE_ENV !== "production" ? InputBase.propTypes = {
    * Either a string to use a HTML element or a component.
    * @default 'input'
    */
-  inputComponent: elementTypeAcceptingRef$1,
+  inputComponent: elementTypeAcceptingRef,
   /**
    * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input#attributes) applied to the `input` element.
    * @default {}
@@ -28895,7 +28895,7 @@ process.env.NODE_ENV !== "production" ? Link.propTypes = {
    * The component used for the root node.
    * Either a string to use a HTML element or a component.
    */
-  component: elementTypeAcceptingRef$1,
+  component: elementTypeAcceptingRef,
   /**
    * @ignore
    */
@@ -29689,7 +29689,7 @@ process.env.NODE_ENV !== "production" ? ListItem.propTypes = {
    * @default 'li'
    * @deprecated Use the `component` or `slots.root` prop instead. This prop will be removed in a future major release. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
    */
-  ContainerComponent: elementTypeAcceptingRef$1,
+  ContainerComponent: elementTypeAcceptingRef,
   /**
    * Props applied to the container component if used.
    * @default {}
@@ -30758,7 +30758,7 @@ process.env.NODE_ENV !== "production" ? Popover.propTypes = {
    * @default {}
    */
   PaperProps: PropTypes.shape({
-    component: elementTypeAcceptingRef$1
+    component: elementTypeAcceptingRef
   }),
   /**
    * The props used for each slot inside.
@@ -43077,10 +43077,7 @@ const CheckmarkSwatch = ({
     }
   );
 };
-const ColorPickerIcon = ({
-  fill,
-  onClick
-}) => /* @__PURE__ */ jsxRuntime.jsxs(
+const ColorPickerIcon = ({ fill, onClick, showBorder = false }) => /* @__PURE__ */ jsxRuntime.jsxs(
   "svg",
   {
     width: "100%",
@@ -43099,6 +43096,17 @@ const ColorPickerIcon = ({
             fill: fill ?? "#EB4D4B"
           }
         ),
+        showBorder && /* @__PURE__ */ jsxRuntime.jsx(
+          "circle",
+          {
+            cx: "20",
+            cy: "20.2168",
+            r: "10",
+            fill: "none",
+            stroke: "black",
+            strokeWidth: "1.5"
+          }
+        ),
         /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "29", cy: "28.2168", r: "5", fill: "white" }),
         /* @__PURE__ */ jsxRuntime.jsx(
           "path",
@@ -43176,6 +43184,7 @@ const ColorPicker = ({
   const normalizedOptions = options ? options.map(
     (option) => typeof option === "string" ? { color: option, showBorder: false } : { ...option, showBorder: option.showBorder ?? false }
   ) : DEFAULT_COLOR_OPTIONS;
+  const currentOption = normalizedOptions.find((opt) => opt.color === value);
   const colorStrings = normalizedOptions.map((opt) => opt.color);
   return /* @__PURE__ */ jsxRuntime.jsx(
     material.ClickAwayListener,
@@ -43189,7 +43198,14 @@ const ColorPicker = ({
           tabIndex: 0,
           onKeyDown: handleKeyDown,
           children: [
-            /* @__PURE__ */ jsxRuntime.jsx(ColorPickerIcon, { onClick: handlePickerToggle, fill: value }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ColorPickerIcon,
+              {
+                onClick: handlePickerToggle,
+                fill: value,
+                showBorder: (currentOption == null ? void 0 : currentOption.showBorder) ?? false
+              }
+            ),
             isCirclePickerVisible && /* @__PURE__ */ jsxRuntime.jsx(
               material.Box,
               {
@@ -43238,7 +43254,7 @@ var hasRequiredWeekOfYear;
 function requireWeekOfYear() {
   if (hasRequiredWeekOfYear) return weekOfYear$1.exports;
   hasRequiredWeekOfYear = 1;
-  (function(module2, exports2) {
+  (function(module2, exports$1) {
     !(function(e, t) {
       module2.exports = t();
     })(weekOfYear, (function() {
@@ -43270,7 +43286,7 @@ var hasRequiredCustomParseFormat;
 function requireCustomParseFormat() {
   if (hasRequiredCustomParseFormat) return customParseFormat$1.exports;
   hasRequiredCustomParseFormat = 1;
-  (function(module2, exports2) {
+  (function(module2, exports$1) {
     !(function(e, t) {
       module2.exports = t();
     })(customParseFormat, (function() {
@@ -43402,7 +43418,7 @@ var hasRequiredLocalizedFormat;
 function requireLocalizedFormat() {
   if (hasRequiredLocalizedFormat) return localizedFormat$1.exports;
   hasRequiredLocalizedFormat = 1;
-  (function(module2, exports2) {
+  (function(module2, exports$1) {
     !(function(e, t) {
       module2.exports = t();
     })(localizedFormat, (function() {
@@ -43434,7 +43450,7 @@ var hasRequiredIsBetween;
 function requireIsBetween() {
   if (hasRequiredIsBetween) return isBetween$1.exports;
   hasRequiredIsBetween = 1;
-  (function(module2, exports2) {
+  (function(module2, exports$1) {
     !(function(e, i) {
       module2.exports = i();
     })(isBetween, (function() {
@@ -43456,7 +43472,7 @@ var hasRequiredAdvancedFormat;
 function requireAdvancedFormat() {
   if (hasRequiredAdvancedFormat) return advancedFormat$1.exports;
   hasRequiredAdvancedFormat = 1;
-  (function(module2, exports2) {
+  (function(module2, exports$1) {
     !(function(e, t) {
       module2.exports = t();
     })(advancedFormat, (function() {
@@ -56374,7 +56390,7 @@ var hasRequiredEn;
 function requireEn() {
   if (hasRequiredEn) return en$1.exports;
   hasRequiredEn = 1;
-  (function(module2, exports2) {
+  (function(module2, exports$1) {
     !(function(e, n) {
       module2.exports = n();
     })(en, (function() {
@@ -56393,7 +56409,7 @@ var hasRequiredFr;
 function requireFr() {
   if (hasRequiredFr) return fr$1.exports;
   hasRequiredFr = 1;
-  (function(module2, exports2) {
+  (function(module2, exports$1) {
     !(function(e, n) {
       module2.exports = n(dayjs);
     })(fr, (function(e) {
@@ -57154,14 +57170,14 @@ const ImagePicker = ({
     open();
   };
   const { open, getRootProps, getInputProps, isDragActive } = reactDropzone.useDropzone({
-    ...otherProps,
     maxFiles: 1,
     onDropAccepted: handleDrop,
     accept: {
       "image/*": [".png", ".jpeg", ".jpg", ".gif"]
     },
     noClick: true,
-    disabled
+    disabled,
+    ...otherProps
   });
   return /* @__PURE__ */ jsxRuntime.jsxs(
     Stack,

package/dist/index.es.js

@@ -43060,10 +43060,7 @@ const CheckmarkSwatch = ({
     }
   );
 };
-const ColorPickerIcon = ({
-  fill,
-  onClick
-}) => /* @__PURE__ */ jsxs(
+const ColorPickerIcon = ({ fill, onClick, showBorder = false }) => /* @__PURE__ */ jsxs(
   "svg",
   {
     width: "100%",
@@ -43082,6 +43079,17 @@ const ColorPickerIcon = ({
             fill: fill ?? "#EB4D4B"
           }
         ),
+        showBorder && /* @__PURE__ */ jsx(
+          "circle",
+          {
+            cx: "20",
+            cy: "20.2168",
+            r: "10",
+            fill: "none",
+            stroke: "black",
+            strokeWidth: "1.5"
+          }
+        ),
         /* @__PURE__ */ jsx("circle", { cx: "29", cy: "28.2168", r: "5", fill: "white" }),
         /* @__PURE__ */ jsx(
           "path",
@@ -43159,6 +43167,7 @@ const ColorPicker = ({
   const normalizedOptions = options ? options.map(
     (option) => typeof option === "string" ? { color: option, showBorder: false } : { ...option, showBorder: option.showBorder ?? false }
   ) : DEFAULT_COLOR_OPTIONS;
+  const currentOption = normalizedOptions.find((opt) => opt.color === value);
   const colorStrings = normalizedOptions.map((opt) => opt.color);
   return /* @__PURE__ */ jsx(
     ClickAwayListener$1,
@@ -43172,7 +43181,14 @@ const ColorPicker = ({
           tabIndex: 0,
           onKeyDown: handleKeyDown,
           children: [
-            /* @__PURE__ */ jsx(ColorPickerIcon, { onClick: handlePickerToggle, fill: value }),
+            /* @__PURE__ */ jsx(
+              ColorPickerIcon,
+              {
+                onClick: handlePickerToggle,
+                fill: value,
+                showBorder: (currentOption == null ? void 0 : currentOption.showBorder) ?? false
+              }
+            ),
             isCirclePickerVisible && /* @__PURE__ */ jsx(
               Box$1,
               {
@@ -43221,7 +43237,7 @@ var hasRequiredWeekOfYear;
 function requireWeekOfYear() {
   if (hasRequiredWeekOfYear) return weekOfYear$1.exports;
   hasRequiredWeekOfYear = 1;
-  (function(module, exports) {
+  (function(module, exports$1) {
     !(function(e, t) {
       module.exports = t();
     })(weekOfYear, (function() {
@@ -43253,7 +43269,7 @@ var hasRequiredCustomParseFormat;
 function requireCustomParseFormat() {
   if (hasRequiredCustomParseFormat) return customParseFormat$1.exports;
   hasRequiredCustomParseFormat = 1;
-  (function(module, exports) {
+  (function(module, exports$1) {
     !(function(e, t) {
       module.exports = t();
     })(customParseFormat, (function() {
@@ -43385,7 +43401,7 @@ var hasRequiredLocalizedFormat;
 function requireLocalizedFormat() {
   if (hasRequiredLocalizedFormat) return localizedFormat$1.exports;
   hasRequiredLocalizedFormat = 1;
-  (function(module, exports) {
+  (function(module, exports$1) {
     !(function(e, t) {
       module.exports = t();
     })(localizedFormat, (function() {
@@ -43417,7 +43433,7 @@ var hasRequiredIsBetween;
 function requireIsBetween() {
   if (hasRequiredIsBetween) return isBetween$1.exports;
   hasRequiredIsBetween = 1;
-  (function(module, exports) {
+  (function(module, exports$1) {
     !(function(e, i) {
       module.exports = i();
     })(isBetween, (function() {
@@ -43439,7 +43455,7 @@ var hasRequiredAdvancedFormat;
 function requireAdvancedFormat() {
   if (hasRequiredAdvancedFormat) return advancedFormat$1.exports;
   hasRequiredAdvancedFormat = 1;
-  (function(module, exports) {
+  (function(module, exports$1) {
     !(function(e, t) {
       module.exports = t();
     })(advancedFormat, (function() {
@@ -56357,7 +56373,7 @@ var hasRequiredEn;
 function requireEn() {
   if (hasRequiredEn) return en$1.exports;
   hasRequiredEn = 1;
-  (function(module, exports) {
+  (function(module, exports$1) {
     !(function(e, n) {
       module.exports = n();
     })(en, (function() {
@@ -56376,7 +56392,7 @@ var hasRequiredFr;
 function requireFr() {
   if (hasRequiredFr) return fr$1.exports;
   hasRequiredFr = 1;
-  (function(module, exports) {
+  (function(module, exports$1) {
     !(function(e, n) {
       module.exports = n(dayjs);
     })(fr, (function(e) {
@@ -57137,14 +57153,14 @@ const ImagePicker = ({
     open();
   };
   const { open, getRootProps, getInputProps, isDragActive } = useDropzone({
-    ...otherProps,
     maxFiles: 1,
     onDropAccepted: handleDrop,
     accept: {
       "image/*": [".png", ".jpeg", ".jpg", ".gif"]
     },
     noClick: true,
-    disabled
+    disabled,
+    ...otherProps
   });
   return /* @__PURE__ */ jsxs(
     Stack,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cgi-learning-hub/ui",
-  "version": "1.10.0-dev.1762507820",
+  "version": "1.10.0-dev.1763111040",
   "description": "React component library for Hub's design system, built on Material UI with custom and extended components.",
   "keywords": [
     "cgi-learning-hub",