@ardium-ui/ui 5.0.0-alpha.66 → 5.0.0-alpha.67

package/lib/form-field-frame/form-field-frame.component.d.ts

@@ -24,6 +24,7 @@ export declare class ArdiumFormFieldFrameComponent extends _FocusableComponentBa
      * Whether to use the compact styling or not.
      */
     readonly compact: import("@angular/core").InputSignalWithTransform<boolean, BooleanLike>;
+    private readonly _enableTransitions;
     readonly ngClasses: import("@angular/core").Signal<string>;
     readonly prefixTemplateInput: import("@angular/core").InputSignal<Nullable<TemplateRef<any>>>;
     readonly suffixTemplateInput: import("@angular/core").InputSignal<Nullable<TemplateRef<any>>>;

package/lib/inputs/date-input/date-range-input.component.d.ts

@@ -10,6 +10,7 @@ export declare class ArdiumDateRangeInputComponent extends _AbstractDateInput<Da
     readonly isRangeSelector = true;
     protected readonly _DEFAULTS: ArdDateInputDefaults;
     constructor(defaults: ArdDateInputDefaults);
+    onGeneralClick(event: MouseEvent): void;
     readonly serializeFn: import("@angular/core").InputSignal<ArdDateInputSerializeFn<DateRange>>;
     writeValue(v: any): void;
     protected _isFullValue(value: DateRange | null): boolean;

package/lib/inputs/date-input/multipage-date-range-input.component.d.ts

@@ -20,6 +20,7 @@ export declare class ArdiumMultipageDateRangeInputComponent extends _AbstractDat
     readonly highlightedDate: import("@angular/core").WritableSignal<Date | null>;
     readonly numberOfCalendars: import("@angular/core").InputSignalWithTransform<number, NumberLike>;
     readonly calendarDataArray: import("@angular/core").Signal<CalendarDataItem[]>;
