@delightui/components 0.1.149 → 0.1.150

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.
@@ -0,0 +1,2 @@
1
+ import { ButtonContentAlignmentEnum } from './Button.types';
2
+ export declare const AlignContentMap: Record<ButtonContentAlignmentEnum, string>;
@@ -4,6 +4,7 @@ export type ButtonTypeEnum = 'Filled' | 'Outlined' | 'Ghost';
4
4
  export type ButtonStyleEnum = 'Primary' | 'Secondary' | 'Destructive';
5
5
  export type ButtonSizeEnum = 'Small' | 'Medium' | 'Large';
6
6
  export type ButtonActionTypeEnum = 'button' | 'submit' | 'reset';
7
+ export type ButtonContentAlignmentEnum = 'Center' | 'SpaceBetween';
7
8
  export type ButtonProps = Omit<HTMLAttributes<HTMLButtonElement>, 'style'> & {
8
9
  /**
9
10
  * Appearance of the button.
@@ -56,4 +57,9 @@ export type ButtonProps = Omit<HTMLAttributes<HTMLButtonElement>, 'style'> & {
56
57
  * @default 'button'
57
58
  */
58
59
  actionType?: ButtonActionTypeEnum;
60
+ /**
61
+ * Specifies alignment of the content like leading icon, content and trailing icon
62
+ * @default 'Center'
63
+ */
64
+ alignContent?: ButtonContentAlignmentEnum;
59
65
  };
@@ -0,0 +1,3 @@
1
+ import './Button.module.scss';
2
+ declare const ButtonExample: () => import("react/jsx-runtime").JSX.Element;
3
+ export default ButtonExample;
@@ -264,6 +264,7 @@ declare const usePresenter: (props: ToggleButtonProps) => {
264
264
  onTransitionEndCapture?: import("react").TransitionEventHandler<HTMLButtonElement> | undefined;
265
265
  leadingIcon?: import("react").ReactNode;
266
266
  trailingIcon?: import("react").ReactNode;
267
+ alignContent?: import("../Button/Button.types").ButtonContentAlignmentEnum;
267
268
  initialValue?: boolean | undefined;
268
269
  };
269
270
  isChecked: boolean;
@@ -125,6 +125,52 @@
125
125
  -o-object-fit: cover;
126
126
  object-fit: cover;
127
127
  }
128
+ .Text-module_text__qmiLT {
129
+ font-family: var(--text-font-family);
130
+ font-weight: var(--text-font-weight);
131
+ font-size: var(--text-font-size);
132
+ letter-spacing: var(--text-letter-spacing);
133
+ line-height: var(--text-line-height);
134
+ color: var(--text-color);
135
+ }
136
+
137
+ .Text-module_italic__b92M- {
138
+ font-style: italic;
139
+ }
140
+
141
+ .Text-module_underline__i8JpB {
142
+ -webkit-text-decoration: underline;
143
+ text-decoration: underline;
144
+ }
145
+
146
+ .Text-module_strikethrough__AHLhC {
147
+ -webkit-text-decoration: line-through;
148
+ text-decoration: line-through;
149
+ }
150
+
151
+ .Text-module_nowrap__JVMFL {
152
+ text-wrap: nowrap;
153
+ }
154
+
155
+ .Text-module_whiteSpaceNoWrap__GYqL2 {
156
+ white-space: nowrap;
157
+ }
158
+
159
+ .Text-module_capitalize__r9qCk {
160
+ text-transform: capitalize;
161
+ }
162
+
163
+ .Text-module_upperCase__VCs2x {
164
+ text-transform: uppercase;
165
+ }
166
+
167
+ .Text-module_lowerCase__0T-7t {
168
+ text-transform: lowercase;
169
+ }
170
+
171
+ .Text-module_ellipsis__UXzJI {
172
+ text-overflow: ellipsis;
173
+ }
128
174
  .Button-module_button__y6Gwz {
129
175
  display: flex;
130
176
  align-items: center;
@@ -164,7 +210,6 @@
164
210
  color: var(--button-color);
165
211
  }
