@ni/nimble-components 8.0.1 → 8.1.0

package/dist/esm/nimble-components/src/text-field/types.d.ts

@@ -17,5 +17,6 @@ export declare type TextFieldAppearanceAttribute = `${TextFieldAppearance}`;
 export declare enum TextFieldAppearance {
     Underline = "underline",
     Outline = "outline",
-    Block = "block"
+    Block = "block",
+    Frameless = "frameless"
 }

package/dist/esm/text-field/styles.js

@@ -59,11 +59,8 @@ export const styles = css `
         border-bottom-color: ${failColor};
     }
 
-    :host([readonly]:not([disabled])) .root {
-        border: ${borderWidth} solid rgba(${borderRgbPartialColor}, 0.1);
-        padding: 0px;
-        padding-bottom: 1px;
-        background-color: transparent;
+    :host([readonly]) .root {
+        border-color: rgba(${borderRgbPartialColor}, 0.1);
     }
 
     :host([disabled]) .root {
@@ -77,6 +74,10 @@ export const styles = css `
         border-bottom-color: ${borderHoverColor};
     }
 
+    :host([readonly]) .root:hover {
+        --ni-private-bottom-border-width: 1px;
+    }
+
     :host([disabled]) .root:hover {
         --ni-private-bottom-border-width: 1px;
     }
@@ -176,10 +177,6 @@ export const styles = css `
         white-space: nowrap;
     }
 
-    :host(.invalid[readonly]:not([disabled])) .errortext {
-        top: calc(${controlHeight} - ${borderWidth});
-    }
-
     :host(.invalid) .error-text:empty {
         display: none;
     }
@@ -203,6 +200,14 @@ export const styles = css `
                 padding-left: ${borderWidth};
                 padding-right: ${borderWidth};
             }