+    onGeneralClick(event: MouseEvent): void;
     onActivePageChange(newPage: {
         year: number;
         month: number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ardium-ui/ui",
-  "version": "5.0.0-alpha.66",
+  "version": "5.0.0-alpha.67",
   "peerDependencies": {
     "@angular/common": ">=18.0.0",
     "@angular/core": ">=18.0.0",

package/prebuilt-themes/default/core.css

@@ -40,8 +40,19 @@
   --ard-form-field-height-compact: 1.6875rem;
   --ard-form-field-font-size: 1rem;
   --ard-form-field-font-size-compact: 1rem;
-  --ard-form-field-padding: 0 0.375rem;
-  --ard-form-field-padding-compact: 0 0.375rem;
+  --ard-form-field-padding-top: 0;
+  --ard-form-field-padding-right: 0.375rem;
+  --ard-form-field-padding-bottom: 0;
+  --ard-form-field-padding-left: 0.375rem;
+  --ard-form-field-padding-top-compact: 0;
+  --ard-form-field-padding-right-compact: 0.375rem;
+  --ard-form-field-padding-bottom-compact: 0;
+  --ard-form-field-padding-left-compact: 0.375rem;
+  --ard-form-field-transitions-duration: 150ms;
+  --ard-form-field-hover-overlay-opacity: 3%;
+  --ard-form-field-focus-overlay-opacity: 6%;
+  --ard-form-field-disabled-opacity: 50%;
+  --ard-form-field-disabled-transparent-overlay-opacity: 4.5%;
   --ard-rounded-corner-radius: 0.375rem;
   --ard-grid-spacing-unit: 0.25rem;
   --ard-primary-50: 234, 235, 243;

package/prebuilt-themes/default/core.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/core.scss"],"names":[],"mappings":"AAEQ;AACA;AAER;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EAEA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;AAAA;EAEA;AAAA;EAEA;AAAA;EAGA;EAEA;EACA;;;AAGF;EACE","file":"core.css"}
+{"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/core.scss"],"names":[],"mappings":"AAEQ;AACA;AAER;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EAEA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;AAAA;EAEA;AAAA;EAEA;AAAA;EAGA;EAEA;EACA;;;AAGF;EACE","file":"core.css"}

package/prebuilt-themes/default/form-field-frame.css

@@ -7,13 +7,10 @@
   align-items: center;
   justify-content: stretch;
   position: relative;
-  font-size: 1rem;
-  line-height: 1.25em;
   font-family: var(--ard-font-family);
   border-radius: var(--ard-variant-border-radius);
   background: var(--ard-appearance-background);
   border: var(--ard-appearance-border);
-  transition: border-color 0.15s cubic-bezier(0.4, 0, 0.2, 1);
 }
 .ard-form-field-frame .ard-form-field-content-container {
   flex-grow: 1;
@@ -30,15 +27,13 @@
   align-items: center;
 }
 .ard-form-field-frame .ard-form-field-prefix-container {
-  padding-left: 0.375em;
+  padding-left: var(--ard-form-field-padding-left, 0.375rem);
 }
 .ard-form-field-frame .ard-form-field-suffix-container {
-  padding-right: 0.375em;
+  padding-right: var(--ard-form-field-padding-right, 0.375rem);
 }
 .ard-form-field-frame.ard-compact {
   min-height: var(--ard-form-field-height-compact);
-  font-size: 0.85rem;
-  line-height: 1;
 }
 .ard-form-field-frame.ard-appearance-outlined {
   --ard-appearance-background: var(--ard-bg);
@@ -81,21 +76,26 @@
 .ard-form-field-frame .ard-form-field-overlay {
   background: var(--ard-overlay);
   opacity: 0;
-  transition: opacity 0.15s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.15s cubic-bezier(0.4, 0, 0.2, 1);
 }
 .ard-form-field-frame:hover .ard-form-field-overlay {
-  opacity: 3%;
+  opacity: var(--ard-form-field-hover-overlay-opacity, 3%);
 }
 .ard-form-field-frame.ard-focused .ard-form-field-overlay {
-  opacity: 6%;
+  opacity: var(--ard-form-field-focus-overlay-opacity, 6%);
+}
+.ard-form-field-frame.ard-enable-transitions {
+  transition: border-color var(--ard-form-field-transitions-duration, 150ms) cubic-bezier(0.4, 0, 0.2, 1);
+}
+.ard-form-field-frame.ard-enable-transitions .ard-form-field-overlay {
+  transition: opacity var(--ard-form-field-transitions-duration, 150ms) cubic-bezier(0.4, 0, 0.2, 1), background-color var(--ard-form-field-transitions-duration, 150ms) cubic-bezier(0.4, 0, 0.2, 1);
 }
 
 .ard-disabled .ard-form-field-frame {
   pointer-events: none;
-  opacity: 50%;
+  opacity: var(--ard-form-field-disabled-opacity, 50%);
 }
 .ard-disabled .ard-form-field-frame.ard-appearance-transparent .ard-form-field-overlay {
-  opacity: 4.5%;
+  opacity: var(--ard-form-field-disabled-transparent-overlay-opacity, 4.5%);
 }
 
 .ard-readonly .ard-form-field-frame:hover .ard-form-field-overlay {

package/prebuilt-themes/default/form-field-frame.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/form-field-frame.scss","../../../../projects/ui/src/themes/_variables.scss","../../../../projects/ui/src/themes/default/_mixins.scss"],"names":[],"mappings":"AAGA;EACE;EACA,YCqCkB;EDpClB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EE8DA;EF5BA;EACA;EACA;;AAlCA;EACE;EACA;;AAEA;EACE;;AAGJ;AAAA;EAEE;EACA;EACA;EACA;;AAEF;EACE;;AAEF;EACE;;AAIF;EACE,YCGwB;EDFxB;EACA;;AEAF;EACE;EACA;EACA;;AAEA;EACE;;AAEF;EACE;;AAEF;EACE;EACA;;AAGJ;EACE;EACA;;AAEA;EACE;;AAEF;EACE;;AAGJ;EACE;EACA;;AAOF;EAEE;;AAEF;EACE;;AAEF;EACE;;AFlCF;EACE,YCnDM;EDoDN;EACA;;AAIA;EACE;;AAIF;EACE;;;AAIN;EACE;EACA;;AAGE;EACE;;;AAMF;EACE","file":"form-field-frame.css"}
+{"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/form-field-frame.scss","../../../../projects/ui/src/themes/_variables.scss","../../../../projects/ui/src/themes/default/_mixins.scss"],"names":[],"mappings":"AAGA;EACE;EACA,YCqCkB;EDpClB;EACA;EACA;EACA;EACA;EACA;EACA;EEgEA;EFhCA;EACA;;AA/BA;EACE;EACA;;AAEA;EACE;;AAGJ;AAAA;EAEE;EACA;EACA;EACA;;AAEF;EACE;;AAEF;EACE;;AAIF;EACE,YCKwB;;ACD1B;EACE;EACA;EACA;;AAEA;EACE;;AAEF;EACE;;AAEF;EACE;EACA;;AAGJ;EACE;EACA;;AAEA;EACE;;AAEF;EACE;;AAGJ;EACE;EACA;;AAOF;EAEE;;AAEF;EACE;;AAEF;EACE;;AFvCF;EACE,YC9CM;ED+CN;;AAIA;EACE;;AAIF;EACE;;AAGJ;EACE;;AAEA;EACE,YACE;;;AAKR;EACE;EACA;;AAGE;EACE;;;AAMF;EACE","file":"form-field-frame.css"}

package/prebuilt-themes/default/inputs/autocomplete-input.css

@@ -35,7 +35,10 @@
   font-size: var(--ard-autocomplete-input-font-size, var(--ard-form-field-font-size, 1rem));
   line-height: var(--ard-autocomplete-input-line-height, 1.25);
   font-weight: var(--ard-autocomplete-input-font-weight, 400);
-  padding: var(--ard-autocomplete-input-padding, var(--ard-form-field-padding, 0 0.375rem));
+  padding-left: var(--ard-autocomplete-input-padding-left, var(--ard-form-field-padding-left, 0.375rem));
+  padding-right: var(--ard-autocomplete-input-padding-right, var(--ard-form-field-padding-right, 0.375rem));
+  padding-top: var(--ard-autocomplete-input-padding-top, var(--ard-form-field-padding-top, 0));
+  padding-bottom: var(--ard-autocomplete-input-padding-bottom, var(--ard-form-field-padding-bottom, 0));
   color: var(--ard-autocomplete-input-color, var(--ard-text));
   min-width: var(--ard-autocomplete-input-min-width, 10rem);
   max-width: var(--ard-autocomplete-input-max-width, 100%);
@@ -45,6 +48,16 @@
   text-size-adjust: 100%;
   display: flex;
   align-items: center;
+  height: 100%;
+}
+.ard-autocomplete-input .ard-input-container > * {
+  position: absolute;
+  inset: 0;
+  padding-left: var(--ard-autocomplete-input-padding-left, var(--ard-form-field-padding-left, 0.375rem));
+  padding-right: var(--ard-autocomplete-input-padding-right, var(--ard-form-field-padding-right, 0.375rem));
+  padding-top: var(--ard-autocomplete-input-padding-top, var(--ard-form-field-padding-top, 0));
+  padding-bottom: var(--ard-autocomplete-input-padding-bottom, var(--ard-form-field-padding-bottom, 0));
+  max-width: 100%;
 }
 .ard-autocomplete-input .ard-input-container .ard-placeholder {
   font: inherit;
@@ -53,24 +66,26 @@
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-  max-width: 100%;
   pointer-events: none;
+  display: flex;
+  align-items: center;
 }
 .ard-autocomplete-input .ard-input-container input {
   border: none;
   background: transparent;
   outline: none;
   font: inherit;
-  padding: 0;
   color: inherit;
   display: block;
-  width: 100%;
 }
 .ard-autocomplete-input.ard-compact {
   height: var(--ard-autocomplete-input-height-compact, var(--ard-form-field-height-compact, 1.6875rem));
   font-size: var(--ard-autocomplete-input-font-size-compact, var(--ard-form-field-font-size-compact, 0.875rem));
   line-height: var(--ard-autocomplete-input-line-height-compact, 1);
-  padding: var(--ard-autocomplete-input-padding-compact, var(--ard-form-field-padding-compact, 0 0.375rem));
+  padding-left: var(--ard-autocomplete-input-padding-left-compact, var(--ard-form-field-padding-left-compact, 0.375rem));
+  padding-right: var(--ard-autocomplete-input-padding-right-compact, var(--ard-form-field-padding-right-compact, 0.375rem));
+  padding-top: var(--ard-autocomplete-input-padding-top-compact, var(--ard-form-field-padding-top-compact, 0));
+  padding-bottom: var(--ard-autocomplete-input-padding-bottom-compact, var(--ard-form-field-padding-bottom-compact, 0));
 }
 .ard-autocomplete-input ard-clear-button {
   height: var(--ard-clear-button-size);
@@ -137,6 +152,8 @@
   opacity: 15%;
 }
 .ard-autocomplete-input .ard-autocomplete {
+  display: flex;
+  align-items: center;
   opacity: var(--ard-autocomplete-input-autocomplete-opacity, 37.5%);
 }
 

package/prebuilt-themes/default/inputs/autocomplete-input.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../../../projects/ui/src/themes/default/inputs/_shared.scss","../../../../../projects/ui/src/themes/default/inputs/autocomplete-input.scss","../../../../../projects/ui/src/themes/default/_clear-button.scss","../../../../../projects/ui/src/themes/_variables.scss","../../../../../projects/ui/src/themes/default/_mixins.scss"],"names":[],"mappings":"AAEA;AAAA;AAAA;ACKA;EAGE;EAGA;EACA;EACA;EAKA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EAEA;EACA;;;AAGF;EDnBE,QCqBE;EDpBF;EACA;EACA;EACA;EACA;EACA,KCiBE;EDhBF;EACA;EACA,WCeE;EDdF,aCgBE;EDfF,aCiBE;EDhBF,SCiBE;EDhBF,OCkBE;EAIF;EACA;;ADrBA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA,SCUF;EDTE,OCQF;EDPE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE,QCvBA;EDwBA,WCrBA;EDsBA,aCpBA;EDqBA,SClBA;;AC9CF;EACE,QCmCgB;EDlChB,OCkCgB;EDjChB;;AAGF;EACE;EACA;EACA,OCGK;EDFL,OC0BgB;EDzBhB,QCyBgB;EDxBhB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EEvBF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EFgBI;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EE7CN;EACA;EACA,yBACE;EF4CI;;AAKF;EACE;;AAKF;EACE;;AAKF;EACE;;ADRN;EACE;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAIF;EACE;EACA","file":"autocomplete-input.css"}
+{"version":3,"sourceRoot":"","sources":["../../../../../projects/ui/src/themes/default/inputs/_shared.scss","../../../../../projects/ui/src/themes/default/inputs/autocomplete-input.scss","../../../../../projects/ui/src/themes/default/_clear-button.scss","../../../../../projects/ui/src/themes/_variables.scss","../../../../../projects/ui/src/themes/default/_mixins.scss"],"names":[],"mappings":"AAEA;AAAA;AAAA;ACKA;EAGE;EAGA;EACA;EACA;EAWA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EAEA;EACA;;;AAGF;EDnBE,QCqBE;EDpBF;EACA;EACA;EACA;EACA;EACA,KCiBE;EDhBF;EACA;EACA,WCeE;EDdF,aCgBE;EDfF,aCiBE;EDhBF,cCoBE;EDnBF,eCiBE;EDhBF,aCeE;EDdF,gBCgBE;EDfF,OCqBE;EAIF;EACA;;ADxBA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA,cCIF;EDHE,eCCF;EDAE,aCDF;EDEE;EACA;;AAEF;EACE;EACA,SCGF;EDFE,OCCF;EDAE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE,QCnCA;EDoCA,WCjCA;EDkCA,aChCA;EDiCA,cCxBA;EDyBA,eC3BA;ED4BA,aC7BA;ED8BA,gBC5BA;;ACzDF;EACE,QCmCgB;EDlChB,OCkCgB;EDjChB;;AAGF;EACE;EACA;EACA,OCGK;EDFL,OC0BgB;EDzBhB,QCyBgB;EDxBhB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EEvBF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EFgBI;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EE7CN;EACA;EACA,yBACE;EF4CI;;AAKF;EACE;;AAKF;EACE;;AAKF;EACE;;ADIN;EACE;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;AAIF;EACE;EACA","file":"autocomplete-input.css"}

package/prebuilt-themes/default/inputs/date-input.css

@@ -26,7 +26,10 @@ ard-multipage-date-range-input .ard-multipage-date-range-input {
   font-size: var(--ard-date-input-font-size, var(--ard-form-field-font-size, 1rem));
   line-height: var(--ard-date-input-line-height, 1.25);
   font-weight: var(--ard-date-input-font-weight, 400);
-  padding: var(--ard-date-input-padding, var(--ard-form-field-padding, 0 0.375rem));
+  padding-left: var(--ard-date-input-padding-left, var(--ard-form-field-padding-left, 0.375rem));
+  padding-right: var(--ard-date-input-padding-right, var(--ard-form-field-padding-right, 0.375rem));
+  padding-top: var(--ard-date-input-padding-top, var(--ard-form-field-padding-top, 0));
+  padding-bottom: var(--ard-date-input-padding-bottom, var(--ard-form-field-padding-bottom, 0));
   color: var(--ard-date-input-color, var(--ard-text));
   display: grid;
   grid-template-columns: 1fr max-content;
@@ -38,6 +41,18 @@ ard-multipage-date-range-input .ard-multipage-date-range-input .ard-input-contai
   text-size-adjust: 100%;
   display: flex;
   align-items: center;
+  height: 100%;
+}
+ard-date-input .ard-date-input .ard-input-container > *,
+ard-date-range-input .ard-date-range-input .ard-input-container > *,
+ard-multipage-date-range-input .ard-multipage-date-range-input .ard-input-container > * {
+  position: absolute;
+  inset: 0;
+  padding-left: var(--ard-date-input-padding-left, var(--ard-form-field-padding-left, 0.375rem));
+  padding-right: var(--ard-date-input-padding-right, var(--ard-form-field-padding-right, 0.375rem));
+  padding-top: var(--ard-date-input-padding-top, var(--ard-form-field-padding-top, 0));
+  padding-bottom: var(--ard-date-input-padding-bottom, var(--ard-form-field-padding-bottom, 0));
+  max-width: 100%;
 }
 ard-date-input .ard-date-input .ard-input-container .ard-placeholder,
 ard-date-range-input .ard-date-range-input .ard-input-container .ard-placeholder,
@@ -48,8 +63,9 @@ ard-multipage-date-range-input .ard-multipage-date-range-input .ard-input-contai
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-  max-width: 100%;
   pointer-events: none;
+  display: flex;
+  align-items: center;
 }
 ard-date-input .ard-date-input .ard-input-container input,
 ard-date-range-input .ard-date-range-input .ard-input-container input,