166
212
  .Button-module_button__y6Gwz .Button-module_content__IipV4 {
167
- flex: 1;
168
213
  display: flex;
169
214
  justify-content: center;
170
215
  justify-content: var(--button-content-justify-content, center);
@@ -201,51 +246,17 @@
201
246
  .Button-module_button__y6Gwz:disabled {
202
247
  cursor: not-allowed;
203
248
  }
204
- .Text-module_text__qmiLT {
205
- font-family: var(--text-font-family);
206
- font-weight: var(--text-font-weight);
207
- font-size: var(--text-font-size);
208
- letter-spacing: var(--text-letter-spacing);
209
- line-height: var(--text-line-height);
210
- color: var(--text-color);
211
- }
212
-
213
- .Text-module_italic__b92M- {
214
- font-style: italic;
215
- }
216
-
217
- .Text-module_underline__i8JpB {
218
- -webkit-text-decoration: underline;
219
- text-decoration: underline;
220
- }
221
-
222
- .Text-module_strikethrough__AHLhC {
223
- -webkit-text-decoration: line-through;
224
- text-decoration: line-through;
225
- }
226
-
227
- .Text-module_nowrap__JVMFL {
228
- text-wrap: nowrap;
229
- }
230
-
231
- .Text-module_whiteSpaceNoWrap__GYqL2 {
232
- white-space: nowrap;
233
- }
234
-
235
- .Text-module_capitalize__r9qCk {
236
- text-transform: capitalize;
237
- }
238
-
239
- .Text-module_upperCase__VCs2x {
240
- text-transform: uppercase;
249
+ .Button-module_button__y6Gwz.Button-module_center__fnkix {
250
+ display: flex;
251
+ justify-content: center;
241
252
  }
242
-
243
- .Text-module_lowerCase__0T-7t {
244
- text-transform: lowercase;
253
+ .Button-module_button__y6Gwz.Button-module_spaceBetween__OFllq {
254
+ display: flex;
255
+ justify-content: space-between;
245
256
  }
246
-
247
- .Text-module_ellipsis__UXzJI {
248
- text-overflow: ellipsis;
257
+ .Button-module_button__y6Gwz.Button-module_spaceBetween__OFllq .Button-module_content__IipV4 {
258
+ display: flex;
259
+ flex: 1;
249
260
  }
250
261
  .Icon-module_icon__sUgmV {
251
262
  --icon-size: fit-content;
@@ -317,6 +328,7 @@
317
328
  --button-letter-spacing: var(--icon-button-letter-spacing);
318
329
  --button-line-height: var(--icon-button-line-height);
319
330
  }
331
+ @charset "UTF-8";
320
332
  .Input-module_input__NAeHe {
321
333
  display: flex;
322
334
  align-items: center;
@@ -378,6 +390,25 @@
378
390
  .Input-module_input__NAeHe .Input-module_disabled__6XebD {
379
391
  --b: 100;
380
392
  }
393
+ .Input-module_input__NAeHe .Input-module_inputElement__Tjw4v:-webkit-autofill,
394
+ .Input-module_input__NAeHe .Input-module_inputElement__Tjw4v:-webkit-autofill:hover,
395
+ .Input-module_input__NAeHe .Input-module_inputElement__Tjw4v:-webkit-autofill:focus,
396
+ .Input-module_input__NAeHe textarea.Input-module_inputElement__Tjw4v:-webkit-autofill,
397
+ .Input-module_input__NAeHe select.Input-module_inputElement__Tjw4v:-webkit-autofill {
398
+ /* Text color when autofilled */
399
+ -webkit-text-fill-color: var(--input-color);
400
+ /* Desired background color */
401
+ -webkit-box-shadow: 0 0 0px cal(var(--input-height)/2) var(--input-background-color) inset;
402
+ /* Prevent flicker */
403
+ -webkit-transition: background-color 5000s ease-in-out 0s;
404
+ transition: background-color 5000s ease-in-out 0s;
405
+ /* Caret color so it’s visible */
406
+ caret-color: var(--input-color);
407
+ border-top-left-radius: var(--input-border-top-left-radius);
408
+ border-top-right-radius: var(--input-border-top-right-radius);
409
+ border-bottom-right-radius: var(--input-border-bottom-right-radius);
410
+ border-bottom-left-radius: var(--input-border-bottom-left-radius);
411
+ }
381
412
  .Password-module_password__nk-zf.Password-module_password__nk-zf {
382
413
  --input-opacity: var(--password-opacity);
383
414
  --input-height: var(--password-height);