@ni/nimble-components 7.2.2 → 7.4.0

package/dist/esm/tree-item/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/tree-item/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/tree-item/index.ts"],"names":[],"mappings":"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"}

package/dist/esm/tree-item/styles.d.ts

@@ -1,3 +1,3 @@
 import { ElementStyles } from '@microsoft/fast-element';
-import { ElementDefinitionContext, TreeItemOptions } from '@microsoft/fast-foundation';
-export declare const styles: (context: ElementDefinitionContext, definition: TreeItemOptions) => ElementStyles;
+import { FoundationElementTemplate, TreeItemOptions } from '@microsoft/fast-foundation';
+export declare const styles: FoundationElementTemplate<ElementStyles, TreeItemOptions>;

package/dist/esm/tree-item/styles.js

@@ -4,198 +4,198 @@ import { focusVisible } from '../utilities/style/focus';
 import { bodyFontColor, bodyFontFamily, bodyFontSize, bodyFontWeight, borderHoverColor, fillSelectedColor, fillHoverColor, fillHoverSelectedColor, borderWidth, iconSize } from '../theme-provider/design-tokens';
 import { groupSelectedAttribute } from '../tree-view/types';
 import { DirectionalStyleSheetBehavior } from '../utilities/style/direction';
-export const styles = (context) => css `
-        ${display('block')}
+export const styles = (context, _definition) => css `
+            ${display('block')}
 
