@duetds/components 10.0.0-alpha.9 → 10.1.0

package/lib/collection/components/duet-upload-aria-status/duet-upload-aria-status.js

@@ -8,6 +8,34 @@ import { h, Host } from "@stencil/core";
  */
 export class DuetUploadAriaStatus {
     constructor() {
+        /**
+         * State() variables
+         */
+        this.statusMessage = null;
+        /**
+         * Status labels used in the component
+         */
+        this.statusMessageLabel = null;
+        /**
+         * Adds accessible label that is read aloud
+         */
+        this.accessibleAriaLive = "polite";
+        /**
+         * valid file amount
+         */
+        this.valid = undefined;
+        /**
+         * total files
+         */
+        this.total = undefined;
+        /**
+         * invalid file amount
+         */
+        this.invalid = undefined;
+        /**
+         * valid file amount
+         */
+        this.inprogress = undefined;
         /**
          * Private functions
          */
@@ -46,13 +74,6 @@ export class DuetUploadAriaStatus {
             }
             return;
         };
-        this.statusMessage = null;
-        this.statusMessageLabel = null;
-        this.accessibleAriaLive = "polite";
-        this.valid = undefined;
-        this.total = undefined;
-        this.invalid = undefined;
-        this.inprogress = undefined;
     }
     watchHandler(newValue, oldValue) {
         if (newValue !== oldValue) {
@@ -64,7 +85,7 @@ export class DuetUploadAriaStatus {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '9ef075b90505bbba4b77395f4be84f896519b61a', role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, h("duet-visually-hidden", { key: '57a5279dd6e2db63beb2d5d7912b29dce1ba547d' }, this.statusMessage)));
+        return (h(Host, { key: 'dfba0ccef69bd34b3c4f8980caa95375ed480f83', role: "status", "aria-live": "assertive", "aria-atomic": "true", "aria-relevant": "all" }, h("duet-visually-hidden", { key: '20bd47d50fbc2097aae0656ffb367299284ff441' }, this.statusMessage)));
     }
     static get is() { return "duet-upload-aria-status"; }
     static get encapsulation() { return "shadow"; }
