archive-gh-me/nextui
1
0
Fork 0
mirror of https://github.com/nextui-org/nextui.git synced 2025-12-08 19:26:11 +00:00
Code Issues Projects Releases Wiki Activity

fix(components): improve RTL support for input component (#2038)

Browse Source 
* fix(components): improve RTL support for select component

* fix(theme): revise RTL styles

* chore(changeset): remove input package from changeset

---------

Co-authored-by: amirhhashemi <87268103+amirhhashemi@users.noreply.github>
Co-authored-by: WK Wong <wingkwong.code@gmail.com>
This commit is contained in:
Amir Hossein Hashemi 2024-09-08 15:54:24 +03:30 committed by GitHub
parent f4d16e1e8f
commit deb15078cc
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 14 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
.changeset/giant-sheep-attend.md Normal file
View File

@ -0,0 +1,5 @@
---
"@nextui-org/theme": patch
---
Improved RTL support for the input component

21
packages/core/theme/src/components/input.ts
View File

@ -52,9 +52,8 @@ const input = tv({
"z-10",
"hidden",
"absolute",
"right-3",
"rtl:right-auto",
"rtl:left-3",
"end-3",
"start-auto",
"appearance-none",
"outline-none",
"select-none",
@ -174,7 +173,7 @@ const input = tv({
base: "flex-row items-center flex-nowrap data-[has-helper=true]:items-start",
inputWrapper: "flex-1",
mainWrapper: "flex flex-col",
label: "relative text-foreground pr-2 rtl:pr-0 rtl:pl-2 pointer-events-auto",
label: "relative text-foreground pe-2 ps-2 pointer-events-auto",
},
inside: {
label: "text-tiny cursor-text",
@ -607,7 +606,7 @@ const input = tv({
"z-20",
"top-1/2",
"-translate-y-1/2",
"group-data-[filled-within=true]:left-0",
"group-data-[filled-within=true]:start-0",
],
},
},
@ -757,7 +756,7 @@ const input = tv({
isMultiline: false,
class: {
label: [
"left-2",
"start-2",
"text-tiny",
"group-data-[filled-within=true]:-translate-y-[calc(100%_+_theme(fontSize.tiny)/2_+_16px)]",
],
@ -770,9 +769,8 @@ const input = tv({
isMultiline: false,
class: {
label: [
"left-3",
"rtl:left-auto",
"rtl:right-3",
"start-3",
"end-auto",
"text-small",
"group-data-[filled-within=true]:-translate-y-[calc(100%_+_theme(fontSize.small)/2_+_20px)]",
],
@ -785,9 +783,8 @@ const input = tv({
isMultiline: false,
class: {
label: [
"left-3",
"rtl:left-auto",
"rtl:right-3",
"start-3",
"end-auto",
"text-medium",
"group-data-[filled-within=true]:-translate-y-[calc(100%_+_theme(fontSize.small)/2_+_24px)]",
],