@drivy/cobalt 2.0.0-beta.6 → 2.0.0-beta.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -9,11 +9,13 @@ const ModalFooterAPI = (_props) => null;
9
9
  const isModalFooterAPIComponent = (component) => React.isValidElement(component) && component.type === ModalFooterAPI;
10
10
  const Modal = forwardRef(({ isOpen, close, className, initialFocusRef, ["aria-label"]: ariaLabel, title, children, overflowHidden = true, bodySpacing = true, fullWidth, fullHeight, onHidden, onShow, skipAnimation, onDismissAttempt, }, ref) => {
11
11
  useEffect(() => {
12
- isOpen ? onShow === null || onShow === void 0 ? void 0 : onShow() : close === null || close === void 0 ? void 0 : close();
13
- }, [onShow, isOpen, close]);
12
+ isOpen && (onShow === null || onShow === void 0 ? void 0 : onShow());
13
+ }, [onShow, isOpen]);
14
14
  const modalFooter = React.Children.toArray(children).find((c) => isModalFooterAPIComponent(c));
15
15
  const hasFooter = isValidElement(modalFooter);
16
- return (React.createElement(Dialog.Root, { "aria-label": ariaLabel, open: isOpen, onExitComplete: onHidden, initialFocusEl: initialFocusRef && (() => initialFocusRef.current), onPointerDownOutside: close ? undefined : onDismissAttempt, lazyMount: true,
16
+ return (React.createElement(Dialog.Root, { "aria-label": ariaLabel, open: isOpen, onOpenChange: (e) => {
17
+ e.open ? onShow === null || onShow === void 0 ? void 0 : onShow() : close === null || close === void 0 ? void 0 : close();
18
+ }, onExitComplete: onHidden, initialFocusEl: initialFocusRef && (() => initialFocusRef.current), onPointerDownOutside: close ? undefined : onDismissAttempt, lazyMount: true,
17
19
  // For some reason, onHidden can sometimes not be called if we use unmountOnExit
18
20
  unmountOnExit: !onHidden },
19
21
  React.createElement(Portal, null,
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/components/Modal/index.tsx"],"sourcesContent":["import React, { isValidElement, useEffect, forwardRef } from \"react\"\nimport { Dialog, Portal } from \"@ark-ui/react\"\nimport cx from \"classnames\"\n\nimport ModalHeader from \"./ModalHeader\"\nimport ModalFooter, { ModalFooterPropsType } from \"./ModalFooter\"\n\nexport type ModalPropsType = {\n /**\n * mandatory for A11y\n */\n [\"aria-label\"]: string\n /**\n * Function called to close the modal, providing it make the modal closeable\n */\n close?: () => void\n /**\n * React.ref of the element to focus first when the modal opens\n */\n initialFocusRef?: React.RefObject<HTMLElement>\n /**\n * State to show or hide the modal/dialog\n */\n isOpen: boolean\n /**\n * Custom css classes to add to the modal\n */\n className?: string\n /**\n * Action to fire if the user try to dismiss when the modal is not closeable\n */\n onDismissAttempt?: () => void\n /**\n * Listener called when the modal has been fully hidden\n */\n onHidden?: () => void\n /**\n * Listener called when the modal begins to show\n */\n onShow?: () => void\n /**\n * Modal title\n */\n title?: React.ReactNode\n /**\n * Disable/Enable body paddings (enabled by default)\n */\n bodySpacing?: boolean\n /**\n * Disable/Enable hidding overflowing absolute elements (enabled by default)\n */\n overflowHidden?: boolean\n /**\n * Disable enter/leave animation (animation enabled by default)\n */\n skipAnimation?: {\n enter: boolean\n leave: boolean\n }\n /**\n * Disable modal max-width limit\n */\n fullWidth?: boolean\n /**\n * Always take the full height of the screen\n */\n fullHeight?: boolean\n /**\n * Remove the modal from the DOM on hidden (enabled by default)\n */\n unmountOnHidden?: boolean\n /**\n * Modal body content\n */\n children: React.ReactNode\n}\n\n// Only for the API, render nothing, we use ModalFooterInternal internally\nexport const ModalFooterAPI = (_props: ModalFooterPropsType) => null\n\nexport const isModalFooterAPIComponent = (\n component: React.ReactNode\n): component is React.ReactElement<ModalFooterPropsType> =>\n React.isValidElement(component) && component.type === ModalFooterAPI\n\nconst Modal = forwardRef<HTMLDivElement, ModalPropsType>(\n (\n {\n isOpen,\n close,\n className,\n initialFocusRef,\n [\"aria-label\"]: ariaLabel,\n title,\n children,\n overflowHidden = true,\n bodySpacing = true,\n fullWidth,\n fullHeight,\n onHidden,\n onShow,\n skipAnimation,\n onDismissAttempt,\n }: ModalPropsType,\n ref\n ) => {\n useEffect(() => {\n isOpen ? onShow?.() : close?.()\n }, [onShow, isOpen, close])\n\n const modalFooter = React.Children.toArray(children).find((c) =>\n isModalFooterAPIComponent(c)\n )\n const hasFooter = isValidElement(modalFooter)\n\n return (\n <Dialog.Root\n aria-label={ariaLabel}\n open={isOpen}\n onExitComplete={onHidden}\n initialFocusEl={initialFocusRef && (() => initialFocusRef.current)}\n onPointerDownOutside={close ? undefined : onDismissAttempt}\n lazyMount\n // For some reason, onHidden can sometimes not be called if we use unmountOnExit\n unmountOnExit={!onHidden}\n >\n <Portal>\n <Dialog.Backdrop\n className={cx(\"cobalt-modal__overlay\", {\n \"cobalt-modal--skipAnimation__enter\": skipAnimation?.enter,\n \"cobalt-modal--skipAnimation__leave\": skipAnimation?.leave,\n })}\n >\n <Dialog.Positioner\n className={cx(\"cobalt-modal\", {\n \"cobalt-modal--overflowHidden\": overflowHidden,\n \"cobalt-modal--fullHeight\": fullHeight,\n \"cobalt-modal--fullWidth\": fullWidth,\n })}\n ref={ref}\n >\n <Dialog.Content\n className={cx(\"cobalt-modal__content\", className, {\n \"cobalt-modal--skipAnimation__enter\": skipAnimation?.enter,\n \"cobalt-modal--skipAnimation__leave\": skipAnimation?.leave,\n })}\n >\n <ModalHeader title={title} close={close} />\n <Dialog.Description className=\"cobalt-modal-body__wrapper\">\n <div\n className={cx(\"cobalt-modal-body\", {\n \"cobalt-modal-body--bodySpacing\": bodySpacing,\n \"cobalt-modal-body--hasFooter\": hasFooter,\n })}\n >\n {children}\n </div>\n {hasFooter && <ModalFooter {...modalFooter.props} />}\n </Dialog.Description>\n </Dialog.Content>\n </Dialog.Positioner>\n </Dialog.Backdrop>\n </Portal>\n </Dialog.Root>\n )\n }\n)\n\nModal.displayName = \"Modal\"\n\nexport default Object.assign(Modal, { Footer: ModalFooterAPI })\n\nexport { default as MultiStepModal, type ModalStepType } from \"./MultiStepModal\"\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../../../src/components/Modal/index.tsx"],"sourcesContent":["import React, { isValidElement, useEffect, forwardRef } from \"react\"\nimport { Dialog, Portal } from \"@ark-ui/react\"\nimport cx from \"classnames\"\n\nimport ModalHeader from \"./ModalHeader\"\nimport ModalFooter, { ModalFooterPropsType } from \"./ModalFooter\"\n\nexport type ModalPropsType = {\n /**\n * mandatory for A11y\n */\n [\"aria-label\"]: string\n /**\n * Function called to close the modal, providing it make the modal closeable\n */\n close?: () => void\n /**\n * React.ref of the element to focus first when the modal opens\n */\n initialFocusRef?: React.RefObject<HTMLElement>\n /**\n * State to show or hide the modal/dialog\n */\n isOpen: boolean\n /**\n * Custom css classes to add to the modal\n */\n className?: string\n /**\n * Action to fire if the user try to dismiss when the modal is not closeable\n */\n onDismissAttempt?: () => void\n /**\n * Listener called when the modal has been fully hidden\n */\n onHidden?: () => void\n /**\n * Listener called when the modal begins to show\n */\n onShow?: () => void\n /**\n * Modal title\n */\n title?: React.ReactNode\n /**\n * Disable/Enable body paddings (enabled by default)\n */\n bodySpacing?: boolean\n /**\n * Disable/Enable hidding overflowing absolute elements (enabled by default)\n */\n overflowHidden?: boolean\n /**\n * Disable enter/leave animation (animation enabled by default)\n */\n skipAnimation?: {\n enter: boolean\n leave: boolean\n }\n /**\n * Disable modal max-width limit\n */\n fullWidth?: boolean\n /**\n * Always take the full height of the screen\n */\n fullHeight?: boolean\n /**\n * Remove the modal from the DOM on hidden (enabled by default)\n */\n unmountOnHidden?: boolean\n /**\n * Modal body content\n */\n children: React.ReactNode\n}\n\n// Only for the API, render nothing, we use ModalFooterInternal internally\nexport const ModalFooterAPI = (_props: ModalFooterPropsType) => null\n\nexport const isModalFooterAPIComponent = (\n component: React.ReactNode\n): component is React.ReactElement<ModalFooterPropsType> =>\n React.isValidElement(component) && component.type === ModalFooterAPI\n\nconst Modal = forwardRef<HTMLDivElement, ModalPropsType>(\n (\n {\n isOpen,\n close,\n className,\n initialFocusRef,\n [\"aria-label\"]: ariaLabel,\n title,\n children,\n overflowHidden = true,\n bodySpacing = true,\n fullWidth,\n fullHeight,\n onHidden,\n onShow,\n skipAnimation,\n onDismissAttempt,\n }: ModalPropsType,\n ref\n ) => {\n useEffect(() => {\n isOpen && onShow?.()\n }, [onShow, isOpen])\n\n const modalFooter = React.Children.toArray(children).find((c) =>\n isModalFooterAPIComponent(c)\n )\n const hasFooter = isValidElement(modalFooter)\n\n return (\n <Dialog.Root\n aria-label={ariaLabel}\n open={isOpen}\n onOpenChange={(e) => {\n e.open ? onShow?.() : close?.()\n }}\n onExitComplete={onHidden}\n initialFocusEl={initialFocusRef && (() => initialFocusRef.current)}\n onPointerDownOutside={close ? undefined : onDismissAttempt}\n lazyMount\n // For some reason, onHidden can sometimes not be called if we use unmountOnExit\n unmountOnExit={!onHidden}\n >\n <Portal>\n <Dialog.Backdrop\n className={cx(\"cobalt-modal__overlay\", {\n \"cobalt-modal--skipAnimation__enter\": skipAnimation?.enter,\n \"cobalt-modal--skipAnimation__leave\": skipAnimation?.leave,\n })}\n >\n <Dialog.Positioner\n className={cx(\"cobalt-modal\", {\n \"cobalt-modal--overflowHidden\": overflowHidden,\n \"cobalt-modal--fullHeight\": fullHeight,\n \"cobalt-modal--fullWidth\": fullWidth,\n })}\n ref={ref}\n >\n <Dialog.Content\n className={cx(\"cobalt-modal__content\", className, {\n \"cobalt-modal--skipAnimation__enter\": skipAnimation?.enter,\n \"cobalt-modal--skipAnimation__leave\": skipAnimation?.leave,\n })}\n >\n <ModalHeader title={title} close={close} />\n <Dialog.Description className=\"cobalt-modal-body__wrapper\">\n <div\n className={cx(\"cobalt-modal-body\", {\n \"cobalt-modal-body--bodySpacing\": bodySpacing,\n \"cobalt-modal-body--hasFooter\": hasFooter,\n })}\n >\n {children}\n </div>\n {hasFooter && <ModalFooter {...modalFooter.props} />}\n </Dialog.Description>\n </Dialog.Content>\n </Dialog.Positioner>\n </Dialog.Backdrop>\n </Portal>\n </Dialog.Root>\n )\n }\n)\n\nModal.displayName = \"Modal\"\n\nexport default Object.assign(Modal, { Footer: ModalFooterAPI })\n\nexport { default as MultiStepModal, type ModalStepType } from \"./MultiStepModal\"\n"],"names":[],"mappings":"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"}
@@ -5,7 +5,7 @@ import '../Icon/index.js';
5
5
  import StarIcon from '../Icon/__generated__/StarIcon.js';
6
6
 
7
7
  const defaultRatingIcon = React.createElement(StarIcon, { color: "primary" });
8
- const itemEmptyColor = "onSurfaceDisabled";
8
+ const itemEmptyColor = "surfaceContainerVariant";
9
9
  function roundHalf(num) {
10
10
  const temp = num * 2;
11
11
  return temp % 1 === 0.5 ? Math.floor(temp) / 2 : Math.round(temp) / 2;
@@ -1 +1 @@
1
- {"version":3,"file":"RatingIcons.js","sources":["../../../src/components/Rating/RatingIcons.tsx"],"sourcesContent":["import React, { useState, useRef, useCallback } from \"react\"\nimport { nanoid } from \"nanoid\"\nimport cx from \"classnames\"\nimport { IconProps, StarIcon } from \"../Icon\"\n\nexport type RatingIconsPropsType = {\n className?: string\n max?: 5 | 10\n value: number\n size?: IconProps[\"size\"] | 48\n editable?: boolean\n disabled?: boolean\n onChange?: (newValue: number) => void\n icon?: JSX.Element | JSX.Element[]\n}\n\nexport type RatingIconPropsType = {\n icon: JSX.Element\n status?: \"full\" | \"half\" | \"empty\"\n size?: RatingIconsPropsType[\"size\"]\n}\n\nexport const defaultRatingIcon = <StarIcon color=\"primary\" />\nconst itemEmptyColor: IconProps[\"color\"] = \"onSurfaceDisabled\"\n\nexport function roundHalf(num: number) {\n const temp = num * 2\n return temp % 1 === 0.5 ? Math.floor(temp) / 2 : Math.round(temp) / 2\n}\n\nexport function computeItemStatus(\n ratingValue: number,\n itemValue: number,\n icon: RatingIconsPropsType[\"icon\"]\n): RatingIconPropsType[\"status\"] {\n let itemStatus: RatingIconPropsType[\"status\"] = \"empty\"\n if (!Array.isArray(icon)) {\n // gauge\n const isHalfItem = itemValue > ratingValue && ratingValue > itemValue - 1\n if (isHalfItem) {\n itemStatus = \"half\"\n } else if (itemValue <= ratingValue) {\n itemStatus = \"full\"\n }\n } else if (itemValue === ratingValue) {\n // radio\n itemStatus = \"full\"\n }\n\n return itemStatus\n}\n\nexport const RatingIcon = ({\n icon,\n status = \"full\",\n size = 24,\n}: RatingIconPropsType) => {\n if (status === \"half\") {\n return (\n <>\n {React.cloneElement(icon, {\n color: itemEmptyColor,\n size,\n })}\n <div className=\"cobalt-rating-icons__icon-half-container\">\n {React.cloneElement(icon, { size })}\n </div>\n </>\n )\n } else {\n const iconColor: IconProps[\"color\"] =\n status === \"empty\" ? itemEmptyColor : icon.props.color\n\n return React.cloneElement(icon, {\n color: iconColor,\n size,\n })\n }\n}\n\nexport const RatingIcons = ({\n className,\n max = 5,\n value,\n size = 24,\n editable = false,\n onChange,\n icon = defaultRatingIcon,\n}: RatingIconsPropsType) => {\n const name = useRef(nanoid())\n\n const items = useRef(\n Array.from(new Array(Array.isArray(icon) ? icon.length : max))\n )\n\n const [ratingValue, setRatingValue] = useState(() =>\n editable ? Math.floor(value) : roundHalf(value)\n )\n const [selectedIndex, setSelectedIndex] = useState(-1) // used to enforce selection effect (icon scale reset)\n\n const resetSelection = useCallback(() => {\n setSelectedIndex(-1)\n }, [])\n\n const itemSize = size === 48 ? 16 : size\n\n // input element is used for a11y purpose ( focus feedback and keyboard selection )\n return (\n <div\n className={cx(\"cobalt-rating-icons\", className, {\n \"cobalt-rating-icons--icon-size-48\": size === 48,\n })}\n onPointerLeave={() => {\n if (editable) {\n ;(document.activeElement as HTMLInputElement).blur()\n }\n }}\n >\n {items.current.map((_value, idx) => {\n const itemValue = idx + 1\n\n const itemStatus = computeItemStatus(ratingValue, itemValue, icon)\n\n return (\n <label\n className={cx(\"cobalt-rating-icons__icon-wrapper\", {\n \"cobalt-rating-icons__icon-wrapper--selected\":\n selectedIndex === idx,\n })}\n key={idx}\n onClick={() => {\n if (editable) {\n setRatingValue(itemValue)\n setSelectedIndex(idx)\n }\n }}\n onMouseEnter={(e) => {\n if (editable) {\n ;(e.target as HTMLElement).focus()\n\n resetSelection()\n }\n }}\n >\n <input\n tabIndex={\n editable &&\n (ratingValue === itemValue ||\n (ratingValue === 0 && itemValue === 1))\n ? 0\n : -1\n }\n name={name.current}\n type=\"radio\"\n value={itemValue}\n onChange={() => {\n onChange && onChange(itemValue)\n }}\n disabled={!editable}\n />\n {\n <RatingIcon\n icon={Array.isArray(icon) ? icon[idx] : icon}\n status={itemStatus}\n size={itemSize}\n />\n }\n </label>\n )\n })}\n </div>\n )\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"RatingIcons.js","sources":["../../../src/components/Rating/RatingIcons.tsx"],"sourcesContent":["import React, { useState, useRef, useCallback } from \"react\"\nimport { nanoid } from \"nanoid\"\nimport cx from \"classnames\"\nimport { IconProps, StarIcon } from \"../Icon\"\n\nexport type RatingIconsPropsType = {\n className?: string\n max?: 5 | 10\n value: number\n size?: IconProps[\"size\"] | 48\n editable?: boolean\n disabled?: boolean\n onChange?: (newValue: number) => void\n icon?: JSX.Element | JSX.Element[]\n}\n\nexport type RatingIconPropsType = {\n icon: JSX.Element\n status?: \"full\" | \"half\" | \"empty\"\n size?: RatingIconsPropsType[\"size\"]\n}\n\nexport const defaultRatingIcon = <StarIcon color=\"primary\" />\nconst itemEmptyColor: IconProps[\"color\"] = \"surfaceContainerVariant\"\n\nexport function roundHalf(num: number) {\n const temp = num * 2\n return temp % 1 === 0.5 ? Math.floor(temp) / 2 : Math.round(temp) / 2\n}\n\nexport function computeItemStatus(\n ratingValue: number,\n itemValue: number,\n icon: RatingIconsPropsType[\"icon\"]\n): RatingIconPropsType[\"status\"] {\n let itemStatus: RatingIconPropsType[\"status\"] = \"empty\"\n if (!Array.isArray(icon)) {\n // gauge\n const isHalfItem = itemValue > ratingValue && ratingValue > itemValue - 1\n if (isHalfItem) {\n itemStatus = \"half\"\n } else if (itemValue <= ratingValue) {\n itemStatus = \"full\"\n }\n } else if (itemValue === ratingValue) {\n // radio\n itemStatus = \"full\"\n }\n\n return itemStatus\n}\n\nexport const RatingIcon = ({\n icon,\n status = \"full\",\n size = 24,\n}: RatingIconPropsType) => {\n if (status === \"half\") {\n return (\n <>\n {React.cloneElement(icon, {\n color: itemEmptyColor,\n size,\n })}\n <div className=\"cobalt-rating-icons__icon-half-container\">\n {React.cloneElement(icon, { size })}\n </div>\n </>\n )\n } else {\n const iconColor: IconProps[\"color\"] =\n status === \"empty\" ? itemEmptyColor : icon.props.color\n\n return React.cloneElement(icon, {\n color: iconColor,\n size,\n })\n }\n}\n\nexport const RatingIcons = ({\n className,\n max = 5,\n value,\n size = 24,\n editable = false,\n onChange,\n icon = defaultRatingIcon,\n}: RatingIconsPropsType) => {\n const name = useRef(nanoid())\n\n const items = useRef(\n Array.from(new Array(Array.isArray(icon) ? icon.length : max))\n )\n\n const [ratingValue, setRatingValue] = useState(() =>\n editable ? Math.floor(value) : roundHalf(value)\n )\n const [selectedIndex, setSelectedIndex] = useState(-1) // used to enforce selection effect (icon scale reset)\n\n const resetSelection = useCallback(() => {\n setSelectedIndex(-1)\n }, [])\n\n const itemSize = size === 48 ? 16 : size\n\n // input element is used for a11y purpose ( focus feedback and keyboard selection )\n return (\n <div\n className={cx(\"cobalt-rating-icons\", className, {\n \"cobalt-rating-icons--icon-size-48\": size === 48,\n })}\n onPointerLeave={() => {\n if (editable) {\n ;(document.activeElement as HTMLInputElement).blur()\n }\n }}\n >\n {items.current.map((_value, idx) => {\n const itemValue = idx + 1\n\n const itemStatus = computeItemStatus(ratingValue, itemValue, icon)\n\n return (\n <label\n className={cx(\"cobalt-rating-icons__icon-wrapper\", {\n \"cobalt-rating-icons__icon-wrapper--selected\":\n selectedIndex === idx,\n })}\n key={idx}\n onClick={() => {\n if (editable) {\n setRatingValue(itemValue)\n setSelectedIndex(idx)\n }\n }}\n onMouseEnter={(e) => {\n if (editable) {\n ;(e.target as HTMLElement).focus()\n\n resetSelection()\n }\n }}\n >\n <input\n tabIndex={\n editable &&\n (ratingValue === itemValue ||\n (ratingValue === 0 && itemValue === 1))\n ? 0\n : -1\n }\n name={name.current}\n type=\"radio\"\n value={itemValue}\n onChange={() => {\n onChange && onChange(itemValue)\n }}\n disabled={!editable}\n />\n {\n <RatingIcon\n icon={Array.isArray(icon) ? icon[idx] : icon}\n status={itemStatus}\n size={itemSize}\n />\n }\n </label>\n )\n })}\n </div>\n )\n}\n"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@drivy/cobalt",
3
- "version": "2.0.0-beta.6",
3
+ "version": "2.0.0-beta.8",
4
4
  "description": "Opinionated design system for Drivy's projects.",
5
5
  "main": "src/index.js",
6
6
  "types": "types/src/index.d.ts",
@@ -19,7 +19,7 @@
19
19
  "url": "https://github.com/TimPetricola"
20
20
  },
21
21
  "dependencies": {
22
- "@ark-ui/react": "5.9.2",
22
+ "@ark-ui/react": "5.14.1",
23
23
  "@juggle/resize-observer": "3.4.0",
24
24
  "@lottiefiles/react-lottie-player": "3.5.4",
25
25
  "@tippyjs/react": "4.2.6",
@@ -22,7 +22,7 @@
22
22
 
23
23
  &Callout--info {
24
24
  &:before {
25
- @apply c-bg-primary;
25
+ @apply c-bg-warning;
26
26
  }
27
27
  }
28
28
 
@@ -10,7 +10,7 @@
10
10
  }
11
11
 
12
12
  .cobalt-rating__label {
13
- @apply c-text-onSurfaceVariant;
13
+ @apply c-text-onSurface;
14
14
  line-height: 14px;
15
15
  font-size: 14px;
16
16
  }