@spectrum-css/textfield - npm Package Compare versions

Comparing version 6.0.25 to 6.0.26

CHANGELOG.md

@@ -6,2 +6,9 @@ # Change Log
 
+<a name="6.0.26"></a>
+##6.0.26
+🗓
[phone] • 📝 [Commits](https://github.com/adobe/spectrum-css/compare/@spectrum-css/textfield@6.0.25...@spectrum-css/textfield@6.0.26)
+
+**Note:** Version bump only for package @spectrum-css/textfield
+
 <a name="6.0.25"></a>
@@ -8,0 +15,0 @@ ##6.0.25

metadata/mods.md

@@ -40,2 +40,3 @@ | Modifiable Custom Properties                            |
 | `--mod-textfield-icon-size-invalid`                     |
+| `--mod-textfield-icon-size-valid`                       |
 | `--mod-textfield-icon-spacing-block-invalid`            |
@@ -69,3 +70,1 @@ | `--mod-textfield-icon-spacing-block-valid`              |
 | `--mod-textfield-width`                                 |
-| `--mod-textfield-workflow-icon-gap`                     |
-| `--mod-textfield-workflow-icon-width`                   |

package.json

 {
   "name": "@spectrum-css/textfield",
-  "version": "6.0.25",
+  "version": "6.0.26",
   "description": "The Spectrum CSS textfield component",
@@ -25,4 +25,4 @@ "license": "Apache-2.0",
     "@spectrum-css/component-builder-simple": "^2.0.17",
-    "@spectrum-css/helptext": "^4.0.59",
-    "@spectrum-css/tokens": "^12.0.0",
+    "@spectrum-css/helptext": "^4.0.60",
+    "@spectrum-css/tokens": "^13.0.0",
     "gulp": "^4.0.0"
@@ -33,3 +33,3 @@ },
   },
-  "gitHead": "db5d42ecb6d0ba5fca5b7511f4cc9d8e58e637ae"
+  "gitHead": "394fdd27405bd2ecbf1aec96da58a72150b3fc9e"
 }

stories/template.js

@@ -0,6 +1,7 @@
+import { useArgs } from "@storybook/client-api";
 import { html } from "lit";
+import { classMap } from "lit/directives/class-map.js";
 import { ifDefined } from "lit/directives/if-defined.js";
-import { classMap } from "lit/directives/class-map.js";
 import { styleMap } from "lit/directives/style-map.js";
-import { useArgs } from "@storybook/client-api";
+import { when } from "lit/directives/when.js";
 
@@ -38,3 +39,3 @@ import { Template as Icon } from "@spectrum-css/icon/stories/template.js";
 	onclick,
-	styles = {},
+	customStyles = {},
 	...globals
@@ -72,3 +73,3 @@ }) => {
 			})}
-			style=${ifDefined(styleMap(styles))}
+			style=${ifDefined(styleMap(customStyles))}
 			@click=${onclick}
@@ -88,31 +89,27 @@ @focusin=${(e) => {
 		>
-			${iconName
-				? Icon({
-						...globals,
-						size,
-						iconName,
-						customClasses: [
-							!!(isInvalid || isValid)
-								? `${rootClass}-validationIcon`
-								: `${rootClass}-icon`,
-							...customIconClasses,
-						],
-				  })
-				: ""}
-			${multiline
-				? html` <textarea
-						placeholder=${ifDefined(placeholder)}
-						name=${ifDefined(name)}
-						.value=${ifDefined(value)}
-						autocomplete=${autocomplete ? undefined : "off"}
-						?required=${isRequired}
-						?disabled=${isDisabled}
-						?readonly=${ifDefined(isReadOnly)}
-						pattern=${ifDefined(pattern)}
-						class=${classMap({
-							[`${rootClass}-input`]: true,
-							...customInputClasses.reduce((a, c) => ({ ...a, [c]: true }), {}),
-						})}
-				  />`
-				: html` <input
+			${when(iconName, () => Icon({
+				...globals,
+				size,
+				iconName,
+				customClasses: [
+					!!(isInvalid || isValid)
+						? `${rootClass}-validationIcon`
+						: `${rootClass}-icon`,
+					...customIconClasses,
+				],
+			}))}
+			${when(multiline, () => html`<textarea
+				placeholder=${ifDefined(placeholder)}
+				name=${ifDefined(name)}
+				.value=${ifDefined(value)}
+				autocomplete=${autocomplete ? undefined : "off"}
+				?required=${isRequired}
+				?disabled=${isDisabled}
+				?readonly=${ifDefined(isReadOnly)}
+				pattern=${ifDefined(pattern)}
+				class=${classMap({
+					[`${rootClass}-input`]: true,
+					...customInputClasses.reduce((a, c) => ({ ...a, [c]: true }), {}),
+				})}
+			/>`, () => html` <input
 						type=${ifDefined(type)}
@@ -131,12 +128,10 @@ placeholder=${ifDefined(placeholder)}
 						})}
-				  />`}
-			${isLoading
-				? ProgressCircle({
-						isIndeterminate: true,
-						size: "s",
-						customClasses: customProgressCircleClasses,
-				  })
-				: ""}
+				  />`)}
+			${when(isLoading, () => ProgressCircle({
+				isIndeterminate: true,
+				size: "s",
+				customClasses: customProgressCircleClasses,
+			}))}
 		</div>
 	`;
 };

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

271092

increased by1.64%

Lines of code

4843

increased by1.13%

No dependency changes