feat(input-text): add component tokens by anveshmekala · Pull Request #12242 · Esri/calcite-design-system

anveshmekala · 2025-05-28T23:11:12Z

Related Issue: #7180

Summary

Adds following tokens in input-text component

--calcite-input-action-background-color: Specifies the background color of the component's clearable element.
--calcite-input-action-background-color-hover: Specifies the background color of the component's clearable element when hovered.
--calcite-input-action-background-color-press: Specifies the background color of the component's clearable element when pressed.
--calcite-input-action-icon-color: Specifies the icon color of the component's clearable & icon elements.
--calcite-input-action-icon-color-hover: Specifies the icon color of the component's clearable & icon elements when hovered.
--calcite-input-action-icon-color-press: Specifies the icon color of the component's clearable & icon elements when pressed.
--calcite-input-loading-background-color: Specifies the background color of the loading element.
--calcite-input-loading-fill-color: Specifies the fill color of the loading element.
--calcite-input-prefix-background-color: When prefixText is provided, specifies the background color of the component's prefix element.
--calcite-input-prefix-size-x: When prefixText is provided, specifies the width of the component's prefix element.
--calcite-input-prefix-text-color: When prefixText is provided, specifies the text color of the component's prefix element.
--calcite-input-suffix-background-color: When suffixText is provided, specifies the background color of the component's suffix element.
--calcite-input-suffix-size-x: When suffixText is provided, specifies the width of the component's suffix element.
--calcite-input-suffix-text-color: When suffixText is provided, specifies the color of the component's suffix element.
--calcite-input-text-background-color: Specifies the component's background color.
--calcite-input-text-border-color: Specifies the component's border color.
--calcite-input-text-corner-radius: Specifies the component's border radius.
--calcite-input-text-icon-color: Specifies the component's icon color.
--calcite-input-text-placeholder-text-color: Specifies the component's placeholder text color.
--calcite-input-text-text-color: Specifies the component's text color.
--calcite-input-text-text-color-focus: Specifies the component's text color when focused.

driskull

The changes look good. My comments are mostly regarding naming consistency and the height var.

driskull · 2025-06-02T20:44:05Z

 *
- * @prop --calcite-input-prefix-size: Specifies the component's prefix width.
- * @prop --calcite-input-suffix-size: Specifies the component's suffix width.
+ * @prop --calcite-input-actions-background-color: Specifies the background color of the component's `clearable` element.


Not really related but should --calcite-input-actions be --calcite-input-action? I'm not sure why actions is plural here since we're referencing a component. I don't think we do -icons- in other places where more than one icon is present.

Good Point. This is chosen to match existing naming patterns. Both input & input-number uses this pattern for tokens. Though input, input-number have multiple action elements, input-text has only one.

--calcite-input-action makes sense here. Should this be changed in other places too?

Should this be changed in other places too?

It would be nice but it would mean deprecating and then removing later if they have already been released. I'd like to hear from @jcfranco on if we should rename them. We may need to update our guidelines to not have tokens representing other components to be plural.

Agreed on avoiding plurals in naming when possible. A nice side benefit is that it avoids having to rename if the prop target shifts between one and many.

In terms of this PR, input-text can use the revised slot names. We can deprecate the existing ones in a follow-up PR aimed at 25.R3, which will be removed in 4.0 (26.R1). cc @geospatialem @DitwanP @isaacbraun

Worth noting that autocomplete and filter also use similarly named props.

We may need to update our guidelines to not have tokens representing other components to be plural.

Good idea. We may be able to prevent this via linting too, but we'll need to do some investigation.

In terms of this PR, input-text can use the revised slot names. We can deprecate the existing ones in a follow-up PR aimed at 25.R3, which will be removed in 4.0 (26.R1). cc @geospatialem @DitwanP @isaacbraun

Created #12356 for tracking

driskull · 2025-06-02T20:45:08Z

+ * @prop --calcite-input-prefix-size: Specifies the width of the prefix element.
+ * @prop --calcite-input-prefix-text-color: Specifies the text color of the prefix element.
+ * @prop --calcite-input-suffix-background-color: Specifies the background color of the suffix element.
+ * @prop --calcite-input-suffix-size: Specifies the width of the suffix element.


I think we've had other discussion on what to name size vars. Should this be width or size-x? If its just size its not apparent it is for the width.

@driskull As discussed, this should be size-x i believe.

Added #12394

