Pricing

Input changelog

  • 2026-10-23: Graphic and short-label examples in complex attachments reuse Frame single-line composition and Text truncation with full-text access. Documentation only; host, clearing and selection protocols remain unchanged.

v1.2.0 (2026-10-23)

  • Resolve internal single-line graphics/text spacing in both regular and embedded Field hosts. Explicit zero and scaling retain a 4 CSS px floor; date-segment and drawing internals keep their spacing.

  • Input provides the actual content state for SearchInput collapse. Clear-button availability still independently respects disabled, readonly and clearable.

  • 2026-10-05: Date-segment focus and selection backgrounds now use Brand 40%, matching global text and input selections while retaining existing foreground colors and interactions.

v1.1.5 (2026-09-27)

  • Readonly and disabled inputs no longer enter clear-button takeover state, preventing focus on a readonly input from hiding a custom trailing copy button.

  • 2026-09-21: Aligned the usage guide, source Prop table, and Site / AI reading entry. Documentation only; component behavior is unchanged.

  • Input-Docs.2026-09-10 Completed descriptions of all named props, events, and Snippets, clarified boundaries for native multiple values and removed file types, and synchronized realistic Site examples. Component behavior is unchanged.

  • Input-Motion.2026-06-18 Added default error-feedback shake. A standalone Input plays it automatically for invalid / aria-invalid; when embedded in Field, Field coordinates playback. Consumers need no manual class or state.

  • Input-Docs.2026-05-25 Archived the historical changelog from the source header. New changes belong in this document's changelog; the source header retains only its role, current key architecture, and documentation path.

v1.1.4 (2026-09-12)

  • Fixed an Input with attachments being vertically high within a fixed height: the single-row Grid uses align-content: center, inherited by SearchInput. Default auto height is unchanged.

v1.1.3 (2026-08-12)

  • Corrected the documented standard standalone Input padding to the actual source value, 12px / 16px; component behavior did not change.

v1.1.2 (2026-08-10)

  • Exposed the Frame-inherited bind:element root host reference so specialized hosts such as SearchInput can reuse root sizing without a wrapper or private DOM query.

  • The stable width rule for a normal Input's clear + leading layout now withdraws when SearchInput has an empty icon state, avoiding the old hidden-clear gap to the Icon's right. Focus or a value restores the previous layout.

v1.1.1 (2026-07-05)

Fixes

  • Fixed a valued Input changing width in a shrink-to-fit host when focus reveals the clear X.

  • The built-in clear X shares a grid column with the control, so showing it adds no track. Existing text fade and clear-button overlay remain.

v1.1.0 (2026-07-05)

New features

  • Added an error built-in mode, off by default. Only when invalid does it show <Text as="error"> with red 12px/16px styling and an 8px gap.

  • Added parts.Text; explicit <Text as="error"> mode is unchanged.

v1.0.44 (2026-05-09)

  • Font size and line height on the inner control now inherit settings from outer .snowui-input. An outer utility such as class="text-18" scales placeholder and input text together. --snowui-input-font-size-override and --snowui-input-line-height-override remain consumed by the outer element.

  • v1.0.36: Default type="color" display now matches Figma's color dot + # + HEX layer; the color value updates with the native color picker.

  • v1.0.35: readonly now consistently uses a non-editable appearance. Standalone and Field container modes both use a Background/2 background and no border.

Relationships

  • Parent component: Frame.svelte

  • Shared logic: ../logic/frame-field-control.ts

  • Prop distribution: ../logic/frame-prop-filter.ts

  • Field context: ../context.ts

  • Related specification: ../../../specs/maintainers/HTMLSpec.md

v1.0.43 (2026-05-09)

Changes

  • INP-Overlay.1 Extended search-input styles in Listbox / QuickAction into shared overlay-search rules covering SearchInput inside SearchPopup, and consistently removed the outward focus ring.

v1.0.42 (2026-04-25)