-        :host {
-            ${
+            :host {
+                ${
 /* don't set font-size here or else it overrides what we set on .items */ ''}
-            font-family: ${bodyFontFamily};
-            font-weight: ${bodyFontWeight};
-            contain: content;
-            position: relative;
-            outline: none;
-            color: ${bodyFontColor};
-            cursor: pointer;
-            --ni-private-tree-item-nested-width: 0;
-        }
-
-        ${ /* this controls the side border */''}
-        :host([${groupSelectedAttribute}])::after {
-            background: ${borderHoverColor};
-            border-radius: 0px;
-            content: '';
-            display: block;
-            position: absolute;
-            top: 0px;
-            width: calc(${borderWidth} * 2);
-            height: calc(${iconSize} * 2);
-        }
-
-        .positioning-region {
-            display: flex;
-            position: relative;
-            box-sizing: border-box;
-            height: calc(${iconSize} * 2);
-        }
-
-        .positioning-region:hover {
-            background: ${fillHoverColor};
-        }
-
-        :host(${focusVisible}) .positioning-region {
-            box-shadow: 0px 0px 0px ${borderWidth} ${borderHoverColor} inset;
-            outline: ${borderWidth} solid ${borderHoverColor};
-            outline-offset: -2px;
-        }
-
-        :host([selected]) .positioning-region {
-            background: ${fillSelectedColor};
-        }
-
-        :host([selected]) .positioning-region:hover {
-            background: ${fillHoverSelectedColor};
-        }
-
-        .positioning-region::before {
-            content: '';
-            display: block;
-            width: var(--ni-private-tree-item-nested-width);
-            flex-shrink: 0;
-        }
-
-        .content-region {
-            display: inline-flex;
-            align-items: center;
-            white-space: nowrap;
-            width: 100%;
-            padding-left: 10px;
-            font: inherit;
-            font-size: ${bodyFontSize};
-            user-select: none;
-        }
-
-        :host(${focusVisible}) .content-region {
-            outline: none;
-        }
-
-        :host(.nested) .content-region {
-            position: relative;
-            margin-inline-start: ${iconSize};
-        }
-
-        :host([disabled]) .content-region {
-            opacity: 0.5;
-            cursor: not-allowed;
-        }
-
-        .expand-collapse-button {
-            background: none;
-            border: none;
-            outline: none;
-            width: ${iconSize};
-            height: ${iconSize};
-            padding: 0px;
-            justify-content: center;
-            align-items: center;
-            cursor: pointer;
-            margin-left: 10px;
-        }
-
-        :host(.nested) .expand-collapse-button {
-            position: absolute;
-        }
-
-        .expand-collapse-button svg {
-            width: ${iconSize};
-            height: ${iconSize};
-            transition: transform 0.2s ease-in;
-            pointer-events: none;
-            fill: currentcolor;
-        }
-
-        ${
+                font-family: ${bodyFontFamily};
+                font-weight: ${bodyFontWeight};
+                contain: content;
+                position: relative;
+                outline: none;
+                color: ${bodyFontColor};
+                cursor: pointer;
+                --ni-private-tree-item-nested-width: 0;
+            }
+
+            ${ /* this controls the side border */''}
+            :host([${groupSelectedAttribute}])::after {
+                background: ${borderHoverColor};
+                border-radius: 0px;
+                content: '';
+                display: block;
+                position: absolute;
+                top: 0px;
+                width: calc(${borderWidth} * 2);
+                height: calc(${iconSize} * 2);
+            }
+
+            .positioning-region {
+                display: flex;
+                position: relative;
+                box-sizing: border-box;
+                height: calc(${iconSize} * 2);
+            }
+
+            .positioning-region:hover {
+                background: ${fillHoverColor};
+            }
+
+            :host(${focusVisible}) .positioning-region {
+                box-shadow: 0px 0px 0px ${borderWidth} ${borderHoverColor} inset;
+                outline: ${borderWidth} solid ${borderHoverColor};
+                outline-offset: -2px;
+            }
+
+            :host([selected]) .positioning-region {
+                background: ${fillSelectedColor};
+            }
+
+            :host([selected]) .positioning-region:hover {
+                background: ${fillHoverSelectedColor};
+            }
+
+            .positioning-region::before {
+                content: '';
+                display: block;
+                width: var(--ni-private-tree-item-nested-width);
+                flex-shrink: 0;
+            }
+
+            .content-region {
+                display: inline-flex;
+                align-items: center;
+                white-space: nowrap;
+                width: 100%;
+                padding-left: 10px;
+                font: inherit;
+                font-size: ${bodyFontSize};
+                user-select: none;
+            }
+
+            :host(${focusVisible}) .content-region {
+                outline: none;
+            }
+
+            :host(.nested) .content-region {
+                position: relative;
+                margin-inline-start: ${iconSize};
+            }
+
+            :host([disabled]) .content-region {
+                opacity: 0.5;
+                cursor: not-allowed;
+            }
+
+            .expand-collapse-button {
+                background: none;
+                border: none;
+                outline: none;
+                width: ${iconSize};
+                height: ${iconSize};
+                padding: 0px;
+                justify-content: center;
+                align-items: center;
+                cursor: pointer;
+                margin-left: 10px;
+            }
+
+            :host(.nested) .expand-collapse-button {
+                position: absolute;
+            }
+
+            .expand-collapse-button svg {
+                width: ${iconSize};
+                height: ${iconSize};
+                transition: transform 0.2s ease-in;
+                pointer-events: none;
+                fill: currentcolor;
+            }
+
+            ${
 /* this rule keeps children without an icon text aligned with parents */ ''}
-        span[part="start"] {
-            width: ${iconSize};
-        }
+            span[part="start"] {
+                width: ${iconSize};
+            }
 
-        ${
+            ${
 /* the start class is applied when the corresponding slots is filled */ ''}
-        .start {
-            display: flex;
-            fill: currentcolor;
-            margin-inline-start: ${iconSize};
-            margin-inline-end: ${iconSize};
-        }
-
-        slot[name='start']::slotted(*) {
-            width: ${iconSize};
-            height: ${iconSize};
-        }
-
-        ::slotted(${context.tagFor(TreeItem)}) {
-            --ni-private-tree-item-nested-width: 1em;
-            --ni-private-expand-collapse-button-nested-width: calc(
-                ${iconSize} * -1
-            );
-        }
-
-        ${
-/* the end class is applied when the corresponding slots is filled */ ''}
-        .end {
-            display: flex;
-            fill: currentcolor;
-            margin-inline-start: ${iconSize};
-        }
-
-        .items {
-            display: none;
+            .start {
+                display: flex;
+                fill: currentcolor;
+                margin-inline-start: ${iconSize};
+                margin-inline-end: ${iconSize};
+            }
+
+            slot[name='start']::slotted(*) {
+                width: ${iconSize};
+                height: ${iconSize};
+            }
+
+            ::slotted(${context.tagFor(TreeItem)}) {
+                --ni-private-tree-item-nested-width: 1em;
+                --ni-private-expand-collapse-button-nested-width: calc(
+                    ${iconSize} * -1
+                );
+            }
+
             ${
+/* the end class is applied when the corresponding slots is filled */ ''}
+            .end {
+                display: flex;
+                fill: currentcolor;
+                margin-inline-start: ${iconSize};
+            }
+
+            .items {
+                display: none;
+                ${
 /*
  * this controls the nested indentation (by affecting .positioning-region::before)
  * it must minimally contain arithmetic with an em and a px value
  * make it larger or shorter by changing the px value
  */ ''}
-            font-size: calc(1em + (${iconSize} * 2));
-        }
+                font-size: calc(1em + (${iconSize} * 2));
+            }
 
-        :host([expanded]) .items {
-            display: block;
-        }
-    `
+            :host([expanded]) .items {
+                display: block;
+            }
+        `
     // prettier-ignore
     .withBehaviors(new DirectionalStyleSheetBehavior(css `
-                    ${ /* ltr styles */''}
-                    :host(.nested) .expand-collapse-button {
-                        left: var(
-                            --ni-private-expand-collapse-button-nested-width,
-                            calc(${iconSize} * -1)
-                        );
-                    }
-
-                    .expand-collapse-button svg {
-                        transform: rotate(90deg);
-                    }
-
-                    :host([expanded]) .expand-collapse-button svg {
-                        transform: rotate(180deg);
-                    }
-                `, css `
-                    ${ /* rtl styles */''}
-                    :host(.nested) .expand-collapse-button {
-                        right: var(
-                            --ni-private-expand-collapse-button-nested-width,
-                            calc(${iconSize} * -1)
-                        );
-                    }
-
-                    .expand-collapse-button svg {
-                        transform: rotate(180deg);
-                    }
-
-                    :host([expanded]) .expand-collapse-button svg {
-                        transform: rotate(135deg);
-                    }
-                `));
+                        ${ /* ltr styles */''}
+                        :host(.nested) .expand-collapse-button {
+                            left: var(
+                                --ni-private-expand-collapse-button-nested-width,
+                                calc(${iconSize} * -1)
+                            );
+                        }
+
+                        .expand-collapse-button svg {
+                            transform: rotate(90deg);
+                        }
+
+                        :host([expanded]) .expand-collapse-button svg {
+                            transform: rotate(180deg);
+                        }
+                    `, css `
+                        ${ /* rtl styles */''}
+                        :host(.nested) .expand-collapse-button {
+                            right: var(
+                                --ni-private-expand-collapse-button-nested-width,
+                                calc(${iconSize} * -1)
+                            );
+                        }
+
+                        .expand-collapse-button svg {
+                            transform: rotate(180deg);
+                        }
+
+                        :host([expanded]) .expand-collapse-button svg {
+                            transform: rotate(135deg);
+                        }
+                    `));
 //# sourceMappingURL=styles.js.map

package/dist/esm/tree-item/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/tree-item/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAiB,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EACH,OAAO,EAEP,QAAQ,EAEX,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EACH,aAAa,EACb,cAAc,EACd,YAAY,EACZ,cAAc,EACd,gBAAgB,EAChB,iBAAiB,EACjB,cAAc,EACd,sBAAsB,EACtB,WAAW,EACX,QAAQ,EACX,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,OAAO,EAAE,6BAA6B,EAAE,MAAM,8BAA8B,CAAC;AAE7E,MAAM,CAAC,MAAM,MAAM,GAGE,CAAC,OAAiC,EAAE,EAAE,CAAC,GAAG,CAAA;UACrD,OAAO,CAAC,OAAO,CAAC;;;cAGZ;AACE,yEAAyE,CAAC,EAC9E;2BACe,cAAc;2BACd,cAAc;;;;qBAIpB,aAAa;;;;;UAKxB,CAAA,mCAAoC,EAAE;iBAC/B,sBAAsB;0BACb,gBAAgB;;;;;;0BAMhB,WAAW;2BACV,QAAQ;;;;;;;2BAOR,QAAQ;;;;0BAIT,cAAc;;;gBAGxB,YAAY;sCACU,WAAW,IAAI,gBAAgB;uBAC9C,WAAW,UAAU,gBAAgB;;;;;0BAKlC,iBAAiB;;;;0BAIjB,sBAAsB;;;;;;;;;;;;;;;;;yBAiBvB,YAAY;;;;gBAIrB,YAAY;;;;;;mCAMO,QAAQ;;;;;;;;;;;;qBAYtB,QAAQ;sBACP,QAAQ;;;;;;;;;;;;;qBAaT,QAAQ;sBACP,QAAQ;;;;;;UAMpB;AACE,wEAAwE,CAAC,EAC7E;;qBAEa,QAAQ;;;UAGnB;AACE,uEAAuE,CAAC,EAC5E;;;;mCAI2B,QAAQ;iCACV,QAAQ;;;;qBAIpB,QAAQ;sBACP,QAAQ;;;oBAGV,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC;;;kBAG1B,QAAQ;;;;UAIhB;AACE,qEAAqE,CAAC,EAC1E;;;;mCAI2B,QAAQ;;;;;cAK7B;AACE;;;;GAIG,CAAC,EACR;qCACyB,QAAQ;;;;;;KAMxC;IACL,kBAAkB;KACb,aAAa,CACV,IAAI,6BAA6B,CAC7B,GAAG,CAAA;sBACO,CAAA,gBAAiB,EAAE;;;;mCAIN,QAAQ;;;;;;;;;;;iBAW1B,EACL,GAAG,CAAA;sBACO,CAAA,gBAAiB,EAAE;;;;mCAIN,QAAQ;;;;;;;;;;;iBAW1B,CACR,CACJ,CAAC"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/tree-item/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAiB,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EACH,OAAO,EAEP,QAAQ,EAEX,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EACH,aAAa,EACb,cAAc,EACd,YAAY,EACZ,cAAc,EACd,gBAAgB,EAChB,iBAAiB,EACjB,cAAc,EACd,sBAAsB,EACtB,WAAW,EACX,QAAQ,EACX,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,OAAO,EAAE,6BAA6B,EAAE,MAAM,8BAA8B,CAAC;AAE7E,MAAM,CAAC,MAAM,MAAM,GAA8D,CAAC,OAAO,EAAE,WAAW,EAAE,EAAE,CAAC,GAAG,CAAA;cAChG,OAAO,CAAC,OAAO,CAAC;;;kBAGZ;AACE,yEAAyE,CAAC,EAC9E;+BACe,cAAc;+BACd,cAAc;;;;yBAIpB,aAAa;;;;;cAKxB,CAAA,mCAAoC,EAAE;qBAC/B,sBAAsB;8BACb,gBAAgB;;;;;;8BAMhB,WAAW;+BACV,QAAQ;;;;;;;+BAOR,QAAQ;;;;8BAIT,cAAc;;;oBAGxB,YAAY;0CACU,WAAW,IAAI,gBAAgB;2BAC9C,WAAW,UAAU,gBAAgB;;;;;8BAKlC,iBAAiB;;;;8BAIjB,sBAAsB;;;;;;;;;;;;;;;;;6BAiBvB,YAAY;;;;oBAIrB,YAAY;;;;;;uCAMO,QAAQ;;;;;;;;;;;;yBAYtB,QAAQ;0BACP,QAAQ;;;;;;;;;;;;;yBAaT,QAAQ;0BACP,QAAQ;;;;;;cAMpB;AACE,wEAAwE,CAAC,EAC7E;;yBAEa,QAAQ;;;cAGnB;AACE,uEAAuE,CAAC,EAC5E;;;;uCAI2B,QAAQ;qCACV,QAAQ;;;;yBAIpB,QAAQ;0BACP,QAAQ;;;wBAGV,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC;;;sBAG1B,QAAQ;;;;cAIhB;AACE,qEAAqE,CAAC,EAC1E;;;;uCAI2B,QAAQ;;;;;kBAK7B;AACE;;;;GAIG,CAAC,EACR;yCACyB,QAAQ;;;;;;SAMxC;IACT,kBAAkB;KACb,aAAa,CACV,IAAI,6BAA6B,CAC7B,GAAG,CAAA;0BACW,CAAA,gBAAiB,EAAE;;;;uCAIN,QAAQ;;;;;;;;;;;qBAW1B,EACT,GAAG,CAAA;0BACW,CAAA,gBAAiB,EAAE;;;;uCAIN,QAAQ;;;;;;;;;;;qBAW1B,CACZ,CACJ,CAAC"}

package/dist/esm/tree-view/index.d.ts

@@ -1,6 +1,5 @@
 import { TreeView as FoundationTreeView } from '@microsoft/fast-foundation';
 import { TreeViewSelectionMode } from './types';
-export type { TreeView };
 declare global {
     interface HTMLElementTagNameMap {
         'nimble-tree-view': TreeView;
@@ -16,6 +15,6 @@ declare global {
  * Generates HTML Element: \<nimble-tree-view\>
  *
  */
-declare class TreeView extends FoundationTreeView {
+export declare class TreeView extends FoundationTreeView {
     selectionMode: TreeViewSelectionMode;
 }

package/dist/esm/tree-view/index.js

@@ -13,7 +13,7 @@ import { TreeViewSelectionMode } from './types';
  * Generates HTML Element: \<nimble-tree-view\>
  *
  */
-class TreeView extends FoundationTreeView {
+export class TreeView extends FoundationTreeView {
     constructor() {
         super(...arguments);
         this.selectionMode = TreeViewSelectionMode.All;
@@ -25,7 +25,6 @@ __decorate([
 const nimbleTreeView = TreeView.compose({
     baseName: 'tree-view',
     baseClass: FoundationTreeView,
-    // @ts-expect-error FAST templates have incorrect type, see: https://github.com/microsoft/fast/issues/5047
     template,
     styles
 });

package/dist/esm/tree-view/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/tree-view/index.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EACH,gBAAgB,IAAI,QAAQ,EAC5B,QAAQ,IAAI,kBAAkB,EAC9B,YAAY,EACf,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAUhD;;;;;;;;;GASG;AACH,MAAM,QAAS,SAAQ,kBAAkB;IAAzC;;QAEW,kBAAa,GAA0B,qBAAqB,CAAC,GAAG,CAAC;IAC5E,CAAC;CAAA;AADG;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;+CACkC;AAG5E,MAAM,cAAc,GAAG,QAAQ,CAAC,OAAO,CAAC;IACpC,QAAQ,EAAE,WAAW;IACrB,SAAS,EAAE,kBAAkB;IAC7B,0GAA0G;IAC1G,QAAQ;IACR,MAAM;CACT,CAAC,CAAC;AAEH,YAAY,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC,cAAc,EAAE,CAAC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/tree-view/index.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EACH,gBAAgB,IAAI,QAAQ,EAC5B,QAAQ,IAAI,kBAAkB,EAC9B,YAAY,EACf,MAAM,4BAA4B,CAAC;AACpC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAQhD;;;;;;;;;GASG;AACH,MAAM,OAAO,QAAS,SAAQ,kBAAkB;IAAhD;;QAEW,kBAAa,GAA0B,qBAAqB,CAAC,GAAG,CAAC;IAC5E,CAAC;CAAA;AADG;IADC,IAAI,CAAC,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;+CACkC;AAG5E,MAAM,cAAc,GAAG,QAAQ,CAAC,OAAO,CAAC;IACpC,QAAQ,EAAE,WAAW;IACrB,SAAS,EAAE,kBAAkB;IAC7B,QAAQ;IACR,MAAM;CACT,CAAC,CAAC;AAEH,YAAY,CAAC,WAAW,EAAE,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,QAAQ,CAAC,cAAc,EAAE,CAAC,CAAC"}

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@ni/nimble-components",
-  "version": "7.2.2",
+  "version": "7.4.0",
   "description": "Styled web components for the NI Nimble Design System",
   "scripts": {
-    "build": "npm run generate-icons && npm run build-components && npm run generate-scss && npm run build-storybook",
+    "build": "npm run generate-icons && npm run build-components && npm run bundle-components && npm run generate-scss && npm run build-storybook",
     "lint": "npm run eslint && npm run prettier",
     "format": "npm run eslint-fix && npm run prettier-fix",
     "eslint": "eslint .",
@@ -16,6 +16,7 @@
     "build-storybook": "build-storybook -o dist/storybook",
     "build-components": "tsc -p ./tsconfig.json",
     "build-components:watch": "tsc -p ./tsconfig.json -w",
+    "bundle-components": "rollup --config",
     "generate-icons": "npm run generate-icons:bundle && npm run generate-icons:run",
     "generate-icons:bundle": "rollup --config build/generate-icons/rollup.config.js",
     "generate-icons:run": "node build/generate-icons/dist/index.js",
@@ -46,8 +47,8 @@
   "homepage": "https://github.com/ni/nimble#readme",
   "dependencies": {
     "@microsoft/fast-animation": "^4.1.8",
-    "@microsoft/fast-element": "^1.7.0",
-    "@microsoft/fast-foundation": "^2.28.0 <2.29.0",
+    "@microsoft/fast-element": "^1.8.0",
+    "@microsoft/fast-foundation": "^2.37.1",
     "@microsoft/fast-web-utilities": "^5.1.0",
     "@ni/nimble-tokens": "^3.0.1",
     "hex-rgb": "^5.0.0"
@@ -58,6 +59,7 @@
     "@babel/preset-env": "^7.13.15",
     "@ni/eslint-config-javascript": "^3.1.0",
     "@ni/eslint-config-typescript": "^3.0.5",
+    "@rollup/plugin-commonjs": "^21.0.2",
     "@rollup/plugin-node-resolve": "13.1.3",
     "@storybook/addon-a11y": "^6.4.9",
     "@storybook/addon-actions": "^6.4.9",
@@ -95,6 +97,8 @@
     "prettier-eslint-cli": "^5.0.1",
     "puppeteer": "^10.1.0",
     "rollup": "^2.61.1",
+    "rollup-plugin-terser": "^7.0.2",
+    "rollup-plugin-transform-tagged-template": "^0.0.3",
     "storybook-addon-xd-designs": "^6.0.0",
     "ts-loader": "^9.2.5",
     "typescript": "^4.3.2",