@@ -58,10 +74,8 @@ ard-multipage-date-range-input .ard-multipage-date-range-input .ard-input-contai
   background: transparent;
   outline: none;
   font: inherit;
-  padding: 0;
   color: inherit;
   display: block;
-  width: 100%;
 }
 ard-date-input .ard-date-input.ard-compact,
 ard-date-range-input .ard-date-range-input.ard-compact,
@@ -69,7 +83,10 @@ ard-multipage-date-range-input .ard-multipage-date-range-input.ard-compact {
   height: var(--ard-date-input-height-compact, var(--ard-form-field-height-compact, 1.6875rem));
   font-size: var(--ard-date-input-font-size-compact, var(--ard-form-field-font-size-compact, 0.875rem));
   line-height: var(--ard-date-input-line-height-compact, 1);
-  padding: var(--ard-date-input-padding-compact, var(--ard-form-field-padding-compact, 0 0.375rem));
+  padding-left: var(--ard-date-input-padding-left-compact, var(--ard-form-field-padding-left-compact, 0.375rem));
+  padding-right: var(--ard-date-input-padding-right-compact, var(--ard-form-field-padding-right-compact, 0.375rem));
+  padding-top: var(--ard-date-input-padding-top-compact, var(--ard-form-field-padding-top-compact, 0));
+  padding-bottom: var(--ard-date-input-padding-bottom-compact, var(--ard-form-field-padding-bottom-compact, 0));
 }
 ard-date-input .ard-date-input .ard-date-input__value-container,
 ard-date-range-input .ard-date-range-input .ard-date-input__value-container,