@@ -72,6 +93,7 @@ export class DuetUploadAriaStatus {
         return {
             "statusMessageLabel": {
                 "type": "unknown",
+                "attribute": "status-label",
                 "mutable": false,
                 "complexType": {
                     "original": "StatusMessage",
@@ -96,6 +118,7 @@ export class DuetUploadAriaStatus {
             },
             "accessibleAriaLive": {
                 "type": "string",
+                "attribute": "accessible-aria-live",
                 "mutable": false,
                 "complexType": {
                     "original": "\"off\" | \"polite\" | \"assertive\"",
@@ -110,12 +133,12 @@ export class DuetUploadAriaStatus {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "accessible-aria-live",
                 "reflect": false,
                 "defaultValue": "\"polite\""
             },
             "valid": {
                 "type": "number",
+                "attribute": "valid",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -130,12 +153,12 @@ export class DuetUploadAriaStatus {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "valid",
                 "reflect": false,
                 "defaultValue": "undefined"
             },
             "total": {
                 "type": "number",
+                "attribute": "total",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -150,12 +173,12 @@ export class DuetUploadAriaStatus {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "total",
                 "reflect": false,
                 "defaultValue": "undefined"
             },
             "invalid": {
                 "type": "number",
+                "attribute": "invalid",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -170,12 +193,12 @@ export class DuetUploadAriaStatus {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "invalid",
                 "reflect": false,
                 "defaultValue": "undefined"
             },
             "inprogress": {
                 "type": "number",
+                "attribute": "inprogress",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -190,7 +213,6 @@ export class DuetUploadAriaStatus {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "inprogress",
                 "reflect": false,
                 "defaultValue": "undefined"
             }

package/lib/collection/components/duet-upload-item/duet-upload-item.js

@@ -12,6 +12,10 @@ import { formatBytes } from "../duet-upload/upload.helpers";
  */
 export class DuetUploadItem {
     constructor() {
+        /**
+         * theme.
+         */
+        this.theme = "";
         this.fileUploadingInfo = {
             fi: "Tiedosto latautuu",
             sv: "Filen laddas upp",
@@ -27,17 +31,6 @@ export class DuetUploadItem {
                 });
             }
         };
-        this.theme = "";
-        this.data = undefined;
-        this.type = undefined;
-        this.showLinks = undefined;
-        this.actions = undefined;
-        this.buttonTitles = undefined;
-        this.label = undefined;
-        this.categoryLabel = undefined;
-        this.errorCodes = undefined;
-        this.showCategory = undefined;
-        this.linkClickEvent = undefined;
     }
     /**
      * Component lifecycle events.
@@ -80,9 +73,9 @@ export class DuetUploadItem {
         const { uid, meta, item } = this.data;
         const Badges = meta && meta.badges ? (h("span", null, meta.badges.map(badgeText => (h("duet-badge", { color: "primary" }, badgeText))))) : undefined;
         const actionDescription = `${meta && meta.badges ? meta.badges.join(",") : ""} ${item.name}`;
-        return (h("div", { key: 'e20eaab3688b577cbdc151f9e890e6ccb55e7795', class: {
+        return (h("div", { key: 'af4b480a7c50c90ebf35c2744a0c6d301c026ee9', class: {
                 "upload-item-row": true,
-            } }, this.showCategory && (h("div", { key: '136689969c8164e4a5e15015ded3533e24959c8e', class: "item-categories" }, h("duet-heading", { key: '02bb08e5a87bae34896dc2d21d90fce955044231', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), h("div", { key: 'd93fae942698b2638a46ff9a3249884555472a37', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (h("duet-heading", { key: '244da72bd3771fcf6ee4481f3143c051bf272bc2', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), h("div", { key: '730db1e85ef0ba3f9f9d4d67f38270e38d6d7195', class: "item-actions" }, this.actions.map(actionItem => {
+            } }, this.showCategory && (h("div", { key: '4717379f9f4b5848066dd29975972f19b46e2ca2', class: "item-categories" }, h("duet-heading", { key: '629de4c001a31d3ac9e509f4d8c4e48453b861bb', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.categoryLabel)), Badges)), h("div", { key: '0bab4d7664d6f2032dac1ea95b2b608297ab4d2a', class: { "item-name": true, "no-category": !this.showCategory } }, !!this.label && (h("duet-heading", { key: '65d2a44a4b4b3353766658557242ad53c357236e', class: "heading", color: "color-secondary", level: "h6", weight: "semibold" }, getLocaleString(this.label))), this.getFileNameLine()), h("div", { key: '5e5cce5f36a34f4b24c21a1055874ba9bc59493b', class: "item-actions" }, this.actions.map(actionItem => {
             return (h("duet-action-button", { actionMeta: Object.assign({}, meta || {}), actionId: uid || null, actionName: actionItem.name, theme: this.theme, iconName: actionItem.icon, iconColor: actionItem.color, iconSize: actionItem.size, background: actionItem.background, "accessible-label": `${actionDescription} ${getLocaleString(actionItem.label)} `, accessibleTitle: this.getActionButtonTitle(actionItem), ref: button => (this.actionButton = button) }));
         }))));
     }
@@ -101,6 +94,7 @@ export class DuetUploadItem {
         return {
             "theme": {
                 "type": "string",
+                "attribute": "theme",
                 "mutable": true,
                 "complexType": {
                     "original": "DuetTheme",
@@ -121,12 +115,12 @@ export class DuetUploadItem {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "theme",
                 "reflect": false,
                 "defaultValue": "\"\""
             },
             "data": {
                 "type": "unknown",
+                "attribute": "data",
                 "mutable": false,
                 "complexType": {
                     "original": "DuetFileListItem",
@@ -150,6 +144,7 @@ export class DuetUploadItem {
             },
             "type": {
                 "type": "string",
+                "attribute": "type",
                 "mutable": false,
                 "complexType": {
                     "original": "ItemType",
@@ -157,7 +152,7 @@ export class DuetUploadItem {
                     "references": {
                         "ItemType": {
                             "location": "local",
-                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-upload-item/duet-upload-item.tsx",
+                            "path": "/Users/kasimir/projects/lahitapiola/duet-design-system/packages/components/src/components/duet-upload-item/duet-upload-item.tsx",
                             "id": "src/components/duet-upload-item/duet-upload-item.tsx::ItemType"
                         }
                     }
@@ -170,11 +165,11 @@ export class DuetUploadItem {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "type",
                 "reflect": false
             },
             "showLinks": {
                 "type": "boolean",
+                "attribute": "show-links",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -189,11 +184,11 @@ export class DuetUploadItem {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "show-links",
                 "reflect": false
             },
             "actions": {
                 "type": "any",
+                "attribute": "actions",
                 "mutable": false,
                 "complexType": {
                     "original": "any",
@@ -208,11 +203,11 @@ export class DuetUploadItem {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "actions",
                 "reflect": false
             },
             "buttonTitles": {
                 "type": "unknown",
+                "attribute": "button-titles",
                 "mutable": false,
                 "complexType": {
                     "original": "UploadActionButtonTitles",
@@ -220,7 +215,7 @@ export class DuetUploadItem {
                     "references": {
                         "UploadActionButtonTitles": {
                             "location": "local",
-                            "path": "/Users/juha-matti.laaksonen/duetds/packages/components/src/components/duet-upload-item/duet-upload-item.tsx",
+                            "path": "/Users/kasimir/projects/lahitapiola/duet-design-system/packages/components/src/components/duet-upload-item/duet-upload-item.tsx",
                             "id": "src/components/duet-upload-item/duet-upload-item.tsx::UploadActionButtonTitles"
                         }
                     }
@@ -236,6 +231,7 @@ export class DuetUploadItem {
             },
             "label": {
                 "type": "unknown",
+                "attribute": "label",
                 "mutable": false,
                 "complexType": {
                     "original": "DuetLangObject",
@@ -259,6 +255,7 @@ export class DuetUploadItem {
             },
             "categoryLabel": {
                 "type": "unknown",
+                "attribute": "category-label",
                 "mutable": false,
                 "complexType": {
                     "original": "DuetLangObject",
@@ -282,6 +279,7 @@ export class DuetUploadItem {
             },
             "errorCodes": {
                 "type": "unknown",
+                "attribute": "error-codes",
                 "mutable": false,
                 "complexType": {
                     "original": "DuetUploadErrorCode[]",
@@ -305,6 +303,7 @@ export class DuetUploadItem {
             },
             "showCategory": {
                 "type": "boolean",
+                "attribute": "show-category",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -319,11 +318,11 @@ export class DuetUploadItem {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "show-category",
                 "reflect": false
             },
             "linkClickEvent": {
                 "type": "unknown",
+                "attribute": "link-click-event",
                 "mutable": false,
                 "complexType": {
                     "original": "EventEmitter<DuetUploadEvent>",

package/lib/collection/components/duet-visually-hidden/duet-visually-hidden.css

@@ -2,17 +2,17 @@
   box-sizing: border-box;
   padding: 0;
   margin: 0;
-  background: transparent;
-  border: 0;
   -moz-appearance: none;
   -webkit-appearance: none;
   appearance: none;
+  background: transparent;
+  border: 0;
   position: absolute !important;
   top: 0;
   width: 1px !important;
   height: 1px !important;
   padding: 0 !important;
   overflow: hidden !important;
-  clip: rect(1px, 1px, 1px, 1px) !important;
   border: 0 !important;
+  clip: rect(1px, 1px, 1px, 1px) !important;
 }

package/lib/collection/components/duet-visually-hidden/duet-visually-hidden.js

@@ -8,7 +8,7 @@ export class DuetVisuallyHidden {
      * Always the last one in the class.
      */
     render() {
-        return (h(Host, { key: '4e73b8e8e3d246d4e425a653526f8e3847675c05', class: "duet-visually-hidden" }, h("slot", { key: '43ab02712801040eeaa472a683c20629d6f4e865' })));
+        return (h(Host, { key: '0b6d7c8ffd99088d9679558cf45fd682f17754b8', class: "duet-visually-hidden" }, h("slot", { key: 'a1fd4a31404091a50c989a4ccbe6ea9b8233fa73' })));
     }
     static get is() { return "duet-visually-hidden"; }
     static get encapsulation() { return "shadow"; }

package/lib/collection/index.js

@@ -0,0 +1 @@
+export {};

package/lib/collection/utils/a11y-utils.js

@@ -18,3 +18,23 @@ export function getAccessibleLinkLabel(component) {
     }
     return null;
 }
+/**
+ * An element that controls open/close state of a Duet component can itself be either a Duet component or an HTML element,
+ * this helper handles the setting of the relevant attributes accordingly.
+ *
+ * @param el Duet component or HTML element that is used for controlling the popup
+ * @param expanded is the controlled element open
+ * @param popup The type of the popup, defaults to "true" which equals to "menu"
+ */
+export function setOpenerExpanded(el, expanded, popup = "true") {
+    const isDuetComponent = el.tagName.toLowerCase().startsWith("duet-");
+    if (isDuetComponent) {
+        const comp = el;
+        comp.accessiblePopup = popup;
+        comp.accessibleExpanded = expanded;
+    }
+    else {
+        el.setAttribute("aria-haspopup", popup);
+        el.ariaExpanded = String(!!expanded);
+    }
+}

package/lib/collection/utils/language-utils.js

@@ -88,6 +88,13 @@ export const getLocaleString = (langObject, languageOverride) => {
         return obj[getLanguage()];
     }
 };
+export const formatNumber = (num, decimals, lang = getCurrentLanguage()) => {
+    return Intl.NumberFormat(lang, {
+        style: "decimal",
+        minimumFractionDigits: decimals !== null && decimals !== void 0 ? decimals : 0,
+        maximumFractionDigits: decimals !== null && decimals !== void 0 ? decimals : 100,
+    }).format(num);
+};
 /**
  * Language change observer
  *

package/lib/collection/utils/slot-utils.js

@@ -15,6 +15,10 @@ export const hasSlot = (element, slotName) => {
         ? getElementsFromNamedSlot(element, slotName).length > 0
         : getElementsFromDefaultSlot(element).length > 0;
 };
+export const getSlotTextContent = (element, slotName, separator) => {
+    const elements = slotName ? getElementsFromNamedSlot(element, slotName) : getElementsFromDefaultSlot(element);
+    return elements.map(e => e.textContent.trim()).join(separator !== null && separator !== void 0 ? separator : ", ");
+};
 /**
  * Check if the slotted element matches the given selector.
  * If not, log a warning, or log a error and remove the element.

package/lib/collection/utils/teleport.js

@@ -6,13 +6,16 @@
  * Initiate it in your component's connectedCallback.
  * Call activate() to teleport the object.
  * Call deactivate() to resume the object to its original place.
+ * Call observeDeletion() to activate deleteionObserver.
  * Call makeSiblingsInert() to add inert attribute to sibling elements.
  * Call removeInertFromSiblings() to remove inert attribute from sibling elements.
  */
 export class Teleport {
+    get isActive() {
+        return this._isTeleportSkipped() || this.element.parentElement === this.target;
+    }
     constructor(element, target) {
-        this.skipInert = ["duet-tooltip-popup"];
-        this.isActive = false;
+        this.skipInert = ["duet-tooltip-popup", ".duet-skip-teleport-inert"];
         this.element = element;
         this.target = target || document.body;
         this.teleportId = `${Math.random()}-${Date.now()}`.substring(2);
@@ -21,16 +24,20 @@ export class Teleport {
         if (this._isTeleportSkipped() || this.isActive) {
             return;
         }
-        this.isActive = true;
         this._activate();
     }
     deactivate() {
         if (this._isTeleportSkipped() || !this.isActive) {
             return;
         }
-        this.isActive = false;
         this._deactivate();
     }
+    observeDeletion() {
+        if (this._isTeleportSkipped()) {
+            return;
+        }
+        this._observeDeletion();
+    }
     makeSiblingsInert() {
         if (this._isTeleportSkipped() || !this.isActive) {
             return;
@@ -52,14 +59,22 @@ export class Teleport {
         const skipTeleport = this.element.getAttribute("skip-teleport");
         return skipTeleport !== null && skipTeleport !== "false";
     }
+    _observeDeletion() {
+        if (this.deletionObserver) {
+            this.deletionObserver.disconnect();
+        }
+        this.deletionObserver = new MutationObserver(this._deletionObserverCallback.bind(this));
+        this.deletionObserver.observe(document.documentElement, { childList: true, subtree: true });
+    }
     _activate() {
         if (!this.element.dataset.reactPortal) {
+            if (this.stub) {
+                this.stub.remove();
+            }
             this.stub = document.createElement("template");
             this.element.insertAdjacentElement("afterend", this.stub);
             this.target.appendChild(this.element);
         }
-        this.deletionObserver = new MutationObserver(this._deletionObserverCallback.bind(this));
-        this.deletionObserver.observe(document.documentElement, { childList: true, subtree: true });
     }
     _deactivate() {
         if (!this.element.dataset.reactPortal) {
@@ -81,7 +96,7 @@ export class Teleport {
     _makeSiblingsInert() {
         const siblings = Array.from(this.target.children);
         siblings.forEach(sibling => {
-            if (sibling !== this.element && !this.skipInert.includes(sibling.nodeName.toLowerCase())) {
+            if (sibling !== this.element && !this.skipInert.some(selector => sibling.matches(selector))) {
                 sibling.dataset.duetTeleportId = (sibling.dataset.duetTeleportId || "") + this.teleportId;
                 sibling.inert = true;
             }

package/lib/collection/utils/test-utils.js

@@ -17,8 +17,8 @@ export async function e2eTest(html) {
     await page.addStyleTag({ url: "http://localhost:3334/tokens/lib/tokens.custom-properties.css" });
     await page.addStyleTag({ url: "http://localhost:3334/css/lib/duet.min.css" });
     await page.setContent(html);
-    await page.addScriptTag({ url: "http://localhost:3334/build/duet.js" });
-    await page.waitForSelector("html.hydrated");
+    await page.addScriptTag({ url: "http://localhost:3334/build/duet.esm.js", type: "module" });
+    await page.waitForSelector(".hydrated");
 }
 export async function isFocused(element) {
     return element.evaluate(el => {

package/lib/collection/utils/token-utils.js

@@ -2,8 +2,16 @@
  * Built with Duet Design System
  */
 import * as tokens from "@duetds/tokens";
+import turva2ColorTokens from "./turva2-color-tokens";
 const allowedThemes = ["turva"];
 const MATCH_CAPITAL_CASE = /[A-Z]/g;
+function isTurva2() {
+    var _a;
+    if (typeof document === "undefined") {
+        return false;
+    }
+    return !!((_a = document.documentElement.attributes.getNamedItem("class")) === null || _a === void 0 ? void 0 : _a.value.includes("duet-theme-turva2"));
+}
 export function isCamelCase(str) {
     const camel = MATCH_CAPITAL_CASE.test(str);
     const barredString = !str.includes("_") && !str.includes("-") && !str.includes(" ");
@@ -54,18 +62,62 @@ function addTheme(str, theme) {
     }
     return str;
 }
+/**
+ * Add "-turva" to color names (or "Turva" to camelCase color names)
+ */
+export function postfixTheme(name, theme) {
+    if (!name) {
+        return undefined;
+    }
+    if (["", "default"].includes(theme)) {
+        return name;
+    }
+    if ((isDashCase(name) && name.endsWith(`-${theme}`)) || (isCamelCase(name) && name.endsWith(capitalize(theme)))) {
+        return name;
+    }
+    if (tokens[`color${camelize(name)}${capitalizeFirstLetter(theme)}`]) {
+        return !isCamelCase(name) ? `${name}-${theme}` : `${name}${capitalize(theme)}`;
+    }
+    return name;
+}
 export function getColorByName(name, theme = "") {
     if (!name) {
         return undefined;
     }
-    const defaultColor = convertToColorName(name);
-    const themedColor = convertToColorName(name, theme);
-    // lets just try to get the color first to save some cycles
-    let resolvedToken = tokens[themedColor];
-    if (!resolvedToken) {
-        resolvedToken = tokens[defaultColor];
+    if ((theme === "turva" || name.endsWith("-turva")) && isTurva2()) {
+        switch (name.replace(/-turva$/, "")) {
+            case "primary-lightest":
+                return turva2ColorTokens["color-turva-nude-00"];
+            case "primary-lighter":
+                return turva2ColorTokens["color-turva-nude-50"];
+            case "primary-light":
+                return turva2ColorTokens["color-turva-nude-200"];
+            case "primary":
+                return turva2ColorTokens["color-turva2-red-600"];
+            case "primary-darker":
+                return turva2ColorTokens["color-turva2-red-700"];
+            case "primary-dark":
+                return turva2ColorTokens["color-turva2-red-800"];
+            case "secondary":
+                return turva2ColorTokens["color-turva2-gray-900"];
+            case "gray-lighter":
+                return turva2ColorTokens["color-turva2-gray-00"];
+            case "gray-light":
+                return turva2ColorTokens["color-turva2-gray-100"];
+            case "gray":
+                return turva2ColorTokens["color-turva2-gray-200"];
+            case "gray-dark":
+                return turva2ColorTokens["color-turva2-gray-400"];
+            case "gray-darker":
+                return turva2ColorTokens["color-turva2-gray-500"];
+            default:
+            // carry on to old turva colors
+        }
     }
-    return resolvedToken;
+    const defaultColor = convertToColorName(name);
+    const themedColor = theme && convertToColorName(name, theme);
+    // return themed color if it exists
+    return tokens[themedColor] || tokens[defaultColor];
 }
 export function convertToColorName(name = "", theme = "") {
     let colorResolution = name;

package/lib/collection/utils/turva2-color-tokens.js

@@ -0,0 +1,42 @@
+/*!
+ * Built with Duet Design System
+ */
+const turva2ColorTokens = {
+    "color-turva2-red-00": "rgb(255, 242, 242)",
+    "color-turva2-red-50": "rgb(255, 236, 236)",
+    "color-turva2-red-100": "rgb(255, 229, 230)",
+    "color-turva2-red-200": "rgb(255, 201, 204)",
+    "color-turva2-red-300": "rgb(249, 164, 172)",
+    "color-turva2-red-400": "rgb(243, 119, 133)",
+    "color-turva2-red-500": "rgb(236, 69, 96)",
+    "color-turva2-red-600": "rgb(230, 23, 64)",
+    "color-turva2-red-700": "rgb(185, 3, 41)",
+    "color-turva2-red-800": "rgb(140, 0, 30)",
+    "color-turva2-red-900": "rgb(96, 0, 20)",
+    "color-turva2-red-1000": "rgb(51, 0, 10)",
+    "color-turva2-gray-00": "rgb(245, 246, 247)",
+    "color-turva2-gray-50": "rgb(228, 233, 237)",
+    "color-turva2-gray-100": "rgb(212, 221, 226)",
+    "color-turva2-gray-200": "rgb(178, 194, 205)",
+    "color-turva2-gray-300": "rgb(148, 169, 185)",
+    "color-turva2-gray-400": "rgb(120, 145, 164)",
+    "color-turva2-gray-500": "rgb(95, 122, 143)",
+    "color-turva2-gray-600": "rgb(72, 100, 122)",
+    "color-turva2-gray-700": "rgb(53, 79, 101)",
+    "color-turva2-gray-800": "rgb(37, 60, 80)",
+    "color-turva2-gray-900": "rgb(23, 42, 59)",
+    "color-turva2-gray-1000": "rgb(6, 23, 38)",
+    "color-turva-nude-00": "rgb(253, 247, 242)",
+    "color-turva-nude-50": "rgb(251, 235, 225)",
+    "color-turva-nude-100": "rgb(251, 225, 209)",
+    "color-turva-nude-200": "rgb(241, 202, 178)",
+    "color-turva-nude-300": "rgb(216, 174, 150)",
+    "color-turva-nude-400": "rgb(190, 147, 124)",
+    "color-turva-nude-500": "rgb(165, 122, 101)",
+    "color-turva-nude-600": "rgb(140, 98, 79)",
+    "color-turva-nude-700": "rgb(114, 76, 60)",
+    "color-turva-nude-800": "rgb(89, 56, 43)",
+    "color-turva-nude-900": "rgb(64, 38, 28)",
+    "color-turva-nude-1000": "rgb(38, 21, 15)",
+};
+export default turva2ColorTokens;