Fixes

  • INP-Fix.8 Fixed an extra 8px of space at the right of a valued standalone Input when not hovered. With only the built-in clear button, the hidden state no longer reserves a grid gap; the button-column gap returns when hover reveals X.

v1.0.40 (2026-04-02)

Changes

  • INP-Doc.1 Documented the host rule when Input is inside Field: outer Field controls padding, border, background, radius, and label spacing; Input becomes the input host.

  • INP-Doc.2 Updated recommended leading / trailing composition: simple accessory layouts use Field > leading + Input + trailing directly; this is not a segmented input with dividers.

v1.0.36 (2026-03-25)

Styles

  • INP-Style.5 Upgraded the default type="color" display to Figma's color dot + # + HEX structure. The dot and HEX text share Input's default 14 / 20 typography, 8 gap, and 12/16 padding.

Interactions

  • INP-Interaction.1 Retained a hidden native <input type="color"> as the real host for form ownership, focus, keyboard interaction, and bind:value; the visible layer handles appearance only.

v1.0.35 (2026-03-19)

Styles

  • INP-Style.4 Unified the readonly non-editable appearance: standalone and Field container modes both use a Background/2 background without the default border.

v1.0.34 (2026-03-19)

Fixes

  • INP-Fix.7 Strengthened the browser fallback for hiding native type="number" steppers with opacity: 0 and pointer-events: none, and explicitly set the host input appearance to textfield so native steppers do not reappear in Playground.

v1.0.33 (2026-03-19)

Refactoring

  • INP-Refactor.7 Aligned enableResponsive=true with the component guideline default and passed all three Frame capability switches explicitly, keeping code and standards checks consistent.

Styles

  • INP-Style.3 Consolidated stepper selectors under :global(:where()), removed forced specificity, added theme Token fallbacks, and moved component geometry styles into the --snowui-input-* namespace.

v1.0.31 (2026-03-16)

Refactoring

  • INP-Refactor.6 A historical custom visible editing layer aligned selection appearance for ordinary text, input text, and date segments. Currently only date retains custom year/month/day segment editing; text has returned to native <input>.

v1.0.30 (2026-03-16)

Changes

  • INP-Adjust.8 Corrected the Chrome date-segment highlight: removed ineffective ::-webkit-datetime-edit-*::selection and ordinary input ::selection approaches, and applied shared Black/4% + Black/100% + 8px highlight variables to focused year/month/day-field segments.

v1.0.29 (2026-03-16)

Changes

  • INP-Adjust.7 Unified field text selection: layout.css adds shared selection variables for the field-bordered utility with a Black/4% background, Black/100% text, and 8px radius. Input.svelte gives private date year/month/day pseudo-elements matching ::selection styles.

v1.0.28 (2026-03-16)

Fixes

  • INP-Fix.6 Added Black/20% text color to the normal input itself under :placeholder-shown, following the successful empty-date fix so placeholders do not appear as body text when the browser misses ::placeholder.

v1.0.27 (2026-03-16)

Fixes

  • IN-Date.8 Applied the successful placeholder fix to empty date input text itself, setting it to Black/20% rather than relying solely on internal browser field pseudo-elements.

v1.0.26 (2026-03-16)

Fixes

  • IN-Date.7 Empty type="date" now also renders internal browser date placeholder text in Black/20%, matching ordinary placeholders.

v1.0.25 (2026-03-16)

Fixes

  • IN-Date.6 Without a custom trailing button, type="date" restores native browser appearance and its default date icon. Only detection of Button as="trailing" switches to the custom hiding path.

v1.0.24 (2026-03-16)

Fixes

  • IN-Date.5 Restored the ::-webkit-calendar-picker-indicator hiding branch. Together with the host's right-side mask, it forms the date-icon fix; removing either branch makes the default icon reappear in some browsers.

v1.0.23 (2026-03-16)