+
+            :host([disabled]) .root {
+                border-color: rgba(${borderRgbPartialColor}, 0.1);
+            }
+
+            :host([disabled]) .root:hover {
+                --ni-private-bottom-border-width: 1px;
+            }
         `), appearanceBehavior(TextFieldAppearance.Block, css `
             .root {
                 background-color: rgba(${borderRgbPartialColor}, 0.1);
@@ -232,6 +237,11 @@ export const styles = css `
                 );
             }
 
+            :host([readonly]) .root {
+                background-color: rgba(${borderRgbPartialColor}, 0.07);
+                border-color: transparent;
+            }
+
             :host([disabled]) .root {
                 background-color: rgba(${borderRgbPartialColor}, 0.07);
             }
@@ -253,6 +263,21 @@ export const styles = css `
             :host(.invalid) .errortext {
                 top: calc(${controlHeight} - ${borderWidth});
             }
+        `), appearanceBehavior(TextFieldAppearance.Frameless, css `
+            .root {
+                --ni-private-bottom-border-width: 0px;
+                padding-top: ${borderWidth};
+                padding-left: ${borderWidth};
+                padding-right: ${borderWidth};
+            }
+
+            :host([readonly]) .root {
+                border-color: transparent;
+            }
+
+            .root:hover {
+                --ni-private-bottom-border-width: 0px;
+            }
         `), themeBehavior(css `
             ${'' /* Light theme */}
             .control::-ms-reveal {

package/dist/esm/text-field/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/text-field/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAErD,OAAO,EACH,qBAAqB,EACrB,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,qBAAqB,EACrB,aAAa,EACb,aAAa,EACb,SAAS,EACT,2BAA2B,EAC3B,QAAQ,EACR,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,QAAQ,EACR,qBAAqB,EACrB,6BAA6B,EAC7B,eAAe,EAClB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAEzD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,cAAc,CAAC;;;gBAGb,QAAQ;;;;iBAIP,aAAa;uBACP,WAAW,MAAM,aAAa;;;;iBAIpC,qBAAqB;;;;;iBAKrB,qBAAqB;gBACtB,gBAAgB;;;;iBAIf,6BAA6B;;;;;;;;;;oCAUV,UAAU,oBAAoB,UAAU;;;iCAG3C,qBAAqB;;;;;;;;;;;;;;;+BAevB,SAAS;;;;kBAItB,WAAW,eAAe,qBAAqB;;;;;;;6BAOpC,qBAAqB;;;;;;;+BAOnB,gBAAgB;;;;;;;;+BAQhB,gBAAgB;;;;;;;;;;;;;;;cAejC,aAAa,MAAM,WAAW;;;;;;6BAMf,eAAe;8BACd,eAAe;;;;;;;;;;;;;iBAa5B,qBAAqB;2BACX,2BAA2B;;;;iBAIrC,qBAAqB;;;;;;;;iBAQrB,qBAAqB;;;;;;;;;;;;;;;;kBAgBpB,QAAQ;iBACT,QAAQ;;;;;;gBAMT,SAAS;;;;gBAIT,qBAAqB;;;;;;;;;gBASrB,aAAa;iBACZ,SAAS;;;eAGX,aAAa;;;;;;;oBAOR,aAAa,MAAM,WAAW;;;;;;;;iBAQjC,qBAAqB;;;;;;;;;UAS5B,aAAa,CAAC,iBAAiB;;CAExC,CAAC,aAAa,CACP,kBAAkB,CACd,mBAAmB,CAAC,SAAS,EAC7B,GAAG,CAAA;;;+BAGgB,WAAW;gCACV,WAAW;iCACV,WAAW;;SAEnC,CACA,EACD,kBAAkB,CACd,mBAAmB,CAAC,KAAK,EACzB,GAAG,CAAA;;yCAE0B,qBAAqB;;+BAE/B,WAAW;gCACV,WAAW;iCACV,WAAW;;;;;;;;;;;;;;;;;;;;;;;;yCAwBH,qBAAqB;;;;;;;;;;SAUrD,CACA,EACD,kBAAkB,CACd,mBAAmB,CAAC,OAAO,EAC3B,GAAG,CAAA;;;gCAGiB,WAAW;;;;;4BAKf,aAAa,MAAM,WAAW;;SAEjD,CACA,EACD,aAAa,CACT,GAAG,CAAA;cACD,EAAE,CAAC,iBAAiB;;;;SAIzB,EACG,GAAG,CAAA;cACD,EAAE,CAAC,gBAAgB;;;;SAIxB;AACG,cAAc;AACd,KAAK,CAAC,IAAI,CACb,CACJ,CAAC"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/text-field/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AAErD,OAAO,EACH,qBAAqB,EACrB,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,qBAAqB,EACrB,aAAa,EACb,aAAa,EACb,SAAS,EACT,2BAA2B,EAC3B,QAAQ,EACR,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,QAAQ,EACR,qBAAqB,EACrB,6BAA6B,EAC7B,eAAe,EAClB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAEzD,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;MACnB,OAAO,CAAC,cAAc,CAAC;;;gBAGb,QAAQ;;;;iBAIP,aAAa;uBACP,WAAW,MAAM,aAAa;;;;iBAIpC,qBAAqB;;;;;iBAKrB,qBAAqB;gBACtB,gBAAgB;;;;iBAIf,6BAA6B;;;;;;;;;;oCAUV,UAAU,oBAAoB,UAAU;;;iCAG3C,qBAAqB;;;;;;;;;;;;;;;+BAevB,SAAS;;;;6BAIX,qBAAqB;;;;6BAIrB,qBAAqB;;;;;;;+BAOnB,gBAAgB;;;;;;;;;;;;+BAYhB,gBAAgB;;;;;;;;;;;;;;;cAejC,aAAa,MAAM,WAAW;;;;;;6BAMf,eAAe;8BACd,eAAe;;;;;;;;;;;;;iBAa5B,qBAAqB;2BACX,2BAA2B;;;;iBAIrC,qBAAqB;;;;;;;;iBAQrB,qBAAqB;;;;;;;;;;;;;;;;kBAgBpB,QAAQ;iBACT,QAAQ;;;;;;gBAMT,SAAS;;;;gBAIT,qBAAqB;;;;;;;;;gBASrB,aAAa;iBACZ,SAAS;;;eAGX,aAAa;;;;;;;;;;;iBAWX,qBAAqB;;;;;;;;;UAS5B,aAAa,CAAC,iBAAiB;;CAExC,CAAC,aAAa,CACP,kBAAkB,CACd,mBAAmB,CAAC,SAAS,EAC7B,GAAG,CAAA;;;+BAGgB,WAAW;gCACV,WAAW;iCACV,WAAW;;;;qCAIP,qBAAqB;;;;;;SAMjD,CACA,EACD,kBAAkB,CACd,mBAAmB,CAAC,KAAK,EACzB,GAAG,CAAA;;yCAE0B,qBAAqB;;+BAE/B,WAAW;gCACV,WAAW;iCACV,WAAW;;;;;;;;;;;;;;;;;;;;;;;;yCAwBH,qBAAqB;;;;;yCAKrB,qBAAqB;;;;;;;;;;SAUrD,CACA,EACD,kBAAkB,CACd,mBAAmB,CAAC,OAAO,EAC3B,GAAG,CAAA;;;gCAGiB,WAAW;;;;;4BAKf,aAAa,MAAM,WAAW;;SAEjD,CACA,EACD,kBAAkB,CACd,mBAAmB,CAAC,SAAS,EAC7B,GAAG,CAAA;;;+BAGgB,WAAW;gCACV,WAAW;iCACV,WAAW;;;;;;;;;;SAUnC,CACA,EACD,aAAa,CACT,GAAG,CAAA;cACD,EAAE,CAAC,iBAAiB;;;;SAIzB,EACG,GAAG,CAAA;cACD,EAAE,CAAC,gBAAgB;;;;SAIxB;AACG,cAAc;AACd,KAAK,CAAC,IAAI,CACb,CACJ,CAAC"}

package/dist/esm/text-field/types.d.ts

@@ -17,5 +17,6 @@ export declare type TextFieldAppearanceAttribute = `${TextFieldAppearance}`;
 export declare enum TextFieldAppearance {
     Underline = "underline",
     Outline = "outline",
-    Block = "block"
+    Block = "block",
+    Frameless = "frameless"
 }

package/dist/esm/text-field/types.js

@@ -11,5 +11,6 @@ export var TextFieldAppearance;
     TextFieldAppearance["Underline"] = "underline";
     TextFieldAppearance["Outline"] = "outline";
     TextFieldAppearance["Block"] = "block";
+    TextFieldAppearance["Frameless"] = "frameless";
 })(TextFieldAppearance || (TextFieldAppearance = {}));
 //# sourceMappingURL=types.js.map