driskull · 2025-06-02T20:46:42Z

  & .suffix {
-    @apply text-n2h h-6;
+    @apply text-n2h;
+    block-size: var(--calcite-input-text-height, 1.5rem);


Why do we need to set the height? Shouldn't just font-size and line-height be enough?

It is enough to set the height but i believe the desired height is different from what font-size & line-height.

Adding @macandcheese for more thoughts.

github-actions · 2025-06-13T02:10:41Z

This PR has been automatically marked as stale because it has not had recent activity. Please close your PR if it is no longer relevant. Thank you for your contributions.

driskull

LGTM!

geospatialem

Awesome @anveshmekal! ✨💪🏻✨ Have a few doc consistency suggestions for consideration below. 📚

geospatialem · 2025-06-21T17:01:43Z

+ * @prop --calcite-input-action-background-color: Specifies the background color of the component's `clearable` element.
+ * @prop --calcite-input-action-background-color-hover: Specifies the background color of the component's `clearable` element when hovered.
+ * @prop --calcite-input-action-background-color-press: Specifies the background color of the component's `clearable` element when pressed.
+ * @prop --calcite-input-action-icon-color: Specifies the icon color of the component's `clearable` & icon elements.
+ * @prop --calcite-input-action-icon-color-hover: Specifies the icon color of the component's `clearable` & icon elements when hovered.
+ * @prop --calcite-input-action-icon-color-press: Specifies the icon color of the component's `clearable` & icon elements when pressed.
+ * @prop --calcite-input-loading-background-color: Specifies the background color of the `loading` element.
+ * @prop --calcite-input-loading-fill-color: Specifies the fill color of the `loading` element.
+ * @prop --calcite-input-prefix-background-color: Specifies the background color of the prefix element.
+ * @prop --calcite-input-prefix-width: Specifies the width of the prefix element.
+ * @prop --calcite-input-prefix-text-color: Specifies the text color of the prefix element.
+ * @prop --calcite-input-suffix-background-color: Specifies the background color of the suffix element.
+ * @prop --calcite-input-suffix-width: Specifies the width of the suffix element.
+ * @prop --calcite-input-suffix-text-color: Specifies the text color of the suffix element.
+ * @prop --calcite-input-text-background-color: Specifies background color of the component.
+ * @prop --calcite-input-text-border-color: Specifies the border color of the component.
+ * @prop --calcite-input-text-corner-radius: Specifies the border radius of the component.
+ * @prop --calcite-input-text-placeholder-text-color: Specifies the text color of the placeholder in the component.
+ * @prop --calcite-input-text-text-color: Specifies the text color of the component.
+ * @prop --calcite-input-text-text-color-focus: Specifies the text color of the component when focused.


Few doc consistency suggestions:

Suggested change

* @prop --calcite-input-action-background-color: Specifies the background color of the component's `clearable` element.

* @prop --calcite-input-action-background-color-hover: Specifies the background color of the component's `clearable` element when hovered.

* @prop --calcite-input-action-background-color-press: Specifies the background color of the component's `clearable` element when pressed.

* @prop --calcite-input-action-icon-color: Specifies the icon color of the component's `clearable` & icon elements.

* @prop --calcite-input-action-icon-color-hover: Specifies the icon color of the component's `clearable` & icon elements when hovered.

* @prop --calcite-input-action-icon-color-press: Specifies the icon color of the component's `clearable` & icon elements when pressed.

* @prop --calcite-input-loading-background-color: Specifies the background color of the `loading` element.

* @prop --calcite-input-loading-fill-color: Specifies the fill color of the `loading` element.

* @prop --calcite-input-prefix-background-color: Specifies the background color of the prefix element.

* @prop --calcite-input-prefix-width: Specifies the width of the prefix element.

* @prop --calcite-input-prefix-text-color: Specifies the text color of the prefix element.

* @prop --calcite-input-suffix-background-color: Specifies the background color of the suffix element.

* @prop --calcite-input-suffix-width: Specifies the width of the suffix element.

* @prop --calcite-input-suffix-text-color: Specifies the text color of the suffix element.

* @prop --calcite-input-text-background-color: Specifies background color of the component.

* @prop --calcite-input-text-border-color: Specifies the border color of the component.

* @prop --calcite-input-text-corner-radius: Specifies the border radius of the component.

* @prop --calcite-input-text-placeholder-text-color: Specifies the text color of the placeholder in the component.

* @prop --calcite-input-text-text-color: Specifies the text color of the component.

* @prop --calcite-input-text-text-color-focus: Specifies the text color of the component when focused.

* @prop --calcite-input-action-background-color: Specifies the background color of the component's `clearable` element.

* @prop --calcite-input-action-background-color-hover: Specifies the background color of the component's `clearable` element when hovered.

* @prop --calcite-input-action-background-color-press: Specifies the background color of the component's `clearable` element when pressed.

* @prop --calcite-input-action-icon-color: Specifies the icon color of the component's `clearable` & icon elements.

* @prop --calcite-input-action-icon-color-hover: Specifies the icon color of the component's `clearable` & icon elements when hovered.

* @prop --calcite-input-action-icon-color-press: Specifies the icon color of the component's `clearable` & icon elements when pressed.

* @prop --calcite-input-loading-background-color: Specifies the background color of the `loading` element.

* @prop --calcite-input-loading-fill-color: Specifies the fill color of the `loading` element.

* @prop --calcite-input-prefix-background-color: When `prefixText` is provided, specifies the background color of the component's prefix element.

* @prop --calcite-input-prefix-width: When `prefixText` is provided, specifies the width of the component's prefix element.

* @prop --calcite-input-prefix-text-color: When `prefixText` is provided, specifies the text color of the component's prefix element.

* @prop --calcite-input-suffix-background-color: When `suffixText` is provided, specifies the background color of the component's suffix element.

* @prop --calcite-input-suffix-width: When suffixText` is provided, specifies the width of the component's suffix element.

* @prop --calcite-input-suffix-text-color: When `suffixText` is provided, specifies the color of the component's suffix element.

* @prop --calcite-input-text-background-color: Specifies the component's background color.

* @prop --calcite-input-text-border-color: Specifies the component's border color.

* @prop --calcite-input-text-corner-radius: Specifies the component's border radius.

* @prop --calcite-input-text-placeholder-text-color: Specifies the component's `placeholder` text color.

* @prop --calcite-input-text-text-color: Specifies the component's text color.

* @prop --calcite-input-text-text-color-focus: Specifies the component's text color when focused.

driskull · 2025-06-25T21:25:32Z

👍

matgalla · 2025-06-26T16:22:18Z

Thinking about --calcite-input-action-icon-color -

Currently, Action's --calcite-action-text-color changes both the text and the icon. If we want to support a new Action token, --calcite-action-icon-color then that would line up with this Input Text token.
That said, even if we don't make any changes to Action tokens, I still think the name you have now is better than using -text from Action. Just wanted to mention this in case we want to add a new token to Action to match.

ashetland · 2025-06-26T16:27:05Z

 *
- * @prop --calcite-input-prefix-size: Specifies the component's prefix width.
- * @prop --calcite-input-suffix-size: Specifies the component's suffix width.
+ * @prop --calcite-input-action-background-color: Specifies the background color of the component's `clearable` element.


Should these all be labeled --calcite-input-text-action...?

Just realized that only these use the full "input-text". Is that intentional?

--calcite-input-text-background-color --calcite-input-text-border-color --calcite-input-text-corner-radius --calcite-input-text-placeholder-text-color --calcite-input-text-text-color --calcite-input-text-text-color-focus

Since input components share the same design pattern, we were using generic token names such as --calcite-input-action-background-color instead of --calcite-input-text-action-background-color.

Similar to whats discussed here #10206 (comment)

macandcheese

Awesome!

anveshmekala · 2025-06-26T18:00:14Z

Thinking about --calcite-input-action-icon-color -

Currently, Action's --calcite-action-text-color changes both the text and the icon. If we want to support a new Action token, --calcite-action-icon-color then that would line up with this Input Text token.
That said, even if we don't make any changes to Action tokens, I still think the name you have now is better than using -text from Action. Just wanted to mention this in case we want to add a new token to Action to match.

Good Point. This made me relook and figured I missed the token for icon in input-text here .

Must have slipped through in input-number too.

ashetland · 2025-06-26T18:27:11Z

 * @prop --calcite-input-text-background-color: Specifies the component's background color.
 * @prop --calcite-input-text-border-color: Specifies the component's border color.
 * @prop --calcite-input-text-corner-radius: Specifies the component's border radius.
+ * @prop --calcite-input-text-icon-color: Specifies the component's icon color.


I think we're missing this on Input Number.

Ha! You caught that too.

**Related Issue:** #7180 ## Summary Adds following tokens in `input-text` component `--calcite-input-action-background-color`: Specifies the background color of the component's `clearable` element. `--calcite-input-action-background-color-hover`: Specifies the background color of the component's `clearable` element when hovered. `--calcite-input-action-background-color-press`: Specifies the background color of the component's `clearable` element when pressed. `--calcite-input-action-icon-color`: Specifies the icon color of the component's `clearable` & icon elements. `--calcite-input-action-icon-color-hover`: Specifies the icon color of the component's `clearable` & icon elements when hovered. `--calcite-input-action-icon-color-press`: Specifies the icon color of the component's `clearable` & icon elements when pressed. `--calcite-input-loading-background-color`: Specifies the background color of the `loading` element. `--calcite-input-loading-fill-color`: Specifies the fill color of the `loading` element. `--calcite-input-prefix-background-color`: When `prefixText` is provided, specifies the background color of the component's prefix element. `--calcite-input-prefix-size-x`: When `prefixText` is provided, specifies the width of the component's prefix element. `--calcite-input-prefix-text-color`: When `prefixText` is provided, specifies the text color of the component's prefix element. `--calcite-input-suffix-background-color`: When `suffixText` is provided, specifies the background color of the component's suffix element. `--calcite-input-suffix-size-x`: When `suffixText` is provided, specifies the width of the component's suffix element. `--calcite-input-suffix-text-color`: When `suffixText` is provided, specifies the color of the component's suffix element. `--calcite-input-text-background-color`: Specifies the component's background color. `--calcite-input-text-border-color`: Specifies the component's border color. `--calcite-input-text-corner-radius`: Specifies the component's border radius. `--calcite-input-text-placeholder-text-color`: Specifies the component's `placeholder` text color. `--calcite-input-text-text-color`: Specifies the component's text color. `--calcite-input-text-text-color-focus`: Specifies the component's text color when focused.

🤖 I have created a release *beep* *boop* --- <details><summary>@esri/calcite-design-tokens: 3.2.0</summary> ## [3.2.0](https://github.com/Esri/calcite-design-system/compare/@esri/calcite-design-tokens@3.1.0...@esri/calcite-design-tokens@3.2.0) (2025-09-16) ### Features * **tokens:** Add foreground-highlight and update referenced core tokens ([#12266](#12266)) ([cf44406](cf44406)) * **tokens:** Add missing line height tokens ([#12798](#12798)) ([3bf135d](3bf135d)) ### Bug Fixes * Remove breakpoint tokens from semantic output ([#12397](#12397)) ([0f22083](0f22083)) * **tokens:** Restore `--calcite-color-focus` ([#11960](#11960)) ([0432a20](0432a20)) * **tokens:** Update `--calcite-font-line-height-relative` to resolve as a valid value ([#12828](#12828)) ([458f99d](458f99d)) </details> <details><summary>@esri/calcite-tailwind-preset: 1.0.1</summary> ## [1.0.1](https://github.com/Esri/calcite-design-system/compare/@esri/calcite-tailwind-preset@1.0.0...@esri/calcite-tailwind-preset@1.0.1) (2025-09-16) ### Bug Fixes * Ensure transition-duration is used in Tailwind utils ([#12167](#12167)) ([fc842ee](fc842ee)) * **tokens:** Restore `--calcite-color-focus` ([#11960](#11960)) ([0432a20](0432a20)) ### Dependencies * The following workspace dependencies were updated * dependencies * @esri/calcite-design-tokens bumped from 3.2.0-next.14 to 3.2.0 * peerDependencies * @esri/calcite-design-tokens bumped from ^3.0.2-next.8 to ^3.2.0 </details> <details><summary>@esri/calcite-ui-icons: 4.3.0</summary> ## [4.3.0](https://github.com/Esri/calcite-design-system/compare/@esri/calcite-ui-icons@4.2.0...@esri/calcite-ui-icons@4.3.0) (2025-09-16) ### Features * Add arrow left 10 and arrow right 10 ([#12541](#12541)) ([dec51d6](dec51d6)) * Add catalog and magic wand ([#12596](#12596)) ([67daada](67daada)) * Add content side by side right ([#12350](#12350)) ([95a1c0b](95a1c0b)) * Add dimensions centered ([#12483](#12483)) ([4c0876e](4c0876e)) * Add filled envelope icon ([#12654](#12654)) ([b2fb080](b2fb080)) * Add internal label across form components ([#12499](#12499)) ([6b38dd8](6b38dd8)) * Add js-api icons ([#12435](#12435)) ([ca8aad1](ca8aad1)) * Add layer 3d ([#12819](#12819)) ([fb5db21](fb5db21)) * Add location local ([#12406](#12406)) ([0310075](0310075)) * Add person magnifying glass ([#12509](#12509)) ([99ee95a](99ee95a)) * Add rtl of list icons ([#12685](#12685)) ([1c95c2b](1c95c2b)) * Add select row icon ([#12768](#12768)) ([7f3b7a7](7f3b7a7)) * Add shopping-cart-f, shopping cart plus, carousel frames ([#12758](#12758)) ([370aaf0](370aaf0)) * Add spike, browser, tapestry and transfer icons ([#12251](#12251)) ([ad01162](ad01162)) * Add subheading icons ([#12303](#12303)) ([d965e4f](d965e4f)) * Added camera sensor icons ([#12738](#12738)) ([0a70c9f](0a70c9f)) * Added navigation icons ([#12323](#12323)) ([9e2bb42](9e2bb42)) * Schema report, video, classification, and advance drawing tools icons ([#12679](#12679)) ([7be3f5c](7be3f5c)) ### Bug Fixes * Select row icon ([#12793](#12793)) ([5b3788d](5b3788d)) * Tapestry icons ([#12315](#12315)) ([7fbedfc](7fbedfc)) </details> <details><summary>@esri/eslint-plugin-calcite-components: 2.0.3</summary> ## [2.0.3](https://github.com/Esri/calcite-design-system/compare/@esri/eslint-plugin-calcite-components@2.0.2...@esri/eslint-plugin-calcite-components@2.0.3) (2025-09-16) </details> <details><summary>@esri/calcite-components: 3.3.0</summary> ## [3.3.0](https://github.com/Esri/calcite-design-system/compare/@esri/calcite-components@3.2.1...@esri/calcite-components@3.3.0) (2025-09-16) ### Features * **accordion-item:** Add content-start and content-end slots ([#12849](#12849)) ([67a9509](67a9509)) * **accordion-item:** Add headingLevel property ([#12240](#12240)) ([5f02b5c](5f02b5c)) * **accordion-item:** Add title to expand icon ([#12657](#12657)) ([e691a3a](e691a3a)) * **action:** Add type property ([#12624](#12624)) ([c9dd7d9](c9dd7d9)) * **action:** Make actions fill full width of parent ([#12047](#12047)) ([7b9dfd7](7b9dfd7)) * Add focus options support ([#12555](#12555)) ([58148cc](58148cc)) * Add internal label across form components ([#12499](#12499)) ([6b38dd8](6b38dd8)) * **autocomplete-item:** Add `calciteAutocompleteItemSelect` event ([#12655](#12655)) ([61dcbfa](61dcbfa)) * **block, block-section, block-group:** Add scale property ([#12382](#12382)) ([28b9da8](28b9da8)) * **block:** Add --calcite-block-content-space css token ([#12704](#12704)) ([7f1167a](7f1167a)) * **button:** Add css property for shadow ([#12603](#12603)) ([12bfdae](12bfdae)) * **carousel:** Add component tokens ([#12474](#12474)) ([385a83b](385a83b)) * **checkbox:** Enhance component's interactivity states ([#12207](#12207)) ([f00e45b](f00e45b)) * **color-picker:** Add component tokens ([#12862](#12862)) ([5dffbf3](5dffbf3)) * **color-picker:** Support hiding color-field ([#12484](#12484)) ([c4e42b6](c4e42b6)) * **combobox:** Add `--calcite-combobox-divider-color` ([#12223](#12223)) ([9d5b55d](9d5b55d)) * **combobox:** Provide context when filtering and there are no matching results ([#12525](#12525)) ([e1b32b9](e1b32b9)) * **combobox:** Single-persist mode ignores clearDisabled ([#12757](#12757)) ([ce36c6c](ce36c6c)) * **date-picker, input-date-picker:** Add `calendars` property to support one month view in range ([#12479](#12479)) ([f5357c6](f5357c6)) * **dialog, modal, popover, sheet:** Add `setReturnFocus` to `focusTrapOptions` ([#12513](#12513)) ([50a371a](50a371a)) * **dialog, panel, flow-item:** Add `icon` and `iconFlipRtl` properties ([#12176](#12176)) ([e03222c](e03222c)) * **dialog:** Add component tokens ([#12553](#12553)) ([0088f2e](0088f2e)) * Emit `expanded`/`collapsed` end-state events for expandable components ([#12580](#12580)) ([e0e686b](e0e686b)) * **input-date-picker:** Add component tokens ([#11734](#11734)) ([a3c152a](a3c152a)) * **input-number, input-text:** Add center alignment ([#12695](#12695)) ([6e0739b](6e0739b)) * **input-text:** Add component tokens ([#12242](#12242)) ([9edff0c](9edff0c)) * **input-time-picker:** Add component tokens ([#12874](#12874)) ([5134270](5134270)) * **input:** Add title to clear button ([#12807](#12807)) ([6b160c0](6b160c0)) * **label:** Add new layout "block" ([#12552](#12552)) ([66c4b7b](66c4b7b)) * **list, block-group, sort-handle:** Add sortDisabled property to prevent reordering ([#12615](#12615)) ([2a41b0f](2a41b0f)) * **list, block-group, sort-handle:** Add support for cloning dragged items ([#12628](#12628)) ([2f0246a](2f0246a)) * Make version console message easier to disable ([#12194](#12194)) ([b2f8ddf](b2f8ddf)) * **panel:** Add `collapseDirection` as public property ([#12813](#12813)) ([9675814](9675814)) * **popover:** Add token for specifying the max width ([#12516](#12516)) ([bb8dac9](bb8dac9)) * **radio-button:** Enhance component's interactivity states ([#12169](#12169)) ([5999bac](5999bac)) * **select:** Add component tokens ([#12812](#12812)) ([25de1ca](25de1ca)) * **split-button:** Add component tokens ([#12756](#12756)) ([82f107e](82f107e)) * **stepper-item:** Improve single selection icon color ([#12436](#12436)) ([c2c6037](c2c6037)) * **swatch, swatch-group:** Add new components ([#12584](#12584)) ([6d6d3d1](6d6d3d1)) * **swatch:** Use label for visual title ([#12841](#12841)) ([7dbbc91](7dbbc91)) * **table, table-row, table-header, table-cell:** Add component tokens ([#11770](#11770)) ([8a0168c](8a0168c)) * **time-picker:** Apply consistent styling for floating elements ([#12467](#12467)) ([c1d13ba](c1d13ba)) * **time-picker:** Apply rounded corners inside popover ([#12502](#12502)) ([3ad12dd](3ad12dd)) * **tokens:** Add missing line height tokens ([#12798](#12798)) ([3bf135d](3bf135d)) * **tooltip:** Add css custom property for setting max size ([#12865](#12865)) ([83911fc](83911fc)) ### Bug Fixes * **accordion-item:** Fix font size for headingLevel property ([#12269](#12269)) ([448880d](448880d)) * **action-menu:** Ensure children are ready before setting a11y attributes ([#12533](#12533)) ([1f83000](1f83000)) * **action:** Fix applied tokens when active ([#12686](#12686)) ([d58901e](d58901e)) * **autocomplete:** Announce result to screen readers using aria-live attribute ([#12443](#12443)) ([0988e98](0988e98)) * **block:** Allow customizing heading text color when expanded & deprecate tokens ([#12777](#12777)) ([98b4348](98b4348)) * **block:** Icon-end aligns with header container when collapsible is false ([#12784](#12784)) ([4565b90](4565b90)) * **block:** No longer renders an empty header ([#12801](#12801)) ([9904507](9904507)) * **card:** Ensure `setFocus` focuses card when it contains nested interactive children ([#12724](#12724)) ([2fbcd99](2fbcd99)) * **chip:** Adjust interactivity states enhancements ([#12329](#12329)) ([608c006](608c006)) * **color-picker:** Adjust component spacing ([#12767](#12767)) ([4325d8b](4325d8b)) * **color-picker:** Ensure channel values are rounded ([#12239](#12239)) ([ba4e470](ba4e470)) * **combobox:** Adjust padding for no-matches context ([#12781](#12781)) ([e309828](e309828)) * **date-picker:** Honor `minAsDate` & `maxAsDate` when set ([#12706](#12706)) ([de8afed](de8afed)) * **date-picker:** Improve color contrast for days ([#12705](#12705)) ([0930c30](0930c30)) * **dialog, flow-item, panel:** Fix `iconFlipRtl` not working in RTL contexts ([#12668](#12668)) ([b2c22c9](b2c22c9)) * **dialog:** Ensure beforeClose is called once and fix animation on dialog ([#12152](#12152)) ([0898b7c](0898b7c)) * **dialog:** Fix for corner radius token ([#12859](#12859)) ([ee05c4d](ee05c4d)) * **dialog:** Restrict resizing once minimum size has been reached ([#12175](#12175)) ([cd03d14](cd03d14)) * Emit `beforeOpen` and `beforeClose` immediately on toggle ([#11965](#11965)) ([5955929](5955929)) * Ensure initial transitions are applied consistently ([#12392](#12392)) ([a82aeb2](a82aeb2)) * Ensure transition-duration is used in Tailwind utils ([#12167](#12167)) ([fc842ee](fc842ee)) * **input-date-picker:** Announces the purpose of each input in the range mode ([#12238](#12238)) ([c64169e](c64169e)) * **input-date-picker:** No longer close when non-interactive areas are clicked in Safari ([#12139](#12139)) ([69016b1](69016b1)) * **input-date-picker:** Update start & end date correctly when `proximity-selection-disabled` is true ([#12681](#12681)) ([67336ab](67336ab)) * **input-number:** Add token to customize icon color ([#12414](#12414)) ([63c68b8](63c68b8)) * **input-time-picker:** Add label property ([#12276](#12276)) ([2e06dd1](2e06dd1)) * **input-time-picker:** Apply aria-label and aria-controls attributes correctly to support NVDA and JAWS ([#12312](#12312)) ([ffd0cd7](ffd0cd7)) * **input-time-zone:** Address code review comments ([#12293](#12293)) ([c86df52](c86df52)) * **input-time-zone:** Display 'city, country' when control closed and value set programatically ([#12252](#12252)) ([684062e](684062e)) * **input-time-zone:** Fix selected time zone label flicker and scroll delay for region mode ([#12384](#12384)) ([f0b67f4](f0b67f4)) * **input, input-number, input-text:** Ensure overlay does not obscure input icon ([#12716](#12716)) ([926826f](926826f)) * **input, input-number, input-text:** Stretch the height of slot container to match with component ([#12339](#12339)) ([3d24364](3d24364)) * **input:** Do not obscure picker button with type=datetime-local ([#12081](#12081)) ([db4bd12](db4bd12)) * **link:** Emit click event on enter key when the component doesn't have href defined ([#12191](#12191)) ([409915c](409915c)) * **list, block-group:** Emit calciteListOrderChange on destination when adding or moving from the menu ([#12799](#12799)) ([916f081](916f081)) * **list, block-group:** Fix canPull when cloning and "Add to" menu on block-group ([#12741](#12741)) ([78b15e2](78b15e2)) * **list, block-group:** Sort handle menu should respond to new lists or label changes ([#12848](#12848)) ([df453bb](df453bb)) * **list, block-group:** Update menu item labels and call `canPut` / `canPull` to filter items before opening a sort handle menu ([#12487](#12487)) ([9c9ff9c](9c9ff9c)) * **list, block-group:** Update sort handle move items before dropdown menu is opened ([#12722](#12722)) ([298a7f1](298a7f1)) * **list:** Added scrim for empty list ([#12595](#12595)) ([7a5cc96](7a5cc96)) * **list:** Fix visual artifacts when you initiate a drag operation with the drag handle menu open ([#12611](#12611)) ([b317e50](b317e50)) * **list:** Prevent drag flickering while sorting ([#12631](#12631)) ([accef27](accef27)) * Map `bs` locale to `sr-Latn-CS` ([#12566](#12566)) ([298a7ba](298a7ba)) * **pagination:** Prevent invalid start-item and set default to 1 ([#12557](#12557)) ([494e33f](494e33f)) * **pagination:** Restore original default value for totalItems ([#12569](#12569)) ([e65b461](e65b461)) * **panel:** Alert slot should not take up any height ([#12802](#12802)) ([c51b968](c51b968)) * **panel:** Prevent child panels from closing parent panels ([#12646](#12646)) ([15da3ce](15da3ce)) * **popover, tooltip:** Do not close when a click was initiated inside the component ([#12543](#12543)) ([a35e96a](a35e96a)) * **popover, tooltip:** Open when there is selected text on the page ([#12597](#12597)) ([4274d65](4274d65)) * **radio-button:** Fix navigation with disabled buttons ([#12514](#12514)) ([d1b1ccb](d1b1ccb)) * **segmented-control:** Avoid changing focus from programmatic item selection ([#12181](#12181)) ([e3be05e](e3be05e)) * **select:** Fix error thrown when component is removed before initialization ([#12630](#12630)) ([ec661db](ec661db)) * **shell-center-row:** Fix rendering tied to named-slot content ([#10451](#10451)) ([5b15a02](5b15a02)) * **shell-panel:** Allow content to extend the full height of the panel ([#12860](#12860)) ([52bed19](52bed19)) * **shell-panel:** Restore resized size after expanding ([#12691](#12691)) ([0779250](0779250)) * **slider:** Allow range handle dragging in either direction when both handles share the same position ([#12527](#12527)) ([d9c7bfa](d9c7bfa)) * **slider:** Remove fill color when dragged handle is released and no longer has focus ([#12511](#12511)) ([5db048f](5db048f)) * **stepper-item:** Remove margin when slotted content is empty ([#12298](#12298)) ([6b1d099](6b1d099)) * **stepper:** Disallow navigation to disabled items ([#12217](#12217)) ([cbe160f](cbe160f)) * **swatch:** Ensure corner radius css property is correctly applied ([#12855](#12855)) ([50405aa](50405aa)) * **title:** Apply alignment on slotted content ([#12451](#12451)) ([93b470a](93b470a)) * **tokens:** Restore `--calcite-color-focus` ([#11960](#11960)) ([0432a20](0432a20)) ### Deprecations * **combobox:** Remove `--calcite-combobox-item-border-color` ([9d5b55d](9d5b55d)) * **label:** Deprecate `"default"` layout value. ([66c4b7b](66c4b7b)) ### Dependencies * The following workspace dependencies were updated * dependencies * @esri/calcite-ui-icons bumped from 4.3.0-next.23 to 4.3.0 * devDependencies * @esri/calcite-design-tokens bumped from 3.2.0-next.14 to 3.2.0 * @esri/calcite-tailwind-preset bumped from 1.0.1-next.18 to 1.0.1 * @esri/eslint-plugin-calcite-components bumped from 2.0.3-next.5 to 2.0.3 </details> <details><summary>@esri/calcite-components-react: 3.3.0</summary> ## [3.3.0](https://github.com/Esri/calcite-design-system/compare/@esri/calcite-components-react@3.2.1...@esri/calcite-components-react@3.3.0) (2025-09-16) ### Dependencies * The following workspace dependencies were updated * dependencies * @esri/calcite-components bumped from 3.3.0-next.111 to 3.3.0 </details> --- This PR was generated with [Release Please](https://github.com/googleapis/release-please). See [documentation](https://github.com/googleapis/release-please#release-please). --------- Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> Co-authored-by: Ben Elan <no-reply@benelan.dev>

🤖 I have created a release *beep* *boop* --- <details><summary>@esri/calcite-design-tokens: 3.2.0</summary> [3.2.0](https://github.com/Esri/calcite-design-system/compare/@esri/calcite-design-tokens@3.1.0...@esri/calcite-design-tokens@3.2.0) (2025-09-16) * **tokens:** Add foreground-highlight and update referenced core tokens ([#12266](#12266)) ([cf44406](cf44406)) * **tokens:** Add missing line height tokens ([#12798](#12798)) ([3bf135d](3bf135d)) * Remove breakpoint tokens from semantic output ([#12397](#12397)) ([0f22083](0f22083)) * **tokens:** Restore `--calcite-color-focus` ([#11960](#11960)) ([0432a20](0432a20)) * **tokens:** Update `--calcite-font-line-height-relative` to resolve as a valid value ([#12828](#12828)) ([458f99d](458f99d)) </details> <details><summary>@esri/calcite-tailwind-preset: 1.0.1</summary> [1.0.1](https://github.com/Esri/calcite-design-system/compare/@esri/calcite-tailwind-preset@1.0.0...@esri/calcite-tailwind-preset@1.0.1) (2025-09-16) * Ensure transition-duration is used in Tailwind utils ([#12167](#12167)) ([fc842ee](fc842ee)) * **tokens:** Restore `--calcite-color-focus` ([#11960](#11960)) ([0432a20](0432a20)) * The following workspace dependencies were updated * dependencies * @esri/calcite-design-tokens bumped from 3.2.0-next.14 to 3.2.0 * peerDependencies * @esri/calcite-design-tokens bumped from ^3.0.2-next.8 to ^3.2.0 </details> <details><summary>@esri/calcite-ui-icons: 4.3.0</summary> [4.3.0](https://github.com/Esri/calcite-design-system/compare/@esri/calcite-ui-icons@4.2.0...@esri/calcite-ui-icons@4.3.0) (2025-09-16) * Add arrow left 10 and arrow right 10 ([#12541](#12541)) ([dec51d6](dec51d6)) * Add catalog and magic wand ([#12596](#12596)) ([67daada](67daada)) * Add content side by side right ([#12350](#12350)) ([95a1c0b](95a1c0b)) * Add dimensions centered ([#12483](#12483)) ([4c0876e](4c0876e)) * Add filled envelope icon ([#12654](#12654)) ([b2fb080](b2fb080)) * Add internal label across form components ([#12499](#12499)) ([6b38dd8](6b38dd8)) * Add js-api icons ([#12435](#12435)) ([ca8aad1](ca8aad1)) * Add layer 3d ([#12819](#12819)) ([fb5db21](fb5db21)) * Add location local ([#12406](#12406)) ([0310075](0310075)) * Add person magnifying glass ([#12509](#12509)) ([99ee95a](99ee95a)) * Add rtl of list icons ([#12685](#12685)) ([1c95c2b](1c95c2b)) * Add select row icon ([#12768](#12768)) ([7f3b7a7](7f3b7a7)) * Add shopping-cart-f, shopping cart plus, carousel frames ([#12758](#12758)) ([370aaf0](370aaf0)) * Add spike, browser, tapestry and transfer icons ([#12251](#12251)) ([ad01162](ad01162)) * Add subheading icons ([#12303](#12303)) ([d965e4f](d965e4f)) * Added camera sensor icons ([#12738](#12738)) ([0a70c9f](0a70c9f)) * Added navigation icons ([#12323](#12323)) ([9e2bb42](9e2bb42)) * Schema report, video, classification, and advance drawing tools icons ([#12679](#12679)) ([7be3f5c](7be3f5c)) * Select row icon ([#12793](#12793)) ([5b3788d](5b3788d)) * Tapestry icons ([#12315](#12315)) ([7fbedfc](7fbedfc)) </details> <details><summary>@esri/eslint-plugin-calcite-components: 2.0.3</summary> [2.0.3](https://github.com/Esri/calcite-design-system/compare/@esri/eslint-plugin-calcite-components@2.0.2...@esri/eslint-plugin-calcite-components@2.0.3) (2025-09-16) </details> <details><summary>@esri/calcite-components: 3.3.0</summary> [3.3.0](https://github.com/Esri/calcite-design-system/compare/@esri/calcite-components@3.2.1...@esri/calcite-components@3.3.0) (2025-09-16) * **accordion-item:** Add content-start and content-end slots ([#12849](#12849)) ([67a9509](67a9509)) * **accordion-item:** Add headingLevel property ([#12240](#12240)) ([5f02b5c](5f02b5c)) * **accordion-item:** Add title to expand icon ([#12657](#12657)) ([e691a3a](e691a3a)) * **action:** Add type property ([#12624](#12624)) ([c9dd7d9](c9dd7d9)) * **action:** Make actions fill full width of parent ([#12047](#12047)) ([7b9dfd7](7b9dfd7)) * Add focus options support ([#12555](#12555)) ([58148cc](58148cc)) * Add internal label across form components ([#12499](#12499)) ([6b38dd8](6b38dd8)) * **autocomplete-item:** Add `calciteAutocompleteItemSelect` event ([#12655](#12655)) ([61dcbfa](61dcbfa)) * **block, block-section, block-group:** Add scale property ([#12382](#12382)) ([28b9da8](28b9da8)) * **block:** Add --calcite-block-content-space css token ([#12704](#12704)) ([7f1167a](7f1167a)) * **button:** Add css property for shadow ([#12603](#12603)) ([12bfdae](12bfdae)) * **carousel:** Add component tokens ([#12474](#12474)) ([385a83b](385a83b)) * **checkbox:** Enhance component's interactivity states ([#12207](#12207)) ([f00e45b](f00e45b)) * **color-picker:** Add component tokens ([#12862](#12862)) ([5dffbf3](5dffbf3)) * **color-picker:** Support hiding color-field ([#12484](#12484)) ([c4e42b6](c4e42b6)) * **combobox:** Add `--calcite-combobox-divider-color` ([#12223](#12223)) ([9d5b55d](9d5b55d)) * **combobox:** Provide context when filtering and there are no matching results ([#12525](#12525)) ([e1b32b9](e1b32b9)) * **combobox:** Single-persist mode ignores clearDisabled ([#12757](#12757)) ([ce36c6c](ce36c6c)) * **date-picker, input-date-picker:** Add `calendars` property to support one month view in range ([#12479](#12479)) ([f5357c6](f5357c6)) * **dialog, modal, popover, sheet:** Add `setReturnFocus` to `focusTrapOptions` ([#12513](#12513)) ([50a371a](50a371a)) * **dialog, panel, flow-item:** Add `icon` and `iconFlipRtl` properties ([#12176](#12176)) ([e03222c](e03222c)) * **dialog:** Add component tokens ([#12553](#12553)) ([0088f2e](0088f2e)) * Emit `expanded`/`collapsed` end-state events for expandable components ([#12580](#12580)) ([e0e686b](e0e686b)) * **input-date-picker:** Add component tokens ([#11734](#11734)) ([a3c152a](a3c152a)) * **input-number, input-text:** Add center alignment ([#12695](#12695)) ([6e0739b](6e0739b)) * **input-text:** Add component tokens ([#12242](#12242)) ([9edff0c](9edff0c)) * **input-time-picker:** Add component tokens ([#12874](#12874)) ([5134270](5134270)) * **input:** Add title to clear button ([#12807](#12807)) ([6b160c0](6b160c0)) * **label:** Add new layout "block" ([#12552](#12552)) ([66c4b7b](66c4b7b)) * **list, block-group, sort-handle:** Add sortDisabled property to prevent reordering ([#12615](#12615)) ([2a41b0f](2a41b0f)) * **list, block-group, sort-handle:** Add support for cloning dragged items ([#12628](#12628)) ([2f0246a](2f0246a)) * Make version console message easier to disable ([#12194](#12194)) ([b2f8ddf](b2f8ddf)) * **panel:** Add `collapseDirection` as public property ([#12813](#12813)) ([9675814](9675814)) * **popover:** Add token for specifying the max width ([#12516](#12516)) ([bb8dac9](bb8dac9)) * **radio-button:** Enhance component's interactivity states ([#12169](#12169)) ([5999bac](5999bac)) * **select:** Add component tokens ([#12812](#12812)) ([25de1ca](25de1ca)) * **split-button:** Add component tokens ([#12756](#12756)) ([82f107e](82f107e)) * **stepper-item:** Improve single selection icon color ([#12436](#12436)) ([c2c6037](c2c6037)) * **swatch, swatch-group:** Add new components ([#12584](#12584)) ([6d6d3d1](6d6d3d1)) * **swatch:** Use label for visual title ([#12841](#12841)) ([7dbbc91](7dbbc91)) * **table, table-row, table-header, table-cell:** Add component tokens ([#11770](#11770)) ([8a0168c](8a0168c)) * **time-picker:** Apply consistent styling for floating elements ([#12467](#12467)) ([c1d13ba](c1d13ba)) * **time-picker:** Apply rounded corners inside popover ([#12502](#12502)) ([3ad12dd](3ad12dd)) * **tokens:** Add missing line height tokens ([#12798](#12798)) ([3bf135d](3bf135d)) * **tooltip:** Add css custom property for setting max size ([#12865](#12865)) ([83911fc](83911fc)) * **accordion-item:** Fix font size for headingLevel property ([#12269](#12269)) ([448880d](448880d)) * **action-menu:** Ensure children are ready before setting a11y attributes ([#12533](#12533)) ([1f83000](1f83000)) * **action:** Fix applied tokens when active ([#12686](#12686)) ([d58901e](d58901e)) * **autocomplete:** Announce result to screen readers using aria-live attribute ([#12443](#12443)) ([0988e98](0988e98)) * **block:** Allow customizing heading text color when expanded & deprecate tokens ([#12777](#12777)) ([98b4348](98b4348)) * **block:** Icon-end aligns with header container when collapsible is false ([#12784](#12784)) ([4565b90](4565b90)) * **block:** No longer renders an empty header ([#12801](#12801)) ([9904507](9904507)) * **card:** Ensure `setFocus` focuses card when it contains nested interactive children ([#12724](#12724)) ([2fbcd99](2fbcd99)) * **chip:** Adjust interactivity states enhancements ([#12329](#12329)) ([608c006](608c006)) * **color-picker:** Adjust component spacing ([#12767](#12767)) ([4325d8b](4325d8b)) * **color-picker:** Ensure channel values are rounded ([#12239](#12239)) ([ba4e470](ba4e470)) * **combobox:** Adjust padding for no-matches context ([#12781](#12781)) ([e309828](e309828)) * **date-picker:** Honor `minAsDate` & `maxAsDate` when set ([#12706](#12706)) ([de8afed](de8afed)) * **date-picker:** Improve color contrast for days ([#12705](#12705)) ([0930c30](0930c30)) * **dialog, flow-item, panel:** Fix `iconFlipRtl` not working in RTL contexts ([#12668](#12668)) ([b2c22c9](b2c22c9)) * **dialog:** Ensure beforeClose is called once and fix animation on dialog ([#12152](#12152)) ([0898b7c](0898b7c)) * **dialog:** Fix for corner radius token ([#12859](#12859)) ([ee05c4d](ee05c4d)) * **dialog:** Restrict resizing once minimum size has been reached ([#12175](#12175)) ([cd03d14](cd03d14)) * Emit `beforeOpen` and `beforeClose` immediately on toggle ([#11965](#11965)) ([5955929](5955929)) * Ensure initial transitions are applied consistently ([#12392](#12392)) ([a82aeb2](a82aeb2)) * Ensure transition-duration is used in Tailwind utils ([#12167](#12167)) ([fc842ee](fc842ee)) * **input-date-picker:** Announces the purpose of each input in the range mode ([#12238](#12238)) ([c64169e](c64169e)) * **input-date-picker:** No longer close when non-interactive areas are clicked in Safari ([#12139](#12139)) ([69016b1](69016b1)) * **input-date-picker:** Update start & end date correctly when `proximity-selection-disabled` is true ([#12681](#12681)) ([67336ab](67336ab)) * **input-number:** Add token to customize icon color ([#12414](#12414)) ([63c68b8](63c68b8)) * **input-time-picker:** Add label property ([#12276](#12276)) ([2e06dd1](2e06dd1)) * **input-time-picker:** Apply aria-label and aria-controls attributes correctly to support NVDA and JAWS ([#12312](#12312)) ([ffd0cd7](ffd0cd7)) * **input-time-zone:** Address code review comments ([#12293](#12293)) ([c86df52](c86df52)) * **input-time-zone:** Display 'city, country' when control closed and value set programatically ([#12252](#12252)) ([684062e](684062e)) * **input-time-zone:** Fix selected time zone label flicker and scroll delay for region mode ([#12384](#12384)) ([f0b67f4](f0b67f4)) * **input, input-number, input-text:** Ensure overlay does not obscure input icon ([#12716](#12716)) ([926826f](926826f)) * **input, input-number, input-text:** Stretch the height of slot container to match with component ([#12339](#12339)) ([3d24364](3d24364)) * **input:** Do not obscure picker button with type=datetime-local ([#12081](#12081)) ([db4bd12](db4bd12)) * **link:** Emit click event on enter key when the component doesn't have href defined ([#12191](#12191)) ([409915c](409915c)) * **list, block-group:** Emit calciteListOrderChange on destination when adding or moving from the menu ([#12799](#12799)) ([916f081](916f081)) * **list, block-group:** Fix canPull when cloning and "Add to" menu on block-group ([#12741](#12741)) ([78b15e2](78b15e2)) * **list, block-group:** Sort handle menu should respond to new lists or label changes ([#12848](#12848)) ([df453bb](df453bb)) * **list, block-group:** Update menu item labels and call `canPut` / `canPull` to filter items before opening a sort handle menu ([#12487](#12487)) ([9c9ff9c](9c9ff9c)) * **list, block-group:** Update sort handle move items before dropdown menu is opened ([#12722](#12722)) ([298a7f1](298a7f1)) * **list:** Added scrim for empty list ([#12595](#12595)) ([7a5cc96](7a5cc96)) * **list:** Fix visual artifacts when you initiate a drag operation with the drag handle menu open ([#12611](#12611)) ([b317e50](b317e50)) * **list:** Prevent drag flickering while sorting ([#12631](#12631)) ([accef27](accef27)) * Map `bs` locale to `sr-Latn-CS` ([#12566](#12566)) ([298a7ba](298a7ba)) * **pagination:** Prevent invalid start-item and set default to 1 ([#12557](#12557)) ([494e33f](494e33f)) * **pagination:** Restore original default value for totalItems ([#12569](#12569)) ([e65b461](e65b461)) * **panel:** Alert slot should not take up any height ([#12802](#12802)) ([c51b968](c51b968)) * **panel:** Prevent child panels from closing parent panels ([#12646](#12646)) ([15da3ce](15da3ce)) * **popover, tooltip:** Do not close when a click was initiated inside the component ([#12543](#12543)) ([a35e96a](a35e96a)) * **popover, tooltip:** Open when there is selected text on the page ([#12597](#12597)) ([4274d65](4274d65)) * **radio-button:** Fix navigation with disabled buttons ([#12514](#12514)) ([d1b1ccb](d1b1ccb)) * **segmented-control:** Avoid changing focus from programmatic item selection ([#12181](#12181)) ([e3be05e](e3be05e)) * **select:** Fix error thrown when component is removed before initialization ([#12630](#12630)) ([ec661db](ec661db)) * **shell-center-row:** Fix rendering tied to named-slot content ([#10451](#10451)) ([5b15a02](5b15a02)) * **shell-panel:** Allow content to extend the full height of the panel ([#12860](#12860)) ([52bed19](52bed19)) * **shell-panel:** Restore resized size after expanding ([#12691](#12691)) ([0779250](0779250)) * **slider:** Allow range handle dragging in either direction when both handles share the same position ([#12527](#12527)) ([d9c7bfa](d9c7bfa)) * **slider:** Remove fill color when dragged handle is released and no longer has focus ([#12511](#12511)) ([5db048f](5db048f)) * **stepper-item:** Remove margin when slotted content is empty ([#12298](#12298)) ([6b1d099](6b1d099)) * **stepper:** Disallow navigation to disabled items ([#12217](#12217)) ([cbe160f](cbe160f)) * **swatch:** Ensure corner radius css property is correctly applied ([#12855](#12855)) ([50405aa](50405aa)) * **title:** Apply alignment on slotted content ([#12451](#12451)) ([93b470a](93b470a)) * **tokens:** Restore `--calcite-color-focus` ([#11960](#11960)) ([0432a20](0432a20)) * **combobox:** Remove `--calcite-combobox-item-border-color` ([9d5b55d](9d5b55d)) * **label:** Deprecate `"default"` layout value. ([66c4b7b](66c4b7b)) * The following workspace dependencies were updated * dependencies * @esri/calcite-ui-icons bumped from 4.3.0-next.23 to 4.3.0 * devDependencies * @esri/calcite-design-tokens bumped from 3.2.0-next.14 to 3.2.0 * @esri/calcite-tailwind-preset bumped from 1.0.1-next.18 to 1.0.1 * @esri/eslint-plugin-calcite-components bumped from 2.0.3-next.5 to 2.0.3 </details> <details><summary>@esri/calcite-components-react: 3.3.0</summary> [3.3.0](https://github.com/Esri/calcite-design-system/compare/@esri/calcite-components-react@3.2.1...@esri/calcite-components-react@3.3.0) (2025-09-16) * The following workspace dependencies were updated * dependencies * @esri/calcite-components bumped from 3.3.0-next.111 to 3.3.0 </details> --- This PR was generated with [Release Please](https://github.com/googleapis/release-please). See [documentation](https://github.com/googleapis/release-please#release-please). --------- Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> Co-authored-by: Ben Elan <no-reply@benelan.dev>

feat(input-text): add component tokens

af6650c

github-actions Bot assigned anveshmekala May 28, 2025

github-actions Bot added the enhancement Issues tied to a new feature or request. label May 28, 2025

anveshmekala added 5 commits May 28, 2025 22:21

prettify jsdoc

a5929b1

add tests

a6d4dc3

Add stories & demo

8a24f32

fix test failures

741867e

cleanup

f4a7ffd

anveshmekala marked this pull request as ready for review May 30, 2025 20:13

anveshmekala added the pr ready for visual snapshots Adding this label will run visual snapshot testing. label May 30, 2025

fix storybook build

7ae8513

anveshmekala added pr ready for visual snapshots Adding this label will run visual snapshot testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. labels May 30, 2025

macandcheese reviewed Jun 2, 2025

View reviewed changes

Comment thread packages/calcite-components/src/components/input-text/input-text.scss Outdated

driskull reviewed Jun 2, 2025

View reviewed changes

github-actions Bot added the Stale Issues or pull requests that have not had recent activity. label Jun 13, 2025

anveshmekala removed the Stale Issues or pull requests that have not had recent activity. label Jun 13, 2025

This was referenced Jun 18, 2025

[Refactor] Component tokens naming conventions to singular, deprecates plural naming conventions #12356

Open

[Refactor] Remove deprecated plural-named component tokens #12365

Open

anveshmekala added 3 commits June 20, 2025 12:56

Merge branch 'dev' into anveshmekala/7180-input-text-tokens

8fc900a

rename action tokens & remove height token

d7301f5

rename size to width

7cd9fb9

anveshmekala added pr ready for visual snapshots Adding this label will run visual snapshot testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. labels Jun 20, 2025

anveshmekala requested review from driskull and macandcheese June 20, 2025 21:45

driskull approved these changes Jun 20, 2025

View reviewed changes

geospatialem reviewed Jun 21, 2025

View reviewed changes

doc changes

18aeba0

anveshmekala and others added 2 commits June 23, 2025 09:38

cleanup

812ec14

Merge branch 'dev' into anveshmekala/7180-input-text-tokens

4495b78

anveshmekala added pr ready for visual snapshots Adding this label will run visual snapshot testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. labels Jun 23, 2025

revert suffix & prefix token

74e92e9

anveshmekala added pr ready for visual snapshots Adding this label will run visual snapshot testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. labels Jun 23, 2025

rename width to size-x

9f25970

anveshmekala mentioned this pull request Jun 25, 2025

Use size naming convention with direction variant for width & height tokens. #12394

Open

10 tasks

anveshmekala added pr ready for visual snapshots Adding this label will run visual snapshot testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. labels Jun 25, 2025

anveshmekala requested a review from ashetland June 25, 2025 22:27

ashetland reviewed Jun 26, 2025

View reviewed changes

macandcheese approved these changes Jun 26, 2025

View reviewed changes

fix icon prop token

3b164e6

ashetland reviewed Jun 26, 2025

View reviewed changes

anveshmekala added pr ready for visual snapshots Adding this label will run visual snapshot testing. and removed pr ready for visual snapshots Adding this label will run visual snapshot testing. labels Jun 26, 2025

anveshmekala merged commit b156f4e into dev Jun 26, 2025
14 checks passed

anveshmekala deleted the anveshmekala/7180-input-text-tokens branch June 26, 2025 19:47

github-actions Bot added this to the 2025-07-29 - Jul Milestone milestone Jun 26, 2025

calcite-admin mentioned this pull request Sep 16, 2025

chore: release main #12887

Merged

benelan mentioned this pull request Sep 18, 2025

chore: release main (#12887) #12912

Merged

isaacbraun mentioned this pull request Sep 24, 2025

[calcite-input-text] fix typo in -placeholder-text-color token usage #12945

Open

6 tasks

Conversation

anveshmekala commented May 28, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Uh oh!

Uh oh!

driskull left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

anveshmekala Jun 2, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

github-actions Bot commented Jun 13, 2025

Uh oh!

driskull left a comment

Choose a reason for hiding this comment

Uh oh!

geospatialem left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

driskull commented Jun 25, 2025

Uh oh!

matgalla commented Jun 26, 2025

Uh oh!

Choose a reason for hiding this comment

Uh oh!

ashetland Jun 26, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

anveshmekala Jun 26, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

macandcheese left a comment

Choose a reason for hiding this comment

Uh oh!

anveshmekala commented Jun 26, 2025

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants

anveshmekala commented May 28, 2025 •

edited

Loading

anveshmekala Jun 2, 2025 •

edited

Loading

ashetland Jun 26, 2025 •

edited

Loading

anveshmekala Jun 26, 2025 •

edited

Loading