package/prebuilt-themes/default/inputs/date-input.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../../../projects/ui/src/themes/default/inputs/_shared.scss","../../../../../projects/ui/src/themes/default/inputs/date-input.scss"],"names":[],"mappings":"AAEA;AAAA;AAAA;ACGA;EAGE;EAGA;EACA;EACA;EAIA;EAGA;EACA;;;AAGF;AAAA;AAAA;EDJE,QCQE;EDPF;EACA;EACA;EACA;EACA;EACA,KCIE;EDHF;EACA;EACA,WCEE;EDDF,aCGE;EDFF,aCIE;EDHF,SCIE;EDHF,OCKE;EAIF;EACA;;ADRA;AAAA;AAAA;EACE;EACA;EACA;EACA;;AAEA;AAAA;AAAA;EACE;EACA,SCHF;EDIE,OCLF;EDME;EACA;EACA;EACA;EACA;;AAGF;AAAA;AAAA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;AAAA;AAAA;EACE,QCpCA;EDqCA,WClCA;EDmCA,aCjCA;EDkCA,SC/BA;;AAQF;AAAA;AAAA;EACE;;AAEF;AAAA;AAAA;EACE;;AAEF;AAAA;AAAA;EACE;EACA;;AAEA;AAAA;AAAA;EACE;EACA;EACA;;AAGF;AAAA;AAAA;EACE;EACA;EACA;EACA;;;AAMJ;EACE;EACA;;;AAGJ;EACE;EACA;EACA","file":"date-input.css"}
+{"version":3,"sourceRoot":"","sources":["../../../../../projects/ui/src/themes/default/inputs/_shared.scss","../../../../../projects/ui/src/themes/default/inputs/date-input.scss"],"names":[],"mappings":"AAEA;AAAA;AAAA;ACGA;EAGE;EAGA;EACA;EACA;EAWA;EAEA;EACA;;;AAGF;AAAA;AAAA;EDJE,QCQE;EDPF;EACA;EACA;EACA;EACA;EACA,KCIE;EDHF;EACA;EACA,WCEE;EDDF,aCGE;EDFF,aCIE;EDHF,cCOE;EDNF,eCIE;EDHF,aCEE;EDDF,gBCGE;EDFF,OCQE;EAIF;EACA;;ADXA;AAAA;AAAA;EACE;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;EACE;EACA;EACA,cCTF;EDUE,eCZF;EDaE,aCdF;EDeE,gBCbF;EDcE;;AAEF;AAAA;AAAA;EACE;EACA,SCVF;EDWE,OCZF;EDaE;EACA;EACA;EACA;EACA;EACA;;AAGF;AAAA;AAAA;EACE;EACA;EACA;EACA;EACA;EACA;;AAIJ;AAAA;AAAA;EACE,QChDA;EDiDA,WC9CA;ED+CA,aC7CA;ED8CA,cCrCA;EDsCA,eCxCA;EDyCA,aC1CA;ED2CA,gBCzCA;;AASF;AAAA;AAAA;EACE;;AAEF;AAAA;AAAA;EACE;;AAEF;AAAA;AAAA;EACE;EACA;;AAEA;AAAA;AAAA;EACE;EACA;EACA;;AAGF;AAAA;AAAA;EACE;EACA;EACA;EACA;;;AAMJ;EACE;EACA;;;AAGJ;EACE;EACA;EACA","file":"date-input.css"}

package/prebuilt-themes/default/inputs/file-input.css

@@ -46,7 +46,10 @@
   font-size: var(--ard-file-input-font-size, var(--ard-form-field-font-size, 1rem));
   line-height: var(--ard-file-input-line-height, 1.25);
   font-weight: var(--ard-file-input-font-weight, 400);
-  padding: var(--ard-file-input-padding, var(--ard-form-field-padding, 0 0.375rem));
+  padding-left: var(--ard-file-input-padding-left, var(--ard-form-field-padding-left, 0.375rem));
+  padding-right: var(--ard-file-input-padding-right, var(--ard-form-field-padding-right, 0.375rem));
+  padding-top: var(--ard-file-input-padding-top, var(--ard-form-field-padding-top, 0));
+  padding-bottom: var(--ard-file-input-padding-bottom, var(--ard-form-field-padding-bottom, 0));
   color: var(--ard-file-input-color, var(--ard-text));
   min-width: var(--ard-file-input-min-width, 10rem);
   max-width: var(--ard-file-input-max-width, 100%);
@@ -59,6 +62,16 @@
   text-size-adjust: 100%;
   display: flex;
   align-items: center;