package/dist/esm/text-field/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/text-field/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAO3D;;GAEG;AACH,OAAO,EAAE,aAAa,EAAE,CAAC;AAOzB;;GAEG;AACH,MAAM,CAAN,IAAY,mBAIX;AAJD,WAAY,mBAAmB;IAC3B,8CAAuB,CAAA;IACvB,0CAAmB,CAAA;IACnB,sCAAe,CAAA;AACnB,CAAC,EAJW,mBAAmB,KAAnB,mBAAmB,QAI9B"}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/text-field/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAO3D;;GAEG;AACH,OAAO,EAAE,aAAa,EAAE,CAAC;AAOzB;;GAEG;AACH,MAAM,CAAN,IAAY,mBAKX;AALD,WAAY,mBAAmB;IAC3B,8CAAuB,CAAA;IACvB,0CAAmB,CAAA;IACnB,sCAAe,CAAA;IACf,8CAAuB,CAAA;AAC3B,CAAC,EALW,mBAAmB,KAAnB,mBAAmB,QAK9B"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ni/nimble-components",
-  "version": "8.0.1",
+  "version": "8.1.0",
   "description": "Styled web components for the NI Nimble Design System",
   "scripts": {
     "build": "npm run generate-icons && npm run build-components && npm run bundle-components && npm run generate-scss && npm run build-storybook",
@@ -50,7 +50,7 @@
     "@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",
+    "@ni/nimble-tokens": "^3.0.2",
     "hex-rgb": "^5.0.0"
   },
   "devDependencies": {
@@ -97,8 +97,8 @@
     "prettier-eslint-cli": "^5.0.1",
     "puppeteer": "^10.1.0",
     "rollup": "^2.61.1",
+    "rollup-plugin-sourcemaps": "^0.6.3",
     "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",