@drivy/cobalt 0.16.0 → 0.16.1

package/_virtual/_tslib.js

@@ -1,4 +1,4 @@
-/*! *****************************************************************************
+/******************************************************************************
 Copyright (c) Microsoft Corporation.
 
 Permission to use, copy, modify, and/or distribute this software for any

package/cjs/tokens/icons.js

@@ -23,6 +23,7 @@ const icons = {
 	bluetooth: "bluetooth.svg",
 	briefcase: "briefcase.svg",
 	bulb: "bulb.svg",
+	cable: "cable.svg",
 	cabriolet: "cabriolet.svg",
 	calendarCheck: "calendar-check.svg",
 	calendarClock: "calendar-clock.svg",
@@ -100,6 +101,7 @@ const icons = {
 	earth: "earth.svg",
 	edit: "edit.svg",
 	electric: "electric.svg",
+	evBattery: "ev-battery.svg",
 	externalLink: "external-link.svg",
 	eyeClosed: "eye-closed.svg",
 	eyeOpened: "eye-opened.svg",
@@ -227,6 +229,7 @@ const icons = {
 	serviceTolls: "service-tolls.svg",
 	serviceUnlocked: "service-unlocked.svg",
 	settings: "settings.svg",
+	shareAndroid: "share-android.svg",
 	shareIos: "share-ios.svg",
 	share: "share.svg",
 	shieldCheck: "shield-check.svg",

package/cjs/tokens/icons.js.map

@@ -1 +1 @@
-{"version":3,"file":"icons.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"icons.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/components/Helper/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/Helper/index.tsx"],"sourcesContent":["import React, { PropsWithChildren } from \"react\"\nimport cx from \"classnames\"\n\nimport DefaultButton from \"../Buttons/DefaultButton\"\n\ntype HelperPropsType = PropsWithChildren<{\n  className?: string\n  title: string\n  titleClassName?: string\n  contentClassName?: string\n  cta: ReturnType<typeof DefaultButton | typeof DefaultButton.Link>\n}>\n\nconst Helper = ({\n  className,\n  titleClassName,\n  contentClassName,\n  title,\n  children,\n  cta,\n}: HelperPropsType) => (\n  <div className={cx(\"cobalt-helper\", className)}>\n    <strong className={cx(\"cobalt-helper__title\", titleClassName)}>\n      {title}\n    </strong>\n    <div className={cx(\"cobalt-helper__content\", contentClassName)}>\n      {children}\n    </div>\n    {cta}\n  </div>\n)\n\nexport default Helper\n"],"names":[],"mappings":";;;AAaM,IAAA,MAAM,GAAG,UAAC,EAOE,EAAA;AANhB,IAAA,IAAA,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,cAAc,GAAA,EAAA,CAAA,cAAA,EACd,gBAAgB,GAAA,EAAA,CAAA,gBAAA,EAChB,KAAK,WAAA,EACL,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,GAAG,GAAA,EAAA,CAAA,GAAA,CAAA;IACkB,QACrB,6BAAK,SAAS,EAAE,EAAE,CAAC,eAAe,EAAE,SAAS,CAAC,EAAA;QAC5C,KAAQ,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,cAAc,CAAC,EAC1D,EAAA,KAAK,CACC;QACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,EAAE,CAAC,wBAAwB,EAAE,gBAAgB,CAAC,EAC3D,EAAA,QAAQ,CACL;AACL,QAAA,GAAG,CACA,EACP;AAVsB;;;;"}
+{"version":3,"file":"index.js","sources":["../../../src/components/Helper/index.tsx"],"sourcesContent":["import React, { PropsWithChildren } from \"react\"\nimport cx from \"classnames\"\n\nimport DefaultButton from \"../Buttons/DefaultButton\"\n\ntype HelperPropsType = PropsWithChildren<{\n  className?: string\n  title: string\n  titleClassName?: string\n  contentClassName?: string\n  cta?: ReturnType<typeof DefaultButton | typeof DefaultButton.Link>\n}>\n\nconst Helper = ({\n  className,\n  titleClassName,\n  contentClassName,\n  title,\n  children,\n  cta,\n}: HelperPropsType) => (\n  <div className={cx(\"cobalt-helper\", className)}>\n    <strong className={cx(\"cobalt-helper__title\", titleClassName)}>\n      {title}\n    </strong>\n    <div className={cx(\"cobalt-helper__content\", contentClassName)}>\n      {children}\n    </div>\n    {cta}\n  </div>\n)\n\nexport default Helper\n"],"names":[],"mappings":";;;AAaM,IAAA,MAAM,GAAG,UAAC,EAOE,EAAA;AANhB,IAAA,IAAA,SAAS,GAAA,EAAA,CAAA,SAAA,EACT,cAAc,GAAA,EAAA,CAAA,cAAA,EACd,gBAAgB,GAAA,EAAA,CAAA,gBAAA,EAChB,KAAK,WAAA,EACL,QAAQ,GAAA,EAAA,CAAA,QAAA,EACR,GAAG,GAAA,EAAA,CAAA,GAAA,CAAA;IACkB,QACrB,6BAAK,SAAS,EAAE,EAAE,CAAC,eAAe,EAAE,SAAS,CAAC,EAAA;QAC5C,KAAQ,CAAA,aAAA,CAAA,QAAA,EAAA,EAAA,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE,cAAc,CAAC,EAC1D,EAAA,KAAK,CACC;QACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,EAAE,CAAC,wBAAwB,EAAE,gBAAgB,CAAC,EAC3D,EAAA,QAAQ,CACL;AACL,QAAA,GAAG,CACA,EACP;AAVsB;;;;"}

package/components/Icon/__generated__/CableIcon.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import capitalize from '../../utils/capitalize.js';
+import 'lodash.throttle';
+import cx from 'classnames';
+
+var iconSource = "cable";
+var CableIcon = function (_a) {
+    var _b;
+    var color = _a.color, _c = _a.size, size = _c === void 0 ? 24 : _c, _d = _a.contained, contained = _d === void 0 ? false : _d, className = _a.className;
+    var computedClassName = cx(className, "cobalt-Icon cobalt-Icon--".concat(iconSource), (_b = {},
+        _b["cobalt-Icon--color".concat(capitalize(color))] = color,
+        _b["cobalt-Icon--size16"] = size === 16,
+        _b["cobalt-Icon--size20"] = size === 20,
+        _b["cobalt-Icon--size32"] = size === 32,
+        _b["cobalt-Icon--contained"] = contained,
+        _b));
+    var wrap = function (content) { return (React.createElement("span", { className: computedClassName }, content)); };
+    return wrap(React.createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("path", { d: "M20 5V4c0-.55-.45-1-1-1h-2c-.55 0-1 .45-1 1v1h-1v4c0 .55.45 1 1 1h1v7c0 1.1-.9 2-2 2s-2-.9-2-2V7c0-2.21-1.79-4-4-4S5 4.79 5 7v7H4c-.55 0-1 .45-1 1v4h1v1c0 .55.45 1 1 1h2c.55 0 1-.45 1-1v-1h1v-4c0-.55-.45-1-1-1H7V7c0-1.1.9-2 2-2s2 .9 2 2v10c0 2.21 1.79 4 4 4s4-1.79 4-4v-7h1c.55 0 1-.45 1-1V5h-1Z" })));
+};
+
+export { CableIcon as default };
+//# sourceMappingURL=CableIcon.js.map

package/components/Icon/__generated__/CableIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CableIcon.js","sources":["../../../../src/components/Icon/__generated__/CableIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColors } from \"../\"\nimport { capitalize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n  color?: IconColors\n  size?: 16 | 20 | 24 | 32\n  contained?: boolean\n  className?: string\n}\nconst iconSource = \"cable\"\n\nconst CableIcon = ({\n  color,\n  size = 24,\n  contained = false,\n  className,\n}: IconProps) => {\n  const computedClassName = cx(\n    className,\n    `cobalt-Icon cobalt-Icon--${iconSource}`,\n    {\n      [`cobalt-Icon--color${capitalize(color)}`]: color,\n      \"cobalt-Icon--size16\": size === 16,\n      \"cobalt-Icon--size20\": size === 20,\n      \"cobalt-Icon--size32\": size === 32,\n      \"cobalt-Icon--contained\": contained,\n    }\n  )\n\n  const wrap = (content: React.ReactNode) => (\n    <span className={computedClassName}>{content}</span>\n  )\n\n  return wrap(\n    <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M20 5V4c0-.55-.45-1-1-1h-2c-.55 0-1 .45-1 1v1h-1v4c0 .55.45 1 1 1h1v7c0 1.1-.9 2-2 2s-2-.9-2-2V7c0-2.21-1.79-4-4-4S5 4.79 5 7v7H4c-.55 0-1 .45-1 1v4h1v1c0 .55.45 1 1 1h2c.55 0 1-.45 1-1v-1h1v-4c0-.55-.45-1-1-1H7V7c0-1.1.9-2 2-2s2 .9 2 2v10c0 2.21 1.79 4 4 4s4-1.79 4-4v-7h1c.55 0 1-.45 1-1V5h-1Z\" />\n    </svg>\n  )\n}\n\nexport default CableIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,OAAO,CAAA;AAEpB,IAAA,SAAS,GAAG,UAAC,EAKP,EAAA;;AAJV,IAAA,IAAA,KAAK,WAAA,EACL,EAAA,GAAA,EAAA,CAAA,IAAS,EAAT,IAAI,mBAAG,EAAE,GAAA,EAAA,EACT,EAAA,GAAA,EAAA,CAAA,SAAiB,EAAjB,SAAS,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,KAAK,GAAA,EAAA,EACjB,SAAS,GAAA,EAAA,CAAA,SAAA,CAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,2BAAA,CAAA,MAAA,CAA4B,UAAU,CAAE,GAAA,EAAA,GAAA,EAAA;AAEtC,QAAA,EAAA,CAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;QAClC,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;QAClC,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;AAClC,QAAA,EAAA,CAAA,wBAAA,CAAwB,GAAE,SAAS;YAEtC,CAAA;AAED,IAAA,IAAM,IAAI,GAAG,UAAC,OAAwB,EAAA,EAAK,QACzC,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,iBAAiB,EAAG,EAAA,OAAO,CAAQ,EACrD,EAAA,CAAA;IAED,OAAO,IAAI,CACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B,EAAA;AACzD,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,CAAC,EAAC,ySAAyS,EAAG,CAAA,CAChT,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/EvBatteryIcon.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import capitalize from '../../utils/capitalize.js';
+import 'lodash.throttle';
+import cx from 'classnames';
+
+var iconSource = "evBattery";
+var EvBatteryIcon = function (_a) {
+    var _b;
+    var color = _a.color, _c = _a.size, size = _c === void 0 ? 24 : _c, _d = _a.contained, contained = _d === void 0 ? false : _d, className = _a.className;
+    var computedClassName = cx(className, "cobalt-Icon cobalt-Icon--".concat(iconSource), (_b = {},
+        _b["cobalt-Icon--color".concat(capitalize(color))] = color,
+        _b["cobalt-Icon--size16"] = size === 16,
+        _b["cobalt-Icon--size20"] = size === 20,
+        _b["cobalt-Icon--size32"] = size === 32,
+        _b["cobalt-Icon--contained"] = contained,
+        _b));
+    var wrap = function (content) { return (React.createElement("span", { className: computedClassName }, content)); };
+    return wrap(React.createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("path", { d: "M15.67 4H14V2h-4v2H8.33C7.6 4 7 4.6 7 5.33v15.33C7 21.4 7.6 22 8.33 22h7.33c.74 0 1.34-.6 1.34-1.33V5.33C17 4.6 16.4 4 15.67 4ZM11 20v-5.5H9L13 7v5.5h2L11 20Z" })));
+};
+
+export { EvBatteryIcon as default };
+//# sourceMappingURL=EvBatteryIcon.js.map

package/components/Icon/__generated__/EvBatteryIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EvBatteryIcon.js","sources":["../../../../src/components/Icon/__generated__/EvBatteryIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColors } from \"../\"\nimport { capitalize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n  color?: IconColors\n  size?: 16 | 20 | 24 | 32\n  contained?: boolean\n  className?: string\n}\nconst iconSource = \"evBattery\"\n\nconst EvBatteryIcon = ({\n  color,\n  size = 24,\n  contained = false,\n  className,\n}: IconProps) => {\n  const computedClassName = cx(\n    className,\n    `cobalt-Icon cobalt-Icon--${iconSource}`,\n    {\n      [`cobalt-Icon--color${capitalize(color)}`]: color,\n      \"cobalt-Icon--size16\": size === 16,\n      \"cobalt-Icon--size20\": size === 20,\n      \"cobalt-Icon--size32\": size === 32,\n      \"cobalt-Icon--contained\": contained,\n    }\n  )\n\n  const wrap = (content: React.ReactNode) => (\n    <span className={computedClassName}>{content}</span>\n  )\n\n  return wrap(\n    <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M15.67 4H14V2h-4v2H8.33C7.6 4 7 4.6 7 5.33v15.33C7 21.4 7.6 22 8.33 22h7.33c.74 0 1.34-.6 1.34-1.33V5.33C17 4.6 16.4 4 15.67 4ZM11 20v-5.5H9L13 7v5.5h2L11 20Z\" />\n    </svg>\n  )\n}\n\nexport default EvBatteryIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,WAAW,CAAA;AAExB,IAAA,aAAa,GAAG,UAAC,EAKX,EAAA;;AAJV,IAAA,IAAA,KAAK,WAAA,EACL,EAAA,GAAA,EAAA,CAAA,IAAS,EAAT,IAAI,mBAAG,EAAE,GAAA,EAAA,EACT,EAAA,GAAA,EAAA,CAAA,SAAiB,EAAjB,SAAS,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,KAAK,GAAA,EAAA,EACjB,SAAS,GAAA,EAAA,CAAA,SAAA,CAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,2BAAA,CAAA,MAAA,CAA4B,UAAU,CAAE,GAAA,EAAA,GAAA,EAAA;AAEtC,QAAA,EAAA,CAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;QAClC,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;QAClC,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;AAClC,QAAA,EAAA,CAAA,wBAAA,CAAwB,GAAE,SAAS;YAEtC,CAAA;AAED,IAAA,IAAM,IAAI,GAAG,UAAC,OAAwB,EAAA,EAAK,QACzC,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,iBAAiB,EAAG,EAAA,OAAO,CAAQ,EACrD,EAAA,CAAA;IAED,OAAO,IAAI,CACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B,EAAA;AACzD,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,CAAC,EAAC,gKAAgK,EAAG,CAAA,CACvK,CACP,CAAA;AACH;;;;"}

package/components/Icon/__generated__/ShareAndroidIcon.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import capitalize from '../../utils/capitalize.js';
+import 'lodash.throttle';
+import cx from 'classnames';
+
+var iconSource = "shareAndroid";
+var ShareAndroidIcon = function (_a) {
+    var _b;
+    var color = _a.color, _c = _a.size, size = _c === void 0 ? 24 : _c, _d = _a.contained, contained = _d === void 0 ? false : _d, className = _a.className;
+    var computedClassName = cx(className, "cobalt-Icon cobalt-Icon--".concat(iconSource), (_b = {},
+        _b["cobalt-Icon--color".concat(capitalize(color))] = color,
+        _b["cobalt-Icon--size16"] = size === 16,
+        _b["cobalt-Icon--size20"] = size === 20,
+        _b["cobalt-Icon--size32"] = size === 32,
+        _b["cobalt-Icon--contained"] = contained,
+        _b));
+    var wrap = function (content) { return (React.createElement("span", { className: computedClassName }, content)); };
+    return wrap(React.createElement("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" },
+        React.createElement("path", { d: "M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7 0-.24-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92 1.61 0 2.92-1.31 2.92-2.92 0-1.61-1.31-2.92-2.92-2.92Z" })));
+};
+
+export { ShareAndroidIcon as default };
+//# sourceMappingURL=ShareAndroidIcon.js.map

package/components/Icon/__generated__/ShareAndroidIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ShareAndroidIcon.js","sources":["../../../../src/components/Icon/__generated__/ShareAndroidIcon.tsx"],"sourcesContent":["import React from \"react\"\nimport { IconColors } from \"../\"\nimport { capitalize } from \"../../utils\"\nimport cx from \"classnames\"\nexport type IconProps = {\n  color?: IconColors\n  size?: 16 | 20 | 24 | 32\n  contained?: boolean\n  className?: string\n}\nconst iconSource = \"shareAndroid\"\n\nconst ShareAndroidIcon = ({\n  color,\n  size = 24,\n  contained = false,\n  className,\n}: IconProps) => {\n  const computedClassName = cx(\n    className,\n    `cobalt-Icon cobalt-Icon--${iconSource}`,\n    {\n      [`cobalt-Icon--color${capitalize(color)}`]: color,\n      \"cobalt-Icon--size16\": size === 16,\n      \"cobalt-Icon--size20\": size === 20,\n      \"cobalt-Icon--size32\": size === 32,\n      \"cobalt-Icon--contained\": contained,\n    }\n  )\n\n  const wrap = (content: React.ReactNode) => (\n    <span className={computedClassName}>{content}</span>\n  )\n\n  return wrap(\n    <svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7 0-.24-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92 1.61 0 2.92-1.31 2.92-2.92 0-1.61-1.31-2.92-2.92-2.92Z\" />\n    </svg>\n  )\n}\n\nexport default ShareAndroidIcon\n"],"names":[],"mappings":";;;;;AAUA,IAAM,UAAU,GAAG,cAAc,CAAA;AAE3B,IAAA,gBAAgB,GAAG,UAAC,EAKd,EAAA;;AAJV,IAAA,IAAA,KAAK,WAAA,EACL,EAAA,GAAA,EAAA,CAAA,IAAS,EAAT,IAAI,mBAAG,EAAE,GAAA,EAAA,EACT,EAAA,GAAA,EAAA,CAAA,SAAiB,EAAjB,SAAS,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,KAAK,GAAA,EAAA,EACjB,SAAS,GAAA,EAAA,CAAA,SAAA,CAAA;IAET,IAAM,iBAAiB,GAAG,EAAE,CAC1B,SAAS,EACT,2BAAA,CAAA,MAAA,CAA4B,UAAU,CAAE,GAAA,EAAA,GAAA,EAAA;AAEtC,QAAA,EAAA,CAAC,4BAAqB,UAAU,CAAC,KAAK,CAAC,CAAE,IAAG,KAAK;QACjD,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;QAClC,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;QAClC,EAAqB,CAAA,qBAAA,CAAA,GAAE,IAAI,KAAK,EAAE;AAClC,QAAA,EAAA,CAAA,wBAAA,CAAwB,GAAE,SAAS;YAEtC,CAAA;AAED,IAAA,IAAM,IAAI,GAAG,UAAC,OAAwB,EAAA,EAAK,QACzC,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,iBAAiB,EAAG,EAAA,OAAO,CAAQ,EACrD,EAAA,CAAA;IAED,OAAO,IAAI,CACT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B,EAAA;AACzD,QAAA,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAM,CAAC,EAAC,oXAAoX,EAAG,CAAA,CAC3X,CACP,CAAA;AACH;;;;"}

package/components/Rating/RatingIcons.js

@@ -0,0 +1,98 @@
+import { __read } from '../../_virtual/_tslib.js';
+import React, { useRef, useState, useCallback } from 'react';
+import { nanoid } from 'nanoid';
+import cx from 'classnames';
+import '../Icon/index.js';
+import StarIcon from '../Icon/__generated__/StarIcon.js';
+
+var defaultRatingIcon = React.createElement(StarIcon, { color: "turquoise" });
+var itemEmptyColor = "grey";
+function roundHalf(num) {
+    var temp = num * 2;
+    return temp % 1 === 0.5 ? Math.floor(temp) / 2 : Math.round(temp) / 2;
+}
+function computeItemStatus(ratingValue, itemValue, icon) {
+    var itemStatus = "empty";
+    if (!Array.isArray(icon)) {
+        // gauge
+        var isHalfItem = itemValue > ratingValue && ratingValue > itemValue - 1;
+        if (isHalfItem) {
+            itemStatus = "half";
+        }
+        else if (itemValue <= ratingValue) {
+            itemStatus = "full";
+        }
+    }
+    else if (itemValue === ratingValue) {
+        // radio
+        itemStatus = "full";
+    }
+    return itemStatus;
+}
+var RatingIcon = function (_a) {
+    var icon = _a.icon, _b = _a.status, status = _b === void 0 ? "full" : _b, _c = _a.size, size = _c === void 0 ? 24 : _c;
+    if (status === "half") {
+        return (React.createElement(React.Fragment, null,
+            React.cloneElement(icon, {
+                color: itemEmptyColor,
+                size: size,
+            }),
+            React.createElement("div", { className: "cobalt-rating-icons__icon-half-container" }, React.cloneElement(icon, { size: size }))));
+    }
+    else {
+        var iconColor = status === "empty" ? itemEmptyColor : icon.props.color;
+        return React.cloneElement(icon, {
+            color: iconColor,
+            size: size,
+        });
+    }
+};
+var RatingIcons = function (_a) {
+    var className = _a.className, _b = _a.max, max = _b === void 0 ? 5 : _b, value = _a.value, _c = _a.size, size = _c === void 0 ? 24 : _c, _d = _a.editable, editable = _d === void 0 ? false : _d, onChange = _a.onChange, _e = _a.icon, icon = _e === void 0 ? defaultRatingIcon : _e;
+    var name = useRef(nanoid());
+    var items = useRef(Array.from(new Array(Array.isArray(icon) ? icon.length : max)));
+    var _f = __read(useState(function () {
+        return editable ? Math.floor(value) : roundHalf(value);
+    }), 2), ratingValue = _f[0], setRatingValue = _f[1];
+    var _g = __read(useState(-1), 2), selectedIndex = _g[0], setSelectedIndex = _g[1]; // used to enforce selection effect (icon scale reset)
+    var resetSelection = useCallback(function () {
+        setSelectedIndex(-1);
+    }, []);
+    var itemSize = size === 48 ? 16 : size;
+    // input element is used for a11y purpose ( focus feedback and keyboard selection )
+    return (React.createElement("div", { className: cx("cobalt-rating-icons", className, {
+            "cobalt-rating-icons--input": !editable,
+            "cobalt-rating-icons--icon-size-48": size === 48,
+        }), onPointerLeave: function () {
+            if (editable) {
+                document.activeElement.blur();
+            }
+        } }, items.current.map(function (_value, idx) {
+        var itemValue = idx + 1;
+        var itemStatus = computeItemStatus(ratingValue, itemValue, icon);
+        return (React.createElement("label", { className: cx("cobalt-rating-icons__icon-wrapper", {
+                "cobalt-rating-icons__icon-wrapper--selected": selectedIndex === idx,
+            }), key: idx, onClick: function () {
+                if (editable) {
+                    setRatingValue(itemValue);
+                    setSelectedIndex(idx);
+                }
+            }, onMouseEnter: function (e) {
+                if (editable) {
+                    e.target.focus();
+                    resetSelection();
+                }
+            } },
+            React.createElement("input", { tabIndex: editable &&
+                    (ratingValue === itemValue ||
+                        (ratingValue === 0 && itemValue === 1))
+                    ? 0
+                    : -1, name: name.current, type: "radio", value: itemValue, onChange: function () {
+                    onChange && onChange(itemValue);
+                }, disabled: !editable }),
+            React.createElement(RatingIcon, { icon: Array.isArray(icon) ? icon[idx] : icon, status: itemStatus, size: itemSize })));
+    })));
+};
+
+export { RatingIcon, RatingIcons, computeItemStatus, defaultRatingIcon, roundHalf };
+//# sourceMappingURL=RatingIcons.js.map

package/components/Rating/RatingIcons.js.map

@@ -0,0 +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={\"turquoise\"} />\nconst itemEmptyColor: IconProps[\"color\"] = \"grey\"\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--input\": !editable,\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/icons/cable.js

@@ -0,0 +1,4 @@
+var cable = "<svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M20 5V4c0-.55-.45-1-1-1h-2c-.55 0-1 .45-1 1v1h-1v4c0 .55.45 1 1 1h1v7c0 1.1-.9 2-2 2s-2-.9-2-2V7c0-2.21-1.79-4-4-4S5 4.79 5 7v7H4c-.55 0-1 .45-1 1v4h1v1c0 .55.45 1 1 1h2c.55 0 1-.45 1-1v-1h1v-4c0-.55-.45-1-1-1H7V7c0-1.1.9-2 2-2s2 .9 2 2v10c0 2.21 1.79 4 4 4s4-1.79 4-4v-7h1c.55 0 1-.45 1-1V5h-1z\"/></svg>";
+
+export { cable as default };
+//# sourceMappingURL=cable.js.map

package/icons/cable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"cable.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/icons/cable.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M20 5V4c0-.55-.45-1-1-1h-2c-.55 0-1 .45-1 1v1h-1v4c0 .55.45 1 1 1h1v7c0 1.1-.9 2-2 2s-2-.9-2-2V7c0-2.21-1.79-4-4-4S5 4.79 5 7v7H4c-.55 0-1 .45-1 1v4h1v1c0 .55.45 1 1 1h2c.55 0 1-.45 1-1v-1h1v-4c0-.55-.45-1-1-1H7V7c0-1.1.9-2 2-2s2 .9 2 2v10c0 2.21 1.79 4 4 4s4-1.79 4-4v-7h1c.55 0 1-.45 1-1V5h-1Z"/></svg>

package/icons/ev-battery.js

@@ -0,0 +1,4 @@
+var evBattery = "<svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M15.67 4H14V2h-4v2H8.33C7.6 4 7 4.6 7 5.33v15.33C7 21.4 7.6 22 8.33 22h7.33c.74 0 1.34-.6 1.34-1.33V5.33C17 4.6 16.4 4 15.67 4zM11 20v-5.5H9L13 7v5.5h2L11 20z\"/></svg>";
+
+export { evBattery as default };
+//# sourceMappingURL=ev-battery.js.map

package/icons/ev-battery.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ev-battery.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/icons/ev-battery.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M15.67 4H14V2h-4v2H8.33C7.6 4 7 4.6 7 5.33v15.33C7 21.4 7.6 22 8.33 22h7.33c.74 0 1.34-.6 1.34-1.33V5.33C17 4.6 16.4 4 15.67 4ZM11 20v-5.5H9L13 7v5.5h2L11 20Z"/></svg>

package/icons/index.js

@@ -18,6 +18,7 @@ export { default as bin } from './bin.js';
 export { default as bluetooth } from './bluetooth.js';
 export { default as briefcase } from './briefcase.js';
 export { default as bulb } from './bulb.js';
+export { default as cable } from './cable.js';
 export { default as cabriolet } from './cabriolet.js';
 export { default as calendarCheck } from './calendar-check.js';
 export { default as calendarClock } from './calendar-clock.js';
@@ -95,6 +96,7 @@ export { default as earning } from './earning.js';
 export { default as earth } from './earth.js';
 export { default as edit } from './edit.js';
 export { default as electric } from './electric.js';
+export { default as evBattery } from './ev-battery.js';
 export { default as externalLink } from './external-link.js';
 export { default as eyeClosed } from './eye-closed.js';
 export { default as eyeOpened } from './eye-opened.js';
@@ -222,6 +224,7 @@ export { default as serviceLocked } from './service-locked.js';
 export { default as serviceTolls } from './service-tolls.js';
 export { default as serviceUnlocked } from './service-unlocked.js';
 export { default as settings } from './settings.js';
+export { default as shareAndroid } from './share-android.js';
 export { default as shareIos } from './share-ios.js';
 export { default as share } from './share.js';
 export { default as shieldCheck } from './shield-check.js';

package/icons/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/icons/share-android.js

@@ -0,0 +1,4 @@
+var shareAndroid = "<svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7 0-.24-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92 1.61 0 2.92-1.31 2.92-2.92 0-1.61-1.31-2.92-2.92-2.92z\"/></svg>";
+
+export { shareAndroid as default };
+//# sourceMappingURL=share-android.js.map

package/icons/share-android.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"share-android.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/icons/share-android.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M18 16.08c-.76 0-1.44.3-1.96.77L8.91 12.7c.05-.23.09-.46.09-.7 0-.24-.04-.47-.09-.7l7.05-4.11c.54.5 1.25.81 2.04.81 1.66 0 3-1.34 3-3s-1.34-3-3-3-3 1.34-3 3c0 .24.04.47.09.7L8.04 9.81C7.5 9.31 6.79 9 6 9c-1.66 0-3 1.34-3 3s1.34 3 3 3c.79 0 1.5-.31 2.04-.81l7.12 4.16c-.05.21-.08.43-.08.65 0 1.61 1.31 2.92 2.92 2.92 1.61 0 2.92-1.31 2.92-2.92 0-1.61-1.31-2.92-2.92-2.92Z"/></svg>

package/index.js

@@ -36,6 +36,7 @@ export { ComposedField } from './components/Form/ComposedField.js';
 export { withFieldLabelAndHint } from './components/Form/field.js';
 export { Fieldset } from './components/Form/Fieldset.js';
 export { Hint } from './components/Form/Hint.js';
+export { RatingIcons } from './components/Rating/RatingIcons.js';
 export { Select } from './components/Form/Select.js';
 export { default as Slider, SliderValueMeta } from './components/Form/Slider.js';
 export { Stepper, StepperMeta } from './components/Form/Stepper.js';
@@ -66,6 +67,7 @@ export { default as BinIcon } from './components/Icon/__generated__/BinIcon.js';
 export { default as BluetoothIcon } from './components/Icon/__generated__/BluetoothIcon.js';
 export { default as BriefcaseIcon } from './components/Icon/__generated__/BriefcaseIcon.js';
 export { default as BulbIcon } from './components/Icon/__generated__/BulbIcon.js';
+export { default as CableIcon } from './components/Icon/__generated__/CableIcon.js';
 export { default as CabrioletIcon } from './components/Icon/__generated__/CabrioletIcon.js';
 export { default as CalendarCheckIcon } from './components/Icon/__generated__/CalendarCheckIcon.js';
 export { default as CalendarClockIcon } from './components/Icon/__generated__/CalendarClockIcon.js';
@@ -143,6 +145,7 @@ export { default as EarningIcon } from './components/Icon/__generated__/EarningI
 export { default as EarthIcon } from './components/Icon/__generated__/EarthIcon.js';
 export { default as EditIcon } from './components/Icon/__generated__/EditIcon.js';
 export { default as ElectricIcon } from './components/Icon/__generated__/ElectricIcon.js';
+export { default as EvBatteryIcon } from './components/Icon/__generated__/EvBatteryIcon.js';
 export { default as ExternalLinkIcon } from './components/Icon/__generated__/ExternalLinkIcon.js';
 export { default as EyeClosedIcon } from './components/Icon/__generated__/EyeClosedIcon.js';
 export { default as EyeIcon } from './components/Icon/__generated__/EyeIcon.js';
@@ -269,6 +272,7 @@ export { default as ServiceLockedIcon } from './components/Icon/__generated__/Se
 export { default as ServiceTollsIcon } from './components/Icon/__generated__/ServiceTollsIcon.js';
 export { default as ServiceUnlockedIcon } from './components/Icon/__generated__/ServiceUnlockedIcon.js';
 export { default as SettingsIcon } from './components/Icon/__generated__/SettingsIcon.js';
+export { default as ShareAndroidIcon } from './components/Icon/__generated__/ShareAndroidIcon.js';
 export { default as ShareIcon } from './components/Icon/__generated__/ShareIcon.js';
 export { default as ShareIosIcon } from './components/Icon/__generated__/ShareIosIcon.js';
 export { default as ShieldCheckIcon } from './components/Icon/__generated__/ShieldCheckIcon.js';
@@ -283,7 +287,6 @@ export { default as SocialLinkedinIcon } from './components/Icon/__generated__/S
 export { default as SocialTwitterIcon } from './components/Icon/__generated__/SocialTwitterIcon.js';
 export { default as SocialWhatsappIcon } from './components/Icon/__generated__/SocialWhatsappIcon.js';
 export { default as StarHalfIcon } from './components/Icon/__generated__/StarHalfIcon.js';
-export { default as StarIcon } from './components/Icon/__generated__/StarIcon.js';
 export { default as StarsIcon } from './components/Icon/__generated__/StarsIcon.js';
 export { default as SubwayIcon } from './components/Icon/__generated__/SubwayIcon.js';
 export { default as SuitcaseIcon } from './components/Icon/__generated__/SuitcaseIcon.js';
@@ -325,4 +328,5 @@ export { default as WrenchIcon } from './components/Icon/__generated__/WrenchIco
 export { default as YingyangIcon } from './components/Icon/__generated__/YingyangIcon.js';
 export { useAccordionItemContext } from '@reach/accordion';
 export { default as LoadingIcon } from './components/Icon/__generated__/LoadingIcon.js';
+export { default as StarIcon } from './components/Icon/__generated__/StarIcon.js';
 //# sourceMappingURL=index.js.map

package/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@drivy/cobalt",
-  "version": "0.16.0",
+  "version": "0.16.1",
   "description": "Opinionated design system for Drivy's projects.",
   "main": "src/index.js",
   "types": "types/index.d.ts",
@@ -57,16 +57,16 @@
     "@svgr/cli": "6.2.1",
     "@testing-library/jest-dom": "5.16.4",
     "@testing-library/react": "12.1.5",
-    "@testing-library/react-hooks": "7.0.2",
+    "@testing-library/react-hooks": "8.0.0",
     "@types/classnames": "2.3.0",
     "@types/jest": "27.4.1",
     "@types/lodash.throttle": "4.1.7",
     "@types/media-typer": "1.1.1",
     "@types/react": "17.0.44",
-    "autoprefixer": "10.4.4",
-    "core-js": "3.22.1",
+    "autoprefixer": "10.4.7",
+    "core-js": "3.22.2",
     "css-loader": "6.7.1",
-    "eslint": "8.13.0",
+    "eslint": "8.14.0",
     "jest": "27.5.1",
     "np": "7.6.1",
     "postcss-flexbugs-fixes": "5.0.2",

package/styles/components/Rating/index.scss

@@ -0,0 +1,134 @@
+.cobalt-rating,
+.cobalt-rating-input {
+  display: flex;
+
+  align-items: center;
+
+  pointer-events: none;
+
+  gap: 4px;
+}
+
+.cobalt-rating__label {
+  line-height: 14px;
+  font-size: 14px;
+  color: color(graphite, light);
+}
+
+.cobalt-rating-input {
+  &--disabled {
+    opacity: 0.5;
+  }
+
+  &:not(.cobalt-rating-input--disabled) .cobalt-rating-icons {
+    pointer-events: initial;
+  }
+}
+
+.cobalt-rating-icons {
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  pointer-events: none;
+
+  * {
+    -webkit-tap-highlight-color: transparent;
+  }
+
+  &--icon-size-48 .cobalt-Icon {
+    height: spacing(xl);
+    width: spacing(xl);
+  }
+
+  &__icon-wrapper {
+    position: relative;
+
+    display: inline-block;
+
+    line-height: 0;
+
+    cursor: pointer;
+  }
+
+  &__icon-wrapper input {
+    width: 0;
+    height: 0;
+    margin: 0;
+    padding: 0;
+
+    opacity: 0;
+  }
+
+  &__icon-wrapper * {
+    pointer-events: none;
+  }
+
+  &__icon-half-container {
+    position: absolute;
+
+    top: 0;
+    left: 0;
+
+    width: calc(50%);
+
+    overflow: hidden;
+  }
+
+  &__icon-half-container .cobalt-Icon {
+    max-width: none;
+  }
+
+  &:not(:hover):not(:focus-visible) input:focus {
+    // focus feedback with keyboard navigation only
+    & + .cobalt-Icon {
+      border-radius: spacing(unit);
+      box-shadow: 0 0 0 1px color(turquoise);
+    }
+  }
+
+  /* stylelint-disable order/order */
+  @media (hover: hover) {
+    // desktop animation only
+    &__icon-wrapper--selected {
+      input:checked:focus + .cobalt-Icon {
+        transform: scale(1) !important;
+      }
+    }
+
+    &__icon-wrapper:hover {
+      .cobalt-Icon {
+        transform: scale(1.2);
+      }
+    }
+
+    &:not(:hover)
+      &__icon-wrapper:not(:hover):not(:focus-visible)
+      input:focus:checked {
+      // focus feedback with keyboard navigation only
+      & + .cobalt-Icon {
+        animation: rating-pop--keyboard 0.3s ease 1;
+      }
+    }
+  }
+
+  @media (hover: none) {
+    // mobile selection feedback
+    &__icon-wrapper input:checked {
+      & + .cobalt-Icon {
+        animation: rating-pop--mobile 0.3s ease 1;
+      }
+    }
+  }
+}
+
+@keyframes rating-pop--keyboard {
+  0% {
+    transform: scale(1.2);
+  }
+}
+
+@keyframes rating-pop--mobile {
+  0% {
+    transform: scale(1.5);
+  }
+}