+  height: 100%;
+}
+.ard-file-input .ard-input-container > * {
+  position: absolute;
+  inset: 0;
+  padding-left: var(--ard-file-input-padding-left, var(--ard-form-field-padding-left, 0.375rem));
+  padding-right: var(--ard-file-input-padding-right, var(--ard-form-field-padding-right, 0.375rem));
+  padding-top: var(--ard-file-input-padding-top, var(--ard-form-field-padding-top, 0));
+  padding-bottom: var(--ard-file-input-padding-bottom, var(--ard-form-field-padding-bottom, 0));
+  max-width: 100%;
 }
 .ard-file-input .ard-input-container .ard-placeholder {
   font: inherit;
@@ -67,24 +80,26 @@
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-  max-width: 100%;
   pointer-events: none;
+  display: flex;
+  align-items: center;
 }
 .ard-file-input .ard-input-container input {
   border: none;
   background: transparent;
   outline: none;
   font: inherit;
-  padding: 0;
   color: inherit;
   display: block;
-  width: 100%;
 }
 .ard-file-input.ard-compact {
   height: var(--ard-file-input-height-compact, var(--ard-form-field-height-compact, 1.6875rem));
   font-size: var(--ard-file-input-font-size-compact, var(--ard-form-field-font-size-compact, 0.875rem));
   line-height: var(--ard-file-input-line-height-compact, 1);
-  padding: var(--ard-file-input-padding-compact, var(--ard-form-field-padding-compact, 0 0.375rem));
+  padding-left: var(--ard-file-input-padding-left-compact, var(--ard-form-field-padding-left-compact, 0.375rem));
+  padding-right: var(--ard-file-input-padding-right-compact, var(--ard-form-field-padding-right-compact, 0.375rem));
+  padding-top: var(--ard-file-input-padding-top-compact, var(--ard-form-field-padding-top-compact, 0));
+  padding-bottom: var(--ard-file-input-padding-bottom-compact, var(--ard-form-field-padding-bottom-compact, 0));
 }
 .ard-file-input.ard-color-none {
   --ard-cmpcl--bg: var(--ard-bg);
@@ -239,7 +254,7 @@
   border: var(--ard-file-input-browse-button-border, none);
   border-radius: var(--ard-file-input-browse-button-border-radius, 9999px);
   background: var(--ard-file-input-browse-button-background, none);
-  padding: var(--ard-file-input-browse-butto-padding, 0);
+  padding: var(--ard-file-input-browse-button-padding, 0);
   color: var(--ard-file-input-browse-button-color, var(--ard-text));
   position: relative;
   display: flex;

package/prebuilt-themes/default/inputs/file-input.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../../../projects/ui/src/themes/default/inputs/_shared.scss","../../../../../projects/ui/src/themes/default/inputs/file-input.scss","../../../../../projects/ui/src/themes/default/_coloring.scss","../../../../../projects/ui/src/themes/default/_mixins.scss","../../../../../projects/ui/src/themes/default/_clear-button.scss","../../../../../projects/ui/src/themes/_variables.scss"],"names":[],"mappings":"AAEA;AAAA;AAAA;ACMA;EAGE;EAGA;EACA;EACA;EAKA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;EAEA;EACA;EACA;EACA;EACA;EACA;;;AAIA;EACE;;;AAGJ;EDjCE,QCmCE;EDlCF;EACA;EACA;EACA;EACA;EACA,KC+BE;ED9BF;EACA;EACA,WC6BE;ED5BF,aC8BE;ED7BF,aC+BE;ED9BF,SC+BE;ED9BF,OCgCE;EAKF;EACA;EACA;EACA;EACA;;ADvCA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA,SCwBF;EDvBE,OCsBF;EDrBE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE,QCTA;EDUA,WCPA;EDQA,aCNA;EDOA,SCJA;;AC7DF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AD1DF;EACE;EACA;;AAGF;EACE;;AAIF;EACE;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EE9FF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EFuFI;EACA;;AAGA;EACE;;AAIF;EACE;;AAIF;EACE;;AAIF;EACE;;AG7HN;EACE,QCmCgB;EDlChB,OCkCgB;EDjChB;;AAGF;EACE;EACA;EACA,OCGK;EDFL,OC0BgB;EDzBhB,QCyBgB;EDxBhB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EDvBF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;ECgBI;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;ED7CN;EACA;EACA,yBACE;EC4CI;;AAKF;EACE;;AAKF;EACE;;AAKF;EACE;;AHoEN;EACE;;AAEF;AAAA;AAAA;AAAA;AAAA;EAKE;EACA;EACA;;AAEF;EACE;EACA;;AAEA;EACE;;AAEF;EACE;;;AAIN;EACE;;;AAIE;AAAA;EAEE","file":"file-input.css"}
+{"version":3,"sourceRoot":"","sources":["../../../../../projects/ui/src/themes/default/inputs/_shared.scss","../../../../../projects/ui/src/themes/default/inputs/file-input.scss","../../../../../projects/ui/src/themes/default/_coloring.scss","../../../../../projects/ui/src/themes/default/_mixins.scss","../../../../../projects/ui/src/themes/default/_clear-button.scss","../../../../../projects/ui/src/themes/_variables.scss"],"names":[],"mappings":"AAEA;AAAA;AAAA;ACMA;EAGE;EAGA;EACA;EACA;EAWA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;EAEA;EACA;EACA;EACA;EACA;EACA;;;AAIA;EACE;;;AAGJ;EDjCE,QCmCE;EDlCF;EACA;EACA;EACA;EACA;EACA,KC+BE;ED9BF;EACA;EACA,WC6BE;ED5BF,aC8BE;ED7BF,aC+BE;ED9BF,cCkCE;EDjCF,eC+BE;ED9BF,aC6BE;ED5BF,gBC8BE;ED7BF,OCmCE;EAKF;EACA;EACA;EACA;EACA;;AD1CA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA,cCkBF;EDjBE,eCeF;EDdE,aCaF;EDZE,gBCcF;EDbE;;AAEF;EACE;EACA,SCiBF;EDhBE,OCeF;EDdE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE,QCrBA;EDsBA,WCnBA;EDoBA,aClBA;EDmBA,cCVA;EDWA,eCbA;EDcA,aCfA;EDgBA,gBCdA;;ACxEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AD9CF;EACE;EACA;;AAGF;EACE;;AAIF;EACE;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EE1GF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EFmGI;EACA;;AAGA;EACE;;AAIF;EACE;;AAIF;EACE;;AAIF;EACE;;AGzIN;EACE,QCmCgB;EDlChB,OCkCgB;EDjChB;;AAGF;EACE;EACA;EACA,OCGK;EDFL,OC0BgB;EDzBhB,QCyBgB;EDxBhB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EDvBF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;ECgBI;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;ED7CN;EACA;EACA,yBACE;EC4CI;;AAKF;EACE;;AAKF;EACE;;AAKF;EACE;;AHgFN;EACE;;AAEF;AAAA;AAAA;AAAA;AAAA;EAKE;EACA;EACA;;AAEF;EACE;EACA;;AAEA;EACE;;AAEF;EACE;;;AAIN;EACE;;;AAIE;AAAA;EAEE","file":"file-input.css"}

package/prebuilt-themes/default/inputs/hex-input.css

@@ -26,7 +26,10 @@
   font-size: var(--ard-hex-input-font-size, var(--ard-form-field-font-size, 1rem));
   line-height: var(--ard-hex-input-line-height, 1.25);
   font-weight: var(--ard-hex-input-font-weight, 400);
-  padding: var(--ard-hex-input-padding, var(--ard-form-field-padding, 0 0.375rem));
+  padding-left: var(--ard-hex-input-padding-left, var(--ard-form-field-padding-left, 0.375rem));
+  padding-right: var(--ard-hex-input-padding-right, var(--ard-form-field-padding-right, 0.375rem));
+  padding-top: var(--ard-hex-input-padding-top, var(--ard-form-field-padding-top, 0));
+  padding-bottom: var(--ard-hex-input-padding-bottom, var(--ard-form-field-padding-bottom, 0));
   color: var(--ard-hex-input-color, var(--ard-text));
   min-width: var(--ard-hex-input-min-width, 10rem);
   max-width: var(--ard-hex-input-max-width, 100%);
@@ -36,6 +39,16 @@
   text-size-adjust: 100%;
   display: flex;
   align-items: center;
+  height: 100%;
+}
+.ard-hex-input .ard-input-container > * {
+  position: absolute;
+  inset: 0;
+  padding-left: var(--ard-hex-input-padding-left, var(--ard-form-field-padding-left, 0.375rem));
+  padding-right: var(--ard-hex-input-padding-right, var(--ard-form-field-padding-right, 0.375rem));
+  padding-top: var(--ard-hex-input-padding-top, var(--ard-form-field-padding-top, 0));
+  padding-bottom: var(--ard-hex-input-padding-bottom, var(--ard-form-field-padding-bottom, 0));
+  max-width: 100%;
 }
 .ard-hex-input .ard-input-container .ard-placeholder {
   font: inherit;
@@ -44,24 +57,26 @@
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-  max-width: 100%;
   pointer-events: none;
+  display: flex;
+  align-items: center;
 }
 .ard-hex-input .ard-input-container input {
   border: none;
   background: transparent;
   outline: none;
   font: inherit;
-  padding: 0;
   color: inherit;
   display: block;
-  width: 100%;
 }
 .ard-hex-input.ard-compact {
   height: var(--ard-hex-input-height-compact, var(--ard-form-field-height-compact, 1.6875rem));
   font-size: var(--ard-hex-input-font-size-compact, var(--ard-form-field-font-size-compact, 0.875rem));
   line-height: var(--ard-hex-input-line-height-compact, 1);
-  padding: var(--ard-hex-input-padding-compact, var(--ard-form-field-padding-compact, 0 0.375rem));
+  padding-left: var(--ard-hex-input-padding-left-compact, var(--ard-form-field-padding-left-compact, 0.375rem));
+  padding-right: var(--ard-hex-input-padding-right-compact, var(--ard-form-field-padding-right-compact, 0.375rem));
+  padding-top: var(--ard-hex-input-padding-top-compact, var(--ard-form-field-padding-top-compact, 0));
+  padding-bottom: var(--ard-hex-input-padding-bottom-compact, var(--ard-form-field-padding-bottom-compact, 0));
 }
 .ard-hex-input ard-clear-button {
   height: var(--ard-clear-button-size);

package/prebuilt-themes/default/inputs/hex-input.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../../../projects/ui/src/themes/default/inputs/_shared.scss","../../../../../projects/ui/src/themes/default/inputs/hex-input.scss","../../../../../projects/ui/src/themes/default/_clear-button.scss","../../../../../projects/ui/src/themes/_variables.scss","../../../../../projects/ui/src/themes/default/_mixins.scss"],"names":[],"mappings":"AAEA;AAAA;AAAA;ACKA;EAGE;EAGA;EACA;EACA;EAKA;EAEA;EACA;EACA;EAEA;;;AAGF;EDTE,QCWE;EDVF;EACA;EACA;EACA;EACA;EACA,KCOE;EDNF;EACA;EACA,WCKE;EDJF,aCME;EDLF,aCOE;EDNF,SCOE;EDNF,OCQE;EAIF;EACA;;ADXA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA,OCFF;EDGE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE,QCjCA;EDkCA,WC/BA;EDgCA,aC9BA;ED+BA,SC5BA;;ACpCF;EACE,QCmCgB;EDlChB,OCkCgB;EDjChB;;AAGF;EACE;EACA;EACA,OCGK;EDFL,OC0BgB;EDzBhB,QCyBgB;EDxBhB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EEvBF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EFgBI;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EE7CN;EACA;EACA,yBACE;EF4CI;;AAKF;EACE;;AAKF;EACE;;AAKF;EACE;;ADjBJ;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA","file":"hex-input.css"}
+{"version":3,"sourceRoot":"","sources":["../../../../../projects/ui/src/themes/default/inputs/_shared.scss","../../../../../projects/ui/src/themes/default/inputs/hex-input.scss","../../../../../projects/ui/src/themes/default/_clear-button.scss","../../../../../projects/ui/src/themes/_variables.scss","../../../../../projects/ui/src/themes/default/_mixins.scss"],"names":[],"mappings":"AAEA;AAAA;AAAA;ACKA;EAGE;EAGA;EACA;EACA;EAWA;EAEA;EACA;EACA;EAEA;;;AAGF;EDTE,QCWE;EDVF;EACA;EACA;EACA;EACA;EACA,KCOE;EDNF;EACA;EACA,WCKE;EDJF,aCME;EDLF,aCOE;EDNF,cCUE;EDTF,eCOE;EDNF,aCKE;EDJF,gBCME;EDLF,OCWE;EAIF;EACA;;ADdA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA,cCNF;EDOE,eCTF;EDUE,aCXF;EDYE,gBCVF;EDWE;;AAEF;EACE;EACA,SCPF;EDQE,OCTF;EDUE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE,QC7CA;ED8CA,WC3CA;ED4CA,aC1CA;ED2CA,cClCA;EDmCA,eCrCA;EDsCA,aCvCA;EDwCA,gBCtCA;;AC/CF;EACE,QCmCgB;EDlChB,OCkCgB;EDjChB;;AAGF;EACE;EACA;EACA,OCGK;EDFL,OC0BgB;EDzBhB,QCyBgB;EDxBhB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EEvBF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EFgBI;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EE7CN;EACA;EACA,yBACE;EF4CI;;AAKF;EACE;;AAKF;EACE;;AAKF;EACE;;ADLJ;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA","file":"hex-input.css"}

package/prebuilt-themes/default/inputs/input.css

@@ -24,7 +24,10 @@
   font-size: var(--ard-input-font-size, var(--ard-form-field-font-size, 1rem));
   line-height: var(--ard-input-line-height, 1.25);
   font-weight: var(--ard-input-font-weight, 400);
-  padding: var(--ard-input-padding, var(--ard-form-field-padding, 0 0.375rem));
+  padding-left: var(--ard-input-padding-left, var(--ard-form-field-padding-left, 0.375rem));
+  padding-right: var(--ard-input-padding-right, var(--ard-form-field-padding-right, 0.375rem));
+  padding-top: var(--ard-input-padding-top, var(--ard-form-field-padding-top, 0));
+  padding-bottom: var(--ard-input-padding-bottom, var(--ard-form-field-padding-bottom, 0));
   color: var(--ard-input-color, var(--ard-text));
   min-width: var(--ard-input-min-width, 10rem);
   max-width: var(--ard-input-max-width, 100%);
@@ -34,6 +37,16 @@
   text-size-adjust: 100%;
   display: flex;
   align-items: center;
+  height: 100%;
+}
+.ard-input .ard-input-container > * {
+  position: absolute;
+  inset: 0;
+  padding-left: var(--ard-input-padding-left, var(--ard-form-field-padding-left, 0.375rem));
+  padding-right: var(--ard-input-padding-right, var(--ard-form-field-padding-right, 0.375rem));
+  padding-top: var(--ard-input-padding-top, var(--ard-form-field-padding-top, 0));
+  padding-bottom: var(--ard-input-padding-bottom, var(--ard-form-field-padding-bottom, 0));
+  max-width: 100%;
 }
 .ard-input .ard-input-container .ard-placeholder {
   font: inherit;
@@ -42,24 +55,26 @@
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-  max-width: 100%;
   pointer-events: none;
+  display: flex;
+  align-items: center;
 }
 .ard-input .ard-input-container input {
   border: none;
   background: transparent;
   outline: none;
   font: inherit;
-  padding: 0;
   color: inherit;
   display: block;
-  width: 100%;
 }
 .ard-input.ard-compact {
   height: var(--ard-input-height-compact, var(--ard-form-field-height-compact, 1.6875rem));
   font-size: var(--ard-input-font-size-compact, var(--ard-form-field-font-size-compact, 0.875rem));
   line-height: var(--ard-input-line-height-compact, 1);
-  padding: var(--ard-input-padding-compact, var(--ard-form-field-padding-compact, 0 0.375rem));
+  padding-left: var(--ard-input-padding-left-compact, var(--ard-form-field-padding-left-compact, 0.375rem));
+  padding-right: var(--ard-input-padding-right-compact, var(--ard-form-field-padding-right-compact, 0.375rem));
+  padding-top: var(--ard-input-padding-top-compact, var(--ard-form-field-padding-top-compact, 0));
+  padding-bottom: var(--ard-input-padding-bottom-compact, var(--ard-form-field-padding-bottom-compact, 0));
 }
 .ard-input ard-clear-button {
   height: var(--ard-clear-button-size);

package/prebuilt-themes/default/inputs/input.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../../../projects/ui/src/themes/default/inputs/_shared.scss","../../../../../projects/ui/src/themes/default/inputs/input.scss","../../../../../projects/ui/src/themes/default/_clear-button.scss","../../../../../projects/ui/src/themes/_variables.scss","../../../../../projects/ui/src/themes/default/_mixins.scss"],"names":[],"mappings":"AAEA;AAAA;AAAA;ACKA;EAGE;EAGA;EACA;EACA;EAKA;EAEA;EACA;;;AAGF;EDNE,QCQE;EDPF;EACA;EACA;EACA;EACA;EACA,KCIE;EDHF;EACA;EACA,WCEE;EDDF,aCGE;EDFF,aCIE;EDHF,SCIE;EDHF,OCKE;EAIF;EACA;;ADRA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA,SCHF;EDIE,OCLF;EDME;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE,QCpCA;EDqCA,WClCA;EDmCA,aCjCA;EDkCA,SC/BA;;ACjCF;EACE,QCmCgB;EDlChB,OCkCgB;EDjChB;;AAGF;EACE;EACA;EACA,OCGK;EDFL,OC0BgB;EDzBhB,QCyBgB;EDxBhB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EEvBF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EFgBI;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EE7CN;EACA;EACA,yBACE;EF4CI;;AAKF;EACE;;AAKF;EACE;;AAKF;EACE","file":"input.css"}
+{"version":3,"sourceRoot":"","sources":["../../../../../projects/ui/src/themes/default/inputs/_shared.scss","../../../../../projects/ui/src/themes/default/inputs/input.scss","../../../../../projects/ui/src/themes/default/_clear-button.scss","../../../../../projects/ui/src/themes/_variables.scss","../../../../../projects/ui/src/themes/default/_mixins.scss"],"names":[],"mappings":"AAEA;AAAA;AAAA;ACKA;EAGE;EAGA;EACA;EACA;EAWA;EAEA;EACA;;;AAGF;EDNE,QCQE;EDPF;EACA;EACA;EACA;EACA;EACA,KCIE;EDHF;EACA;EACA,WCEE;EDDF,aCGE;EDFF,aCIE;EDHF,cCOE;EDNF,eCIE;EDHF,aCEE;EDDF,gBCGE;EDFF,OCQE;EAIF;EACA;;ADXA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA,cCTF;EDUE,eCZF;EDaE,aCdF;EDeE,gBCbF;EDcE;;AAEF;EACE;EACA,SCVF;EDWE,OCZF;EDaE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE,QChDA;EDiDA,WC9CA;ED+CA,aC7CA;ED8CA,cCrCA;EDsCA,eCxCA;EDyCA,aC1CA;ED2CA,gBCzCA;;AC5CF;EACE,QCmCgB;EDlChB,OCkCgB;EDjChB;;AAGF;EACE;EACA;EACA,OCGK;EDFL,OC0BgB;EDzBhB,QCyBgB;EDxBhB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EEvBF;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EFgBI;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EE7CN;EACA;EACA,yBACE;EF4CI;;AAKF;EACE;;AAKF;EACE;;AAKF;EACE","file":"input.css"}

package/prebuilt-themes/default/inputs/number-input.css

@@ -27,7 +27,10 @@ ard-number-input {
   font-size: var(--ard-number-input-font-size, var(--ard-form-field-font-size, 1rem));
   line-height: var(--ard-number-input-line-height, 1.25);
   font-weight: var(--ard-number-input-font-weight, 400);
-  padding: var(--ard-number-input-padding, var(--ard-form-field-padding, 0 0.375rem));
+  padding-left: var(--ard-number-input-padding-left, var(--ard-form-field-padding-left, 0.375rem));
+  padding-right: var(--ard-number-input-padding-right, var(--ard-form-field-padding-right, 0.375rem));
+  padding-top: var(--ard-number-input-padding-top, var(--ard-form-field-padding-top, 0));
+  padding-bottom: var(--ard-number-input-padding-bottom, var(--ard-form-field-padding-bottom, 0));
   color: var(--ard-number-input-color, var(--ard-text));
   gap: 0;
   width: 100%;
@@ -37,6 +40,16 @@ ard-number-input {
   text-size-adjust: 100%;
   display: flex;
   align-items: center;
+  height: 100%;
+}
+.ard-number-input .ard-input-container > * {
+  position: absolute;
+  inset: 0;
+  padding-left: var(--ard-number-input-padding-left, var(--ard-form-field-padding-left, 0.375rem));
+  padding-right: var(--ard-number-input-padding-right, var(--ard-form-field-padding-right, 0.375rem));
+  padding-top: var(--ard-number-input-padding-top, var(--ard-form-field-padding-top, 0));
+  padding-bottom: var(--ard-number-input-padding-bottom, var(--ard-form-field-padding-bottom, 0));
+  max-width: 100%;
 }
 .ard-number-input .ard-input-container .ard-placeholder {
   font: inherit;
@@ -45,24 +58,26 @@ ard-number-input {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-  max-width: 100%;
   pointer-events: none;
+  display: flex;
+  align-items: center;
 }
 .ard-number-input .ard-input-container input {
   border: none;
   background: transparent;
   outline: none;
   font: inherit;
-  padding: 0;
   color: inherit;
   display: block;
-  width: 100%;
 }
 .ard-number-input.ard-compact {
   height: var(--ard-number-input-height-compact, var(--ard-form-field-height-compact, 1.6875rem));
   font-size: var(--ard-number-input-font-size-compact, var(--ard-form-field-font-size-compact, 0.875rem));
   line-height: var(--ard-number-input-line-height-compact, 1);
-  padding: var(--ard-number-input-padding-compact, var(--ard-form-field-padding-compact, 0 0.375rem));
+  padding-left: var(--ard-number-input-padding-left-compact, var(--ard-form-field-padding-left-compact, 0.375rem));
+  padding-right: var(--ard-number-input-padding-right-compact, var(--ard-form-field-padding-right-compact, 0.375rem));
+  padding-top: var(--ard-number-input-padding-top-compact, var(--ard-form-field-padding-top-compact, 0));
+  padding-bottom: var(--ard-number-input-padding-bottom-compact, var(--ard-form-field-padding-bottom-compact, 0));
 }
 .ard-number-input.ard-appearance-outlined {
   --ard-appearance-background: var(--ard-bg);

package/prebuilt-themes/default/inputs/number-input.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../../../projects/ui/src/themes/default/inputs/_shared.scss","../../../../../projects/ui/src/themes/default/inputs/number-input.scss","../../../../../projects/ui/src/themes/default/_mixins.scss","../../../../../projects/ui/src/themes/_variables.scss"],"names":[],"mappings":"AAEA;AAAA;AAAA;ACIA;EAGE;EAGA;EACA;EACA;EAKA;EAGA;;;AAGF;EACE;;;AAGF;EDTE,QCWE;EDVF;EACA;EACA;EACA;EACA;EACA,KCOE;EDNF;EACA;EACA,WCKE;EDJF,aCME;EDLF,aCOE;EDNF,SCOE;EDNF,OCQE;EAKF;EACA;;ADZA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA,OCFF;EDGE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE,QCjCA;EDkCA,WC/BA;EDgCA,aC9BA;ED+BA,SC5BA;;ACEF;EACE;EACA;EACA;;AAEA;EACE;;AAEF;EACE;;AAEF;EACE;EACA;;AAGJ;EACE;EACA;;AAEA;EACE;;AAEF;EACE;;AAGJ;EACE;EACA;;ADtBF;EACE;EACA;EACA;;AAEA;EACE;;AAGJ;EACE;;AAGF;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;;AAGF;EACE;;AAEA;EACE;EACA;;AAGJ;EACE;;AAEA;EACE;EACA;;AAMN;EACE;;AAGE;EACE;;AAIN;EACE;;AAEF;EACE;;AAEA;EACE;EACA;EACA;EACA;;AAIA;EACE;;AAQJ;EACE;EACA;EACA;;AAEF;EACE;EACA;;AAGJ;EACE;EACA;;AAKA;EACE;;AAEF;EACE;;AAEF;EACE;;;AAMJ;EACE;EACA;EAMA,YEnKG;;AF+JH;EACE","file":"number-input.css"}
+{"version":3,"sourceRoot":"","sources":["../../../../../projects/ui/src/themes/default/inputs/_shared.scss","../../../../../projects/ui/src/themes/default/inputs/number-input.scss","../../../../../projects/ui/src/themes/default/_mixins.scss","../../../../../projects/ui/src/themes/_variables.scss"],"names":[],"mappings":"AAEA;AAAA;AAAA;ACIA;EAGE;EAGA;EACA;EACA;EAWA;EAGA;;;AAGF;EACE;;;AAGF;EDTE,QCWE;EDVF;EACA;EACA;EACA;EACA;EACA,KCOE;EDNF;EACA;EACA,WCKE;EDJF,aCME;EDLF,aCOE;EDNF,cCUE;EDTF,eCOE;EDNF,aCKE;EDJF,gBCME;EDLF,OCWE;EAKF;EACA;;ADfA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA,cCNF;EDOE,eCTF;EDUE,aCXF;EDYE,gBCVF;EDWE;;AAEF;EACE;EACA,SCPF;EDQE,OCTF;EDUE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE,QC7CA;ED8CA,WC3CA;ED4CA,aC1CA;ED2CA,cClCA;EDmCA,eCrCA;EDsCA,aCvCA;EDwCA,gBCtCA;;ACTF;EACE;EACA;EACA;;AAEA;EACE;;AAEF;EACE;;AAEF;EACE;EACA;;AAGJ;EACE;EACA;;AAEA;EACE;;AAEF;EACE;;AAGJ;EACE;EACA;;ADVF;EACE;EACA;EACA;;AAEA;EACE;;AAGJ;EACE;;AAGF;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;;AAGF;EACE;;AAEA;EACE;EACA;;AAGJ;EACE;;AAEA;EACE;EACA;;AAMN;EACE;;AAGE;EACE;;AAIN;EACE;;AAEF;EACE;;AAEA;EACE;EACA;EACA;EACA;;AAIA;EACE;;AAQJ;EACE;EACA;EACA;;AAEF;EACE;EACA;;AAGJ;EACE;EACA;;AAKA;EACE;;AAEF;EACE;;AAEF;EACE;;;AAMJ;EACE;EACA;EAMA,YE/KG;;AF2KH;EACE","file":"number-input.css"}