@youngonesworks/ui 0.1.53 → 0.1.55
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/dist/components/passwordInput/index.d.ts +1 -0
- package/dist/components/profileMenu/ProfileMenu.d.ts +20 -0
- package/dist/components/profileMenu/ProfileMenu.stories.d.ts +9 -0
- package/dist/components/profileMenu/ProfileMenu.test.d.ts +1 -0
- package/dist/components/textInput/TextInput.stories.d.ts +1 -0
- package/dist/components/textInput/index.d.ts +2 -0
- package/dist/index.cjs +98 -90
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +98 -90
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -103143,9 +103143,96 @@ const AppleAppButtonIcon = (props) => /* @__PURE__ */ jsxs("svg", {
|
|
|
103143
103143
|
}) })]
|
|
103144
103144
|
});
|
|
103145
103145
|
|
|
103146
|
+
//#endregion
|
|
103147
|
+
//#region src/icons/IconLoading.tsx
|
|
103148
|
+
const IconLoading = ({ className,...props }) => /* @__PURE__ */ jsxs("svg", {
|
|
103149
|
+
"data-component": "button",
|
|
103150
|
+
"data-testid": "loading-svg-button",
|
|
103151
|
+
viewBox: "0 0 256 256",
|
|
103152
|
+
width: "1em",
|
|
103153
|
+
height: "1em",
|
|
103154
|
+
className,
|
|
103155
|
+
stroke: "currentColor",
|
|
103156
|
+
...props,
|
|
103157
|
+
children: [
|
|
103158
|
+
/* @__PURE__ */ jsx("line", {
|
|
103159
|
+
x1: "128",
|
|
103160
|
+
y1: "32",
|
|
103161
|
+
x2: "128",
|
|
103162
|
+
y2: "64",
|
|
103163
|
+
strokeLinecap: "round",
|
|
103164
|
+
strokeLinejoin: "round",
|
|
103165
|
+
strokeWidth: "24"
|
|
103166
|
+
}),
|
|
103167
|
+
/* @__PURE__ */ jsx("line", {
|
|
103168
|
+
x1: "195.9",
|
|
103169
|
+
y1: "60.1",
|
|
103170
|
+
x2: "173.3",
|
|
103171
|
+
y2: "82.7",
|
|
103172
|
+
strokeLinecap: "round",
|
|
103173
|
+
strokeLinejoin: "round",
|
|
103174
|
+
strokeWidth: "24"
|
|
103175
|
+
}),
|
|
103176
|
+
/* @__PURE__ */ jsx("line", {
|
|
103177
|
+
x1: "224",
|
|
103178
|
+
y1: "128",
|
|
103179
|
+
x2: "192",
|
|
103180
|
+
y2: "128",
|
|
103181
|
+
strokeLinecap: "round",
|
|
103182
|
+
strokeLinejoin: "round",
|
|
103183
|
+
strokeWidth: "24"
|
|
103184
|
+
}),
|
|
103185
|
+
/* @__PURE__ */ jsx("line", {
|
|
103186
|
+
x1: "195.9",
|
|
103187
|
+
y1: "195.9",
|
|
103188
|
+
x2: "173.3",
|
|
103189
|
+
y2: "173.3",
|
|
103190
|
+
strokeLinecap: "round",
|
|
103191
|
+
strokeLinejoin: "round",
|
|
103192
|
+
strokeWidth: "24"
|
|
103193
|
+
}),
|
|
103194
|
+
/* @__PURE__ */ jsx("line", {
|
|
103195
|
+
x1: "128",
|
|
103196
|
+
y1: "224",
|
|
103197
|
+
x2: "128",
|
|
103198
|
+
y2: "192",
|
|
103199
|
+
strokeLinecap: "round",
|
|
103200
|
+
strokeLinejoin: "round",
|
|
103201
|
+
strokeWidth: "24"
|
|
103202
|
+
}),
|
|
103203
|
+
/* @__PURE__ */ jsx("line", {
|
|
103204
|
+
x1: "60.1",
|
|
103205
|
+
y1: "195.9",
|
|
103206
|
+
x2: "82.7",
|
|
103207
|
+
y2: "173.3",
|
|
103208
|
+
strokeLinecap: "round",
|
|
103209
|
+
strokeLinejoin: "round",
|
|
103210
|
+
strokeWidth: "24"
|
|
103211
|
+
}),
|
|
103212
|
+
/* @__PURE__ */ jsx("line", {
|
|
103213
|
+
x1: "32",
|
|
103214
|
+
y1: "128",
|
|
103215
|
+
x2: "64",
|
|
103216
|
+
y2: "128",
|
|
103217
|
+
strokeLinecap: "round",
|
|
103218
|
+
strokeLinejoin: "round",
|
|
103219
|
+
strokeWidth: "24"
|
|
103220
|
+
}),
|
|
103221
|
+
/* @__PURE__ */ jsx("line", {
|
|
103222
|
+
x1: "60.1",
|
|
103223
|
+
y1: "60.1",
|
|
103224
|
+
x2: "82.7",
|
|
103225
|
+
y2: "82.7",
|
|
103226
|
+
strokeLinecap: "round",
|
|
103227
|
+
strokeLinejoin: "round",
|
|
103228
|
+
strokeWidth: "24"
|
|
103229
|
+
})
|
|
103230
|
+
]
|
|
103231
|
+
});
|
|
103232
|
+
|
|
103146
103233
|
//#endregion
|
|
103147
103234
|
//#region src/components/textInput/index.tsx
|
|
103148
|
-
const TextInput = React.forwardRef(({ rightSection, leftSection, className, error: error$1, autoFocus, label, maxLength, enablePasswordManagerAutofill = false, onBlur, disabled, onKeyDown, min: min$2 = "0", max: max$2, autoComplete, showRightSection = true, step, wrapperClassName, password = false,...props }, ref) => {
|
|
103235
|
+
const TextInput = React.forwardRef(({ rightSection, leftSection, className, error: error$1, autoFocus, label, maxLength, enablePasswordManagerAutofill = false, onBlur, disabled, loadingState, onKeyDown, min: min$2 = "0", max: max$2, autoComplete, showRightSection = true, step, wrapperClassName, password = false,...props }, ref) => {
|
|
103149
103236
|
const [showPassword, setShowPassword] = React.useState(false);
|
|
103150
103237
|
return /* @__PURE__ */ jsxs("div", {
|
|
103151
103238
|
"data-component": "TextInput",
|
|
@@ -103174,15 +103261,22 @@ const TextInput = React.forwardRef(({ rightSection, leftSection, className, erro
|
|
|
103174
103261
|
disabled,
|
|
103175
103262
|
step,
|
|
103176
103263
|
maxLength,
|
|
103177
|
-
className: clsx_default(`${disabled ? "text-gray-500" : "text-gray-900"} selection:bg-turquoise-200 focus:border-turquoise-500 focus:ring-turquoise-500 active:border-turquoise-500 active:ring-turquoise-500 h-10 w-full rounded-[4px] border border-gray-200 bg-gray-50 px-3 text-sm font-normal outline-hidden ${rightSection && "pr-12"} ${leftSection && "pl-12"} ${error$1 && "border-red-500 text-red-500 selection:bg-red-200 focus:border-red-500 focus:ring-red-500 focus:placeholder:text-red-500 active:border-red-500 active:ring-red-500"}`, className),
|
|
103264
|
+
className: clsx_default(`${loadingState ? "cursor-not-allowed" : ""}`, `${disabled ? "text-gray-500" : "text-gray-900"} selection:bg-turquoise-200 focus:border-turquoise-500 focus:ring-turquoise-500 active:border-turquoise-500 active:ring-turquoise-500 h-10 w-full rounded-[4px] border border-gray-200 bg-gray-50 px-3 text-sm font-normal outline-hidden ${rightSection && "pr-12"} ${leftSection && "pl-12"} ${error$1 && "border-red-500 text-red-500 selection:bg-red-200 focus:border-red-500 focus:ring-red-500 focus:placeholder:text-red-500 active:border-red-500 active:ring-red-500"}`, className),
|
|
103265
|
+
"aria-busy": loadingState || undefined,
|
|
103178
103266
|
"data-lpignore": enablePasswordManagerAutofill ? undefined : "true",
|
|
103179
103267
|
"data-1p-ignore": enablePasswordManagerAutofill ? undefined : "true",
|
|
103180
103268
|
ref,
|
|
103181
103269
|
...props,
|
|
103182
103270
|
type: password ? showPassword ? "text" : "password" : "text"
|
|
103183
103271
|
}),
|
|
103184
|
-
|
|
103185
|
-
className: "absolute inset-y-0 right-0 flex w-12 content-center items-center justify-center align-middle text-sm font-medium text-black",
|
|
103272
|
+
loadingState ? /* @__PURE__ */ jsx("div", {
|
|
103273
|
+
className: "absolute inset-y-0 right-0 flex h-10 w-12 content-center items-center justify-center align-middle text-sm font-medium text-black",
|
|
103274
|
+
children: /* @__PURE__ */ jsx(IconLoading, {
|
|
103275
|
+
className: "h-4 w-4 animate-spin text-gray-500",
|
|
103276
|
+
"aria-label": "Loading"
|
|
103277
|
+
})
|
|
103278
|
+
}) : rightSection && showRightSection && /* @__PURE__ */ jsx("div", {
|
|
103279
|
+
className: "absolute inset-y-0 right-0 flex h-10 w-12 content-center items-center justify-center align-middle text-sm font-medium text-black",
|
|
103186
103280
|
children: rightSection
|
|
103187
103281
|
}),
|
|
103188
103282
|
password && /* @__PURE__ */ jsx("div", {
|
|
@@ -103345,92 +103439,6 @@ const BreadCrumb = ({ children, LinkText }) => /* @__PURE__ */ jsx(LinkText, {
|
|
|
103345
103439
|
});
|
|
103346
103440
|
BreadCrumb.displayName = "BreadCrumb";
|
|
103347
103441
|
|
|
103348
|
-
//#endregion
|
|
103349
|
-
//#region src/icons/IconLoading.tsx
|
|
103350
|
-
const IconLoading = ({ className,...props }) => /* @__PURE__ */ jsxs("svg", {
|
|
103351
|
-
"data-component": "button",
|
|
103352
|
-
"data-testid": "loading-svg-button",
|
|
103353
|
-
viewBox: "0 0 256 256",
|
|
103354
|
-
width: "1em",
|
|
103355
|
-
height: "1em",
|
|
103356
|
-
className,
|
|
103357
|
-
...props,
|
|
103358
|
-
children: [
|
|
103359
|
-
/* @__PURE__ */ jsx("line", {
|
|
103360
|
-
x1: "128",
|
|
103361
|
-
y1: "32",
|
|
103362
|
-
x2: "128",
|
|
103363
|
-
y2: "64",
|
|
103364
|
-
strokeLinecap: "round",
|
|
103365
|
-
strokeLinejoin: "round",
|
|
103366
|
-
strokeWidth: "24"
|
|
103367
|
-
}),
|
|
103368
|
-
/* @__PURE__ */ jsx("line", {
|
|
103369
|
-
x1: "195.9",
|
|
103370
|
-
y1: "60.1",
|
|
103371
|
-
x2: "173.3",
|
|
103372
|
-
y2: "82.7",
|
|
103373
|
-
strokeLinecap: "round",
|
|
103374
|
-
strokeLinejoin: "round",
|
|
103375
|
-
strokeWidth: "24"
|
|
103376
|
-
}),
|
|
103377
|
-
/* @__PURE__ */ jsx("line", {
|
|
103378
|
-
x1: "224",
|
|
103379
|
-
y1: "128",
|
|
103380
|
-
x2: "192",
|
|
103381
|
-
y2: "128",
|
|
103382
|
-
strokeLinecap: "round",
|
|
103383
|
-
strokeLinejoin: "round",
|
|
103384
|
-
strokeWidth: "24"
|
|
103385
|
-
}),
|
|
103386
|
-
/* @__PURE__ */ jsx("line", {
|
|
103387
|
-
x1: "195.9",
|
|
103388
|
-
y1: "195.9",
|
|
103389
|
-
x2: "173.3",
|
|
103390
|
-
y2: "173.3",
|
|
103391
|
-
strokeLinecap: "round",
|
|
103392
|
-
strokeLinejoin: "round",
|
|
103393
|
-
strokeWidth: "24"
|
|
103394
|
-
}),
|
|
103395
|
-
/* @__PURE__ */ jsx("line", {
|
|
103396
|
-
x1: "128",
|
|
103397
|
-
y1: "224",
|
|
103398
|
-
x2: "128",
|
|
103399
|
-
y2: "192",
|
|
103400
|
-
strokeLinecap: "round",
|
|
103401
|
-
strokeLinejoin: "round",
|
|
103402
|
-
strokeWidth: "24"
|
|
103403
|
-
}),
|
|
103404
|
-
/* @__PURE__ */ jsx("line", {
|
|
103405
|
-
x1: "60.1",
|
|
103406
|
-
y1: "195.9",
|
|
103407
|
-
x2: "82.7",
|
|
103408
|
-
y2: "173.3",
|
|
103409
|
-
strokeLinecap: "round",
|
|
103410
|
-
strokeLinejoin: "round",
|
|
103411
|
-
strokeWidth: "24"
|
|
103412
|
-
}),
|
|
103413
|
-
/* @__PURE__ */ jsx("line", {
|
|
103414
|
-
x1: "32",
|
|
103415
|
-
y1: "128",
|
|
103416
|
-
x2: "64",
|
|
103417
|
-
y2: "128",
|
|
103418
|
-
strokeLinecap: "round",
|
|
103419
|
-
strokeLinejoin: "round",
|
|
103420
|
-
strokeWidth: "24"
|
|
103421
|
-
}),
|
|
103422
|
-
/* @__PURE__ */ jsx("line", {
|
|
103423
|
-
x1: "60.1",
|
|
103424
|
-
y1: "60.1",
|
|
103425
|
-
x2: "82.7",
|
|
103426
|
-
y2: "82.7",
|
|
103427
|
-
strokeLinecap: "round",
|
|
103428
|
-
strokeLinejoin: "round",
|
|
103429
|
-
strokeWidth: "24"
|
|
103430
|
-
})
|
|
103431
|
-
]
|
|
103432
|
-
});
|
|
103433
|
-
|
|
103434
103442
|
//#endregion
|
|
103435
103443
|
//#region src/components/button/buttonVariants.ts
|
|
103436
103444
|
const defaultButtonStyling = "justify-center group relative flex items-center gap-2 cursor-pointer border rounded py-2 px-5 text-sx md:text-sm md:font-medium font-medium hover:outline-hidden focus:outline-hidden disabled:cursor-not-allowed transition-colors duration-100 ease-in-out";
|