Cleanup

  • IN-Date.5 rollback The previous release incorrectly judged ::-webkit-calendar-picker-indicator ineffective; regression testing showed it remained necessary, so v1.0.24 restored it.

v1.0.22 (2026-03-16)

Fixes

  • IN-Date.4 Date input hides the native calendar icon with two safeguards: first hide ::-webkit-calendar-picker-indicator, then cover the default icon area with a right-side host mask where a browser ignores that hiding rule.

v1.0.21 (2026-03-16)

Fixes

  • IN-Date.3 Input runtime now detects a direct trailing Button inside the same local container as the date trigger and writes data-has-date-trigger on itself, avoiding misses from a complex structural selector.

v1.0.20 (2026-03-16)

Changes

  • IN-Date.2 Removed the control="date-picker" dependency. A custom date trigger is again detected automatically as Button as="trailing" in the local container.

v1.0.19 (2026-03-15)

New features

  • IN-Date.1 Added a custom date-trigger bridge: when a Button within Field / row / local container is bound as the date-picker trigger, Input type="date" hides the native icon and delegates interaction to that external composed Button.

v1.0.18 (2026-03-15)

Refactoring

  • INP-Refactor.1 Returned default input borders to .snowui-field-bordered in layout.css: base Black/20%, focus Black/40% + Black/4% ring; only input-specific states such as invalid / disabled / readonly remain in the component.

  • INP-Fix.1 Split placeholder pseudo-element selectors into separate standard, WebKit, Mozilla, and MS rules to render Black/20% reliably.

  • INP-Refactor.2 Prioritized the component's role as a field host and recommended composition with Field.svelte; in a Field context, it renders only an unwrapped input host.

v1.0.17 (2026-03-14)

Refactoring

  • INP-Refactor.5 Restored default Input focus variables to the shared field-bordered utility: focus now uses a Black/40% inner border and Black/4% outer 4px ring.

v1.0.16 (2026-03-14)

Fixes

  • INP-Fix.5 Finalized placeholder repair by splitting standard and browser-private pseudo-element selectors and setting color / -webkit-text-fill-color / opacity separately to consistently render Black/20%.

v1.0.9 (2026-03-14)

Cleanup

  • INP-Cleanup.1 Removed the placeholder overlay, focus visibility state, and special cursor fallback added for a pointer issue; returned to minimal native <input> plus the field-bordered utility.

v1.0.3 (2026-03-14)

Refactoring

  • INP-Refactor.2 Extracted field-host bridging into ../logic/frame-field-control.ts to handle value/defaultValue, invalid/aria-invalid, and the value synchronization exemption for input[type="file"] consistently.

  • INP-Refactor.3 Removed duplicate default hover/focus rules from the component and used shared .snowui-field-bordered behavior directly; removed the redundant data-disabled marker chain.

v1.0.4 (2026-03-14)

Refactoring

  • INP-Refactor.4 Default Input border, hover, focus, and text cursor now bridge through .snowui-field-bordered variables in layout.css, aligning baseline interaction across input components.

v1.0.2 (2026-03-14)

Refactoring

  • INP-Refactor.1 Replaced the inline Frame prop allowlist with the shared prop distributor in ../logic/frame-prop-filter.ts, avoiding duplicated maintenance of Frame's DOM filtering.

v1.0.1 (2026-03-14)

Styles

  • INP-Style.1 Updated Input defaults from Figma: 14 font size, 12/16 padding, 8 gap, 16 radius, a 0.5px Black/20% inner border, and Background/3 background.

  • INP-Style.2 Set the default minimum height to a derived 44px and synchronized Skeleton height and focus appearance.

v1.0.0 (2026-03-13)

New features

  • INP-Feat.1 Added a Frame-based single-line input with passthrough native <input> attributes, bind:value, Skeleton, and responsive behavior.

  • INP-Feat.2 Added baseline style paths for invalid / readonly / file / datalist and restricted Input to the atomic input control itself.