@hashrytech/quick-components-kit 0.19.1 → 0.19.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md
CHANGED
|
@@ -102,15 +102,15 @@
|
|
|
102
102
|
* - "lg": h-[2.8rem] text-lg placeholder:text-lg
|
|
103
103
|
*/
|
|
104
104
|
let sizeStyle: Record<TextInputSize, string> = {
|
|
105
|
-
sm: "text-sm placeholder:text-sm",
|
|
106
|
-
md: "text-sm placeholder:text-sm",
|
|
107
|
-
lg: "text-base placeholder:text-base"
|
|
105
|
+
sm: "text-sm placeholder:text-sm px-2.5",
|
|
106
|
+
md: "text-sm placeholder:text-sm px-2.5",
|
|
107
|
+
lg: "text-base placeholder:text-base px-3"
|
|
108
108
|
};
|
|
109
109
|
|
|
110
110
|
let textBoxStyle: Record<TextInputSize, string> = {
|
|
111
|
-
sm: "h-[2.05rem]
|
|
112
|
-
md: "h-[2.375rem]
|
|
113
|
-
lg: "h-[2.8rem]
|
|
111
|
+
sm: "h-[2.05rem]",
|
|
112
|
+
md: "h-[2.375rem]",
|
|
113
|
+
lg: "h-[2.8rem]"
|
|
114
114
|
};
|
|
115
115
|
|
|
116
116
|
const directionClass = {
|
|
@@ -142,15 +142,15 @@
|
|
|
142
142
|
{#if !label && labelText}<label for={id} class={twMerge("text-sm font-medium text-primary-label-text ml-1", labelClass)}>{labelText}</label>{/if}
|
|
143
143
|
|
|
144
144
|
<!-- Text Box -->
|
|
145
|
-
<div class={twMerge("flex flex-row items-center rounded-primary border border-primary-input-border
|
|
145
|
+
<div class={twMerge("flex flex-row items-center rounded-primary border border-primary-input-border focus-within:ring focus-within:border-primary-focus focus-within:ring-primary-focus has-[input:disabled]:bg-neutral-300/30 has-[input:disabled]:border-neutral-300/30",
|
|
146
146
|
error ? "bg-red-50 border-red-300" : "", textBoxStyle[size], thirdDivClass)}>
|
|
147
147
|
|
|
148
|
-
{#if leftIcon}<div class="h-full flex flex-col items-center justify-center">{@render leftIcon()}</div>{/if}
|
|
148
|
+
{#if leftIcon}<div class="h-full flex flex-col items-center justify-center pl-2">{@render leftIcon()}</div>{/if}
|
|
149
149
|
|
|
150
150
|
<input {disabled} {required} {type} {id} name={name ? name: id} {placeholder} {onmouseup} bind:value {autocomplete} {inputmode} {min} {max} oninput={handleInput}
|
|
151
151
|
class={twMerge("border-0 focus:border-0 focus:ring-0 active:border-0 outline-none p-0 bg-transparent placeholder:text-neutral-600/50 h-full w-full", sizeStyle[size], restProps.class)} />
|
|
152
152
|
|
|
153
|
-
{#if rightIcon}<div class="h-full flex flex-col items-center justify-center">{@render rightIcon()}</div>{/if}
|
|
153
|
+
{#if rightIcon}<div class="h-full flex flex-col items-center justify-center pr-2">{@render rightIcon()}</div>{/if}
|
|
154
154
|
</div>
|
|
155
155
|
|
|
156
156
|
</div>
|