@seamly/web-ui 25.2.1 → 25.3.0-beta.1
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/build/dist/lib/index.debug.js +544 -281
- package/build/dist/lib/index.debug.js.map +1 -1
- package/build/dist/lib/index.debug.min.js +1 -1
- package/build/dist/lib/index.debug.min.js.LICENSE.txt +6 -0
- package/build/dist/lib/index.debug.min.js.map +1 -1
- package/build/dist/lib/index.js +497 -255
- package/build/dist/lib/index.js.map +1 -1
- package/build/dist/lib/index.min.js +1 -1
- package/build/dist/lib/index.min.js.map +1 -1
- package/build/dist/lib/style-guide.js +101 -1254
- package/build/dist/lib/style-guide.js.map +1 -1
- package/build/dist/lib/style-guide.min.js +1 -1
- package/build/dist/lib/style-guide.min.js.map +1 -1
- package/build/dist/lib/styles.css +1 -1
- package/package.json +13 -13
- package/src/javascripts/core/config.types.ts +1 -0
- package/src/javascripts/core/domains/config/slice.ts +2 -0
- package/src/javascripts/core/ui/components/entry/text-entry/text-entry-form.tsx +32 -15
- package/src/javascripts/core/ui/components/form-controls/textarea.tsx +81 -0
- package/src/javascripts/style-guide/states.ts +74 -3
- package/src/stylesheets/3-chat/_chat.scss +13 -1
- package/src/stylesheets/5-components/_character-limit.scss +1 -1
- package/src/stylesheets/5-components/_input.scss +41 -14
|
@@ -1,24 +1,31 @@
|
|
|
1
1
|
.#{$n}-input {
|
|
2
2
|
display: flex;
|
|
3
|
-
flex: 1 1 100%;
|
|
4
|
-
width: 100%;
|
|
5
|
-
height: 100%;
|
|
6
3
|
}
|
|
7
4
|
|
|
8
5
|
.#{$n}-entry-form {
|
|
9
6
|
display: flex;
|
|
7
|
+
flex: 0 1 100%;
|
|
10
8
|
align-items: flex-end;
|
|
11
9
|
gap: $spacer * 0.25;
|
|
10
|
+
max-width: 100%;
|
|
11
|
+
height: auto;
|
|
12
|
+
transition: max-width $transition;
|
|
12
13
|
}
|
|
13
14
|
|
|
14
15
|
.#{$n}-input--text__container {
|
|
15
16
|
display: flex;
|
|
16
17
|
position: relative;
|
|
17
18
|
flex: 1 1 100%;
|
|
18
|
-
|
|
19
|
+
width: fit-content;
|
|
20
|
+
max-width: calc(100% - #{$buttonsize} - #{$spacer * 0.25});
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
.#{$n}-upload-toggle-wrapper.#{$n}-transition--in ~ .#{$n}-entry-form {
|
|
24
|
+
max-width: calc(100% - #{$buttonsize} - #{$spacer * 0.25});
|
|
19
25
|
}
|
|
20
26
|
|
|
21
27
|
.#{$n}-entry-form .#{$n}-form-control__wrapper {
|
|
28
|
+
/* THIS IS FOR THE LABEL */
|
|
22
29
|
display: flex;
|
|
23
30
|
flex-direction: column;
|
|
24
31
|
gap: $spacer * 0.25;
|
|
@@ -27,31 +34,51 @@
|
|
|
27
34
|
|
|
28
35
|
.#{$n}-input__text {
|
|
29
36
|
appearance: none;
|
|
30
|
-
flex
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
37
|
+
flex: 1 1 100%;
|
|
38
|
+
width: 100%;
|
|
39
|
+
margin: 0;
|
|
40
|
+
padding: $spacer * 0.25 $spacer * 0.5;
|
|
34
41
|
transition: padding $transition;
|
|
35
42
|
border: $thin-border solid $grey-b;
|
|
36
43
|
border-radius: $borderradius-small;
|
|
37
44
|
color: $grey-e;
|
|
38
45
|
font-size: $fontsize-default;
|
|
46
|
+
hyphens: auto;
|
|
47
|
+
|
|
48
|
+
@include stylePlaceholder {
|
|
49
|
+
color: $grey-c;
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
input.#{$n}-input__text {
|
|
54
|
+
min-height: $buttonsize;
|
|
55
|
+
overflow: hidden;
|
|
39
56
|
text-overflow: ellipsis;
|
|
40
57
|
white-space: nowrap;
|
|
41
|
-
resize: none;
|
|
42
58
|
|
|
43
59
|
@include stylePlaceholder {
|
|
44
60
|
overflow: hidden;
|
|
45
|
-
color: $grey-c;
|
|
46
|
-
line-height: $spacer;
|
|
47
61
|
text-overflow: ellipsis;
|
|
48
62
|
white-space: nowrap;
|
|
49
63
|
}
|
|
50
64
|
}
|
|
51
65
|
|
|
52
|
-
.#{$n}-
|
|
53
|
-
|
|
54
|
-
|
|
66
|
+
textarea.#{$n}-input__text {
|
|
67
|
+
min-height: calc(4lh + 1rem);
|
|
68
|
+
resize: none;
|
|
69
|
+
scrollbar-color: initial transparent;
|
|
70
|
+
scrollbar-width: thin;
|
|
71
|
+
|
|
72
|
+
&::-webkit-scrollbar {
|
|
73
|
+
background-color: transparent;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
@supports (field-sizing: content) {
|
|
77
|
+
field-sizing: content;
|
|
78
|
+
min-height: $buttonsize;
|
|
79
|
+
max-height: calc(4lh + 1rem);
|
|
80
|
+
padding-top: $spacer * 0.35;
|
|
81
|
+
}
|
|
55
82
|
}
|
|
56
83
|
|
|
57
84
|
.#{$n}-character-warning .#{$n}-input__text,
|