package/styles/components.scss

@@ -28,3 +28,4 @@
 @import "./components/Popover/index";
 @import "./components/Accordion/index";
 @import "./components/HorizontalList/index";
+@import "./components/Rating/index";

package/tokens/icons.js

@@ -19,6 +19,7 @@ const icons = {
 	bluetooth: "bluetooth.svg",
 	briefcase: "briefcase.svg",
 	bulb: "bulb.svg",
+	cable: "cable.svg",
 	cabriolet: "cabriolet.svg",
 	calendarCheck: "calendar-check.svg",
 	calendarClock: "calendar-clock.svg",
@@ -96,6 +97,7 @@ const icons = {
 	earth: "earth.svg",
 	edit: "edit.svg",
 	electric: "electric.svg",
+	evBattery: "ev-battery.svg",
 	externalLink: "external-link.svg",
 	eyeClosed: "eye-closed.svg",
 	eyeOpened: "eye-opened.svg",
@@ -223,6 +225,7 @@ const icons = {
 	serviceTolls: "service-tolls.svg",
 	serviceUnlocked: "service-unlocked.svg",
 	settings: "settings.svg",
+	shareAndroid: "share-android.svg",
 	shareIos: "share-ios.svg",
 	share: "share.svg",
 	shieldCheck: "shield-check.svg",

package/tokens/icons.js.map

@@ -1 +1 @@
-{"version":3,"file":"icons.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"icons.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}