@chekinapp/ui 0.0.82 → 0.0.83
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/index.cjs +24 -15
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +24 -15
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -19,7 +19,7 @@ var AccordionItem = React.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
19
19
|
ref,
|
|
20
20
|
className: cn(
|
|
21
21
|
"accordion__item",
|
|
22
|
-
"rounded-[var(--accordion-item-radius)] border border-solid border-[var(--accordion-item-border)] bg-[var(--accordion-item-bg)] shadow
|
|
22
|
+
"rounded-[var(--accordion-item-radius)] border border-solid border-[var(--accordion-item-border)] bg-[var(--accordion-item-bg)] [box-shadow:var(--accordion-item-shadow)] transition-colors duration-200 ease-in-out [border-top-color:var(--accordion-item-divider)] data-[state=open]:bg-[var(--accordion-item-open-bg)] data-[state=closed]:bg-[var(--accordion-item-bg)] data-[state=closed]:hover:bg-[var(--accordion-item-hover-bg)]",
|
|
23
23
|
className
|
|
24
24
|
),
|
|
25
25
|
...props
|
|
@@ -496,7 +496,7 @@ var switchVariants = cva4(
|
|
|
496
496
|
"peer inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors",
|
|
497
497
|
"focus-visible:outline-none focus-visible:shadow-[var(--chekin-shadow-focus)]",
|
|
498
498
|
"disabled:cursor-not-allowed disabled:opacity-50 aria-busy:cursor-wait aria-busy:opacity-50",
|
|
499
|
-
"data-[state=checked]:bg-[var(--
|
|
499
|
+
"data-[state=checked]:bg-[var(--switch-checked-bg)] data-[state=unchecked]:bg-[var(--switch-unchecked-bg)]"
|
|
500
500
|
],
|
|
501
501
|
{
|
|
502
502
|
variants: {
|
|
@@ -515,7 +515,7 @@ var switchVariants = cva4(
|
|
|
515
515
|
}
|
|
516
516
|
);
|
|
517
517
|
var switchThumbVariants = cva4(
|
|
518
|
-
"pointer-events-none block rounded-full bg-
|
|
518
|
+
"pointer-events-none block rounded-full bg-[var(--switch-thumb-bg)] shadow-lg ring-0 transition-transform data-[state=unchecked]:translate-x-0",
|
|
519
519
|
{
|
|
520
520
|
variants: {
|
|
521
521
|
size: {
|
|
@@ -5911,7 +5911,16 @@ var CircularLoader = React22.memo(
|
|
|
5911
5911
|
]
|
|
5912
5912
|
}
|
|
5913
5913
|
),
|
|
5914
|
-
label && /* @__PURE__ */ jsx71(
|
|
5914
|
+
label && /* @__PURE__ */ jsx71(
|
|
5915
|
+
"div",
|
|
5916
|
+
{
|
|
5917
|
+
className: cn(
|
|
5918
|
+
labelSizeClassName[size],
|
|
5919
|
+
"font-medium text-[var(--circular-loader-label-color)]"
|
|
5920
|
+
),
|
|
5921
|
+
children: label
|
|
5922
|
+
}
|
|
5923
|
+
)
|
|
5915
5924
|
]
|
|
5916
5925
|
}
|
|
5917
5926
|
);
|
|
@@ -6661,7 +6670,7 @@ var RadioGroupItem = React25.forwardRef(({ className, ...props }, ref) => /* @__
|
|
|
6661
6670
|
{
|
|
6662
6671
|
ref,
|
|
6663
6672
|
className: cn(
|
|
6664
|
-
"aspect-square h-4 w-4 rounded-full border border-[var(--
|
|
6673
|
+
"aspect-square h-4 w-4 rounded-full border border-[var(--radio-border)] text-[var(--radio-indicator)]",
|
|
6665
6674
|
"focus:outline-none focus-visible:shadow-[var(--chekin-shadow-focus)]",
|
|
6666
6675
|
"disabled:cursor-not-allowed disabled:opacity-50",
|
|
6667
6676
|
className
|
|
@@ -8901,8 +8910,8 @@ var Tabs = TabsPrimitive2.Root;
|
|
|
8901
8910
|
var tabsListVariants = cva13("inline-flex items-center", {
|
|
8902
8911
|
variants: {
|
|
8903
8912
|
variant: {
|
|
8904
|
-
button: 'tab-list h-[42px] justify-center gap-[7px] rounded-md border border-[var(--
|
|
8905
|
-
underlined: "tab-list mb-8 flex-wrap gap-x-6 gap-y-3 border-b border-[var(--
|
|
8913
|
+
button: 'tab-list h-[42px] justify-center gap-[7px] rounded-md border border-[var(--tabs-list-border)] bg-[var(--tabs-list-bg)] p-[3px] [&>*:not(:last-child)]:after:content-[""] [&>*:not(:last-child)]:after:absolute [&>*:not(:last-child)]:after:right-[-4px] [&>*:not(:last-child)]:after:h-6 [&>*:not(:last-child)]:after:w-px [&>*:not(:last-child)]:after:bg-[var(--tabs-list-separator)]',
|
|
8914
|
+
underlined: "tab-list mb-8 flex-wrap gap-x-6 gap-y-3 border-b border-[var(--tabs-list-border)]"
|
|
8906
8915
|
}
|
|
8907
8916
|
},
|
|
8908
8917
|
defaultVariants: {
|
|
@@ -8925,8 +8934,8 @@ var tabsTriggerVariants = cva13(
|
|
|
8925
8934
|
{
|
|
8926
8935
|
variants: {
|
|
8927
8936
|
variant: {
|
|
8928
|
-
button: "h-full flex-1 rounded-md px-4 text-center text-[15px] font-medium relative text-[var(--
|
|
8929
|
-
underlined: "h-full relative top-px pb-[15px] text-base font-medium leading-5 text-[var(--
|
|
8937
|
+
button: "h-full flex-1 rounded-md px-4 text-center text-[15px] font-medium relative text-[var(--tabs-trigger-text)] hover:bg-[var(--tabs-trigger-hover-bg)] hover:text-[var(--tabs-trigger-hover-text)] data-[state=active]:bg-[var(--tabs-trigger-active-bg)] data-[state=active]:font-bold data-[state=active]:text-[var(--tabs-trigger-active-text)] data-[state=active]:shadow-sm [&.active]:bg-[var(--tabs-trigger-active-bg)] [&.active]:font-bold [&.active]:text-[var(--tabs-trigger-active-text)] [&.active]:shadow-sm",
|
|
8938
|
+
underlined: "h-full relative top-px pb-[15px] text-base font-medium leading-5 text-[var(--tabs-trigger-text)] border-b-2 border-transparent -mb-px data-[state=active]:text-[var(--tabs-trigger-active-border)] data-[state=active]:border-[var(--tabs-trigger-active-border)] hover:border-[color-mix(in_srgb,var(--tabs-trigger-active-border)_30%,transparent)] [&.active]:border-[var(--tabs-trigger-active-border)]"
|
|
8930
8939
|
}
|
|
8931
8940
|
},
|
|
8932
8941
|
defaultVariants: {
|
|
@@ -9327,12 +9336,12 @@ import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
|
|
|
9327
9336
|
// src/toggle-group/style.ts
|
|
9328
9337
|
import { cva as cva14 } from "class-variance-authority";
|
|
9329
9338
|
var toggleVariants = cva14(
|
|
9330
|
-
"inline-flex select-none items-center justify-center rounded-md text-sm font-medium transition-all duration-
|
|
9339
|
+
"inline-flex select-none items-center justify-center rounded-md text-sm font-medium transition-all duration-200 ease-out focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--toggle-focus-ring)] focus-visible:ring-offset-2 disabled:pointer-events-none disabled:cursor-not-allowed [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
|
|
9331
9340
|
{
|
|
9332
9341
|
variants: {
|
|
9333
9342
|
variant: {
|
|
9334
|
-
default: "border border-[var(--
|
|
9335
|
-
tab: "border border-transparent bg-transparent font-medium text-[var(--
|
|
9343
|
+
default: "border border-[var(--toggle-border)] bg-[var(--toggle-bg)] font-semibold text-[var(--toggle-text)] hover:border-[var(--toggle-hover-border)] data-[state=on]:border-[var(--toggle-active-border)] data-[state=on]:bg-[var(--toggle-active-bg)] data-[state=on]:text-[var(--toggle-active-text)]",
|
|
9344
|
+
tab: "border border-transparent bg-transparent font-medium text-[var(--toggle-text)] hover:bg-[var(--toggle-hover-bg)] hover:text-[var(--toggle-hover-text)] hover:opacity-35 data-[state=on]:cursor-default data-[state=on]:border-[var(--toggle-active-border)] data-[state=on]:bg-[var(--toggle-tab-active-bg)] data-[state=on]:font-semibold data-[state=on]:text-[var(--toggle-tab-active-text)] data-[state=on]:shadow-[0px_3px_4px_0px_rgba(1,2,3,0.10)] data-[state=on]:hover:opacity-100"
|
|
9336
9345
|
},
|
|
9337
9346
|
size: {
|
|
9338
9347
|
default: "h-12 min-w-[117px] px-4 text-[15px]",
|
|
@@ -9342,7 +9351,7 @@ var toggleVariants = cva14(
|
|
|
9342
9351
|
},
|
|
9343
9352
|
theme: {
|
|
9344
9353
|
default: "",
|
|
9345
|
-
"sky-blue": "data-[state=on]:bg-[var(--
|
|
9354
|
+
"sky-blue": "data-[state=on]:bg-[var(--toggle-sky-blue-active-bg)] data-[state=off]:hover:border-transparent data-[state=off]:hover:bg-[var(--toggle-sky-blue-hover-bg)]"
|
|
9346
9355
|
}
|
|
9347
9356
|
},
|
|
9348
9357
|
defaultVariants: {
|
|
@@ -9368,7 +9377,7 @@ var ToggleGroup = React38.forwardRef(({ className, variant, size, theme, childre
|
|
|
9368
9377
|
ref,
|
|
9369
9378
|
className: cn(
|
|
9370
9379
|
"flex items-center justify-center",
|
|
9371
|
-
isTabVariant ? "h-auto max-h-none w-fit flex-wrap gap-[2px] rounded-md border border-[var(--
|
|
9380
|
+
isTabVariant ? "h-auto max-h-none w-fit flex-wrap gap-[2px] rounded-md border border-[var(--toggle-group-border)] bg-[var(--toggle-group-bg)] p-[2px]" : "w-full flex-wrap gap-[10px]",
|
|
9372
9381
|
className
|
|
9373
9382
|
),
|
|
9374
9383
|
...props,
|
|
@@ -9507,7 +9516,7 @@ function TogglesInternal({
|
|
|
9507
9516
|
...multiple ? { type: "multiple", value: currentValue } : { type: "single", value: currentValue[0] ?? "" }
|
|
9508
9517
|
};
|
|
9509
9518
|
return /* @__PURE__ */ jsxs73("div", { ref, className, children: [
|
|
9510
|
-
label && /* @__PURE__ */ jsx124("div", { className: "mb-2", children: /* @__PURE__ */ jsx124("div", { className: "select-none text-base font-normal text-[var(--
|
|
9519
|
+
label && /* @__PURE__ */ jsx124("div", { className: "mb-2", children: /* @__PURE__ */ jsx124("div", { className: "select-none text-base font-normal text-[var(--toggles-label-text)]", children: label }) }),
|
|
9511
9520
|
/* @__PURE__ */ jsx124(ToggleGroup, { className: groupClassName, ...toggleGroupProps, children: options.map((option, index) => {
|
|
9512
9521
|
const isSelected = Boolean(
|
|
9513
9522
|
getValueArray(value).find((selectedValue) => selectedValue === option.value)
|