@drivy/cobalt 2.0.0-beta.7 → 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.
|
@@ -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 = "
|
|
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\"] = \"
|
|
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