@livepeer/design-system 1.0.5 → 1.0.7
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/components/Accordion.d.ts +4 -4
- package/dist/components/Avatar.d.ts +1 -1
- package/dist/components/Checkbox.d.ts +1 -1
- package/dist/components/ContextMenu.d.ts +3 -3
- package/dist/components/Dialog.d.ts +1 -1
- package/dist/components/DropdownMenu.d.ts +3 -3
- package/dist/components/Heading.d.ts +1 -1
- package/dist/components/Menu.d.ts +2 -2
- package/dist/components/Paragraph.d.ts +1 -1
- package/dist/components/Popover.d.ts +1 -1
- package/dist/components/ProgressBar.d.ts +1 -1
- package/dist/components/Radio.d.ts +1 -1
- package/dist/components/RadioCard.d.ts +1 -1
- package/dist/components/Select.d.ts +1 -1
- package/dist/components/Sheet.d.ts +1 -1
- package/dist/components/Slider.d.ts +1 -1
- package/dist/components/Switch.d.ts +1 -1
- package/dist/components/Tabs.d.ts +1 -1
- package/dist/components/VerifiedBadge.d.ts +1 -1
- package/dist/index.es.js +24 -21
- package/dist/index.js +24 -21
- package/package.json +5 -5
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import type { CSS } from "../stitches.config";
|
|
3
3
|
import * as AccordionPrimitive from "@radix-ui/react-accordion";
|
|
4
|
-
export declare const Accordion: React.ForwardRefExoticComponent<(
|
|
4
|
+
export declare const Accordion: React.ForwardRefExoticComponent<(Omit<AccordionPrimitive.AccordionSingleProps & React.RefAttributes<HTMLDivElement> & {
|
|
5
5
|
css?: CSS | undefined;
|
|
6
|
-
}, "
|
|
6
|
+
}, "ref"> | Omit<AccordionPrimitive.AccordionMultipleProps & React.RefAttributes<HTMLDivElement> & {
|
|
7
7
|
css?: CSS | undefined;
|
|
8
|
-
}, "
|
|
8
|
+
}, "ref">) & React.RefAttributes<HTMLDivElement>>;
|
|
9
9
|
declare type AccordionTriggerPrimitiveProps = React.ComponentProps<typeof AccordionPrimitive.Trigger>;
|
|
10
10
|
declare type AccordionTriggerProps = AccordionTriggerPrimitiveProps & {
|
|
11
11
|
css?: CSS;
|
|
12
12
|
};
|
|
13
|
-
export declare const AccordionTrigger: React.ForwardRefExoticComponent<
|
|
13
|
+
export declare const AccordionTrigger: React.ForwardRefExoticComponent<Omit<AccordionTriggerProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
14
14
|
export declare const AccordionItem: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<AccordionPrimitive.AccordionItemProps & React.RefAttributes<HTMLDivElement>>, {}, {
|
|
15
15
|
bp1: "(min-width: 520px)";
|
|
16
16
|
bp2: "(min-width: 900px)";
|
|
@@ -2266,5 +2266,5 @@ declare type AvatarOwnProps = AvatarPrimitiveProps & AvatarVariants & {
|
|
|
2266
2266
|
fallback?: React.ReactNode;
|
|
2267
2267
|
status?: StatusColors["variant"];
|
|
2268
2268
|
};
|
|
2269
|
-
export declare const Avatar: React.ForwardRefExoticComponent<
|
|
2269
|
+
export declare const Avatar: React.ForwardRefExoticComponent<Omit<AvatarOwnProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
|
|
2270
2270
|
export {};
|
|
@@ -757,5 +757,5 @@ declare type CheckboxVariants = VariantProps<typeof StyledCheckbox>;
|
|
|
757
757
|
declare type CheckboxProps = CheckboxPrimitiveProps & CheckboxVariants & {
|
|
758
758
|
css?: CSS;
|
|
759
759
|
};
|
|
760
|
-
export declare const Checkbox: React.ForwardRefExoticComponent<
|
|
760
|
+
export declare const Checkbox: React.ForwardRefExoticComponent<Omit<CheckboxProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
761
761
|
export {};
|
|
@@ -7,7 +7,7 @@ declare type ContextMenuContentPrimitiveProps = React.ComponentProps<typeof Cont
|
|
|
7
7
|
declare type ContextMenuContentProps = ContextMenuContentPrimitiveProps & {
|
|
8
8
|
css?: CSS;
|
|
9
9
|
};
|
|
10
|
-
declare const ContextMenuContent: React.ForwardRefExoticComponent<
|
|
10
|
+
declare const ContextMenuContent: React.ForwardRefExoticComponent<Omit<ContextMenuContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
11
11
|
declare const ContextMenuItem: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<ContextMenuPrimitive.ContextMenuItemProps & React.RefAttributes<HTMLDivElement>>, {}, {
|
|
12
12
|
bp1: "(min-width: 520px)";
|
|
13
13
|
bp2: "(min-width: 900px)";
|
|
@@ -3008,7 +3008,7 @@ declare type ContextMenuCheckboxItemPrimitiveProps = React.ComponentProps<typeof
|
|
|
3008
3008
|
declare type ContextMenuCheckboxItemProps = ContextMenuCheckboxItemPrimitiveProps & {
|
|
3009
3009
|
css?: CSS;
|
|
3010
3010
|
};
|
|
3011
|
-
declare const ContextMenuCheckboxItem: React.ForwardRefExoticComponent<
|
|
3011
|
+
declare const ContextMenuCheckboxItem: React.ForwardRefExoticComponent<Omit<ContextMenuCheckboxItemProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
3012
3012
|
declare const ContextMenuRadioGroup: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<ContextMenuPrimitive.ContextMenuRadioGroupProps & React.RefAttributes<HTMLDivElement>>, {}, {
|
|
3013
3013
|
bp1: "(min-width: 520px)";
|
|
3014
3014
|
bp2: "(min-width: 900px)";
|
|
@@ -3762,5 +3762,5 @@ declare type ContextMenuRadioItemPrimitiveProps = React.ComponentProps<typeof Co
|
|
|
3762
3762
|
declare type ContextMenuRadioItemProps = ContextMenuRadioItemPrimitiveProps & {
|
|
3763
3763
|
css?: CSS;
|
|
3764
3764
|
};
|
|
3765
|
-
declare const ContextMenuRadioItem: React.ForwardRefExoticComponent<
|
|
3765
|
+
declare const ContextMenuRadioItem: React.ForwardRefExoticComponent<Omit<ContextMenuRadioItemProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
3766
3766
|
export { ContextMenu, ContextMenuTrigger, ContextMenuContent, ContextMenuItem, ContextMenuGroup, ContextMenuLabel, ContextMenuSeparator, ContextMenuCheckboxItem, ContextMenuRadioGroup, ContextMenuRadioItem, };
|
|
@@ -10,7 +10,7 @@ declare type DialogContentProps = DialogContentPrimitiveProps & {
|
|
|
10
10
|
css?: CSS;
|
|
11
11
|
animation?: "scale" | "fade";
|
|
12
12
|
};
|
|
13
|
-
export declare const DialogContent: React.ForwardRefExoticComponent<
|
|
13
|
+
export declare const DialogContent: React.ForwardRefExoticComponent<Omit<DialogContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
14
14
|
export declare const DialogTrigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
|
15
15
|
export declare const DialogTitle: React.ForwardRefExoticComponent<DialogPrimitive.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>>;
|
|
16
16
|
export declare const DialogDescription: React.ForwardRefExoticComponent<DialogPrimitive.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
|
|
@@ -7,7 +7,7 @@ declare type DropdownMenuContentPrimitiveProps = React.ComponentProps<typeof Dro
|
|
|
7
7
|
declare type DropdownMenuContentProps = DropdownMenuContentPrimitiveProps & {
|
|
8
8
|
css?: CSS;
|
|
9
9
|
};
|
|
10
|
-
declare const DropdownMenuContent: React.ForwardRefExoticComponent<
|
|
10
|
+
declare const DropdownMenuContent: React.ForwardRefExoticComponent<Omit<DropdownMenuContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
11
11
|
declare const DropdownMenuGroup: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuGroupProps & React.RefAttributes<HTMLDivElement>>, {}, {
|
|
12
12
|
bp1: "(min-width: 520px)";
|
|
13
13
|
bp2: "(min-width: 900px)";
|
|
@@ -4511,7 +4511,7 @@ declare const DropdownMenuItem: import("@stitches/react/types/styled-component")
|
|
|
4511
4511
|
};
|
|
4512
4512
|
};
|
|
4513
4513
|
}>>;
|
|
4514
|
-
declare const DropdownMenuRadioItem: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<
|
|
4514
|
+
declare const DropdownMenuRadioItem: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<Omit<DialogMenuRadioItemProps, "ref"> & React.RefAttributes<HTMLDivElement>>, {
|
|
4515
4515
|
color?: "gray" | "tomato" | "red" | "crimson" | "pink" | "plum" | "purple" | "violet" | "indigo" | "blue" | "sky" | "cyan" | "teal" | "mint" | "green" | "grass" | "lime" | "yellow" | "amber" | "orange" | "brown" | "primary" | undefined;
|
|
4516
4516
|
}, {
|
|
4517
4517
|
bp1: "(min-width: 520px)";
|
|
@@ -5262,7 +5262,7 @@ declare const DropdownMenuRadioItem: import("@stitches/react/types/styled-compon
|
|
|
5262
5262
|
};
|
|
5263
5263
|
};
|
|
5264
5264
|
}>>;
|
|
5265
|
-
declare const DropdownMenuCheckboxItem: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<
|
|
5265
|
+
declare const DropdownMenuCheckboxItem: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<Omit<DialogMenuCheckboxItemProps, "ref"> & React.RefAttributes<HTMLDivElement>>, {
|
|
5266
5266
|
color?: "gray" | "tomato" | "red" | "crimson" | "pink" | "plum" | "purple" | "violet" | "indigo" | "blue" | "sky" | "cyan" | "teal" | "mint" | "green" | "grass" | "lime" | "yellow" | "amber" | "orange" | "brown" | "primary" | undefined;
|
|
5267
5267
|
}, {
|
|
5268
5268
|
bp1: "(min-width: 520px)";
|
|
@@ -10,5 +10,5 @@ declare type HeadingProps = React.ComponentProps<typeof DEFAULT_TAG> & HeadingVa
|
|
|
10
10
|
css?: CSS;
|
|
11
11
|
as?: any;
|
|
12
12
|
};
|
|
13
|
-
export declare const Heading: React.ForwardRefExoticComponent<
|
|
13
|
+
export declare const Heading: React.ForwardRefExoticComponent<Omit<HeadingProps, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
|
|
14
14
|
export {};
|
|
@@ -8242,12 +8242,12 @@ declare type MenuRadioItemPrimitiveProps = React.ComponentProps<typeof MenuPrimi
|
|
|
8242
8242
|
declare type MenuRadioItemProps = MenuRadioItemPrimitiveProps & {
|
|
8243
8243
|
css?: CSS;
|
|
8244
8244
|
};
|
|
8245
|
-
export declare const MenuRadioItem: React.ForwardRefExoticComponent<
|
|
8245
|
+
export declare const MenuRadioItem: React.ForwardRefExoticComponent<Omit<MenuRadioItemProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
8246
8246
|
declare type MenuCheckboxItemPrimitiveProps = React.ComponentProps<typeof MenuPrimitive.CheckboxItem>;
|
|
8247
8247
|
declare type MenuCheckboxItemProps = MenuCheckboxItemPrimitiveProps & {
|
|
8248
8248
|
css?: CSS;
|
|
8249
8249
|
};
|
|
8250
|
-
export declare const MenuCheckboxItem: React.ForwardRefExoticComponent<
|
|
8250
|
+
export declare const MenuCheckboxItem: React.ForwardRefExoticComponent<Omit<MenuCheckboxItemProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
8251
8251
|
export declare const MenuLabel: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<MenuPrimitive.MenuLabelProps & React.RefAttributes<HTMLDivElement>>, {}, {
|
|
8252
8252
|
bp1: "(min-width: 520px)";
|
|
8253
8253
|
bp2: "(min-width: 900px)";
|
|
@@ -10,5 +10,5 @@ declare type ParagraphProps = React.ComponentProps<typeof DEFAULT_TAG> & Paragra
|
|
|
10
10
|
css?: CSS;
|
|
11
11
|
as?: any;
|
|
12
12
|
};
|
|
13
|
-
export declare const Paragraph: React.ForwardRefExoticComponent<
|
|
13
|
+
export declare const Paragraph: React.ForwardRefExoticComponent<Omit<ParagraphProps, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
|
|
14
14
|
export {};
|
|
@@ -8,6 +8,6 @@ declare type PopoverContentProps = PopoverContentPrimitiveProps & {
|
|
|
8
8
|
css?: CSS;
|
|
9
9
|
hideArrow?: boolean;
|
|
10
10
|
};
|
|
11
|
-
declare const PopoverContent: React.ForwardRefExoticComponent<
|
|
11
|
+
declare const PopoverContent: React.ForwardRefExoticComponent<Omit<PopoverContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
12
12
|
declare const PopoverClose: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverCloseProps & React.RefAttributes<HTMLButtonElement>>;
|
|
13
13
|
export { Popover, PopoverTrigger, PopoverContent, PopoverClose };
|
|
@@ -757,5 +757,5 @@ declare type ProgressBarPrimitiveProps = React.ComponentProps<typeof ProgressPri
|
|
|
757
757
|
declare type ProgressBarProps = ProgressBarPrimitiveProps & ProgressBarVariants & {
|
|
758
758
|
css?: CSS;
|
|
759
759
|
};
|
|
760
|
-
export declare const ProgressBar: React.ForwardRefExoticComponent<
|
|
760
|
+
export declare const ProgressBar: React.ForwardRefExoticComponent<Omit<ProgressBarProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
761
761
|
export {};
|
|
@@ -1506,5 +1506,5 @@ declare type RadioGroupItemPrimitiveProps = React.ComponentProps<typeof RadioGro
|
|
|
1506
1506
|
declare type RadioProps = RadioGroupItemPrimitiveProps & RadioVariants & {
|
|
1507
1507
|
css?: CSS;
|
|
1508
1508
|
};
|
|
1509
|
-
export declare const Radio: React.ForwardRefExoticComponent<
|
|
1509
|
+
export declare const Radio: React.ForwardRefExoticComponent<Omit<RadioProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
1510
1510
|
export {};
|
|
@@ -754,5 +754,5 @@ declare type RadioGroupItemPrimitiveProps = React.ComponentProps<typeof RadioGro
|
|
|
754
754
|
declare type RadioCardProps = RadioGroupItemPrimitiveProps & {
|
|
755
755
|
css?: CSS;
|
|
756
756
|
};
|
|
757
|
-
export declare const RadioCard: React.ForwardRefExoticComponent<
|
|
757
|
+
export declare const RadioCard: React.ForwardRefExoticComponent<Omit<RadioCardProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
758
758
|
export {};
|
|
@@ -752,7 +752,7 @@ declare const StyledSelect: import("@stitches/react/types/styled-component").Sty
|
|
|
752
752
|
declare type SelectProps = React.ComponentProps<typeof StyledSelect> & {
|
|
753
753
|
css?: CSS;
|
|
754
754
|
};
|
|
755
|
-
export declare const Select: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<
|
|
755
|
+
export declare const Select: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<Omit<SelectProps, "ref"> & React.RefAttributes<HTMLSelectElement>>, {}, {
|
|
756
756
|
bp1: "(min-width: 520px)";
|
|
757
757
|
bp2: "(min-width: 900px)";
|
|
758
758
|
bp3: "(min-width: 1200px)";
|
|
@@ -759,7 +759,7 @@ declare type DialogContentPrimitiveProps = React.ComponentProps<typeof DialogPri
|
|
|
759
759
|
declare type SheetContentProps = DialogContentPrimitiveProps & SheetContentVariants & {
|
|
760
760
|
css?: CSS;
|
|
761
761
|
};
|
|
762
|
-
declare const SheetContent: React.ForwardRefExoticComponent<
|
|
762
|
+
declare const SheetContent: React.ForwardRefExoticComponent<Omit<SheetContentProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
763
763
|
declare const SheetClose: React.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
|
|
764
764
|
declare const SheetTitle: React.ForwardRefExoticComponent<DialogPrimitive.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>>;
|
|
765
765
|
declare const SheetDescription: React.ForwardRefExoticComponent<DialogPrimitive.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
|
|
@@ -754,5 +754,5 @@ declare type SliderPrimitiveProps = React.ComponentProps<typeof SliderPrimitive.
|
|
|
754
754
|
declare type SliderProps = SliderPrimitiveProps & {
|
|
755
755
|
css?: CSS;
|
|
756
756
|
};
|
|
757
|
-
export declare const Slider: React.ForwardRefExoticComponent<
|
|
757
|
+
export declare const Slider: React.ForwardRefExoticComponent<Omit<SliderProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
|
|
758
758
|
export {};
|
|
@@ -757,7 +757,7 @@ declare type SwitchPrimitiveProps = React.ComponentProps<typeof SwitchPrimitive.
|
|
|
757
757
|
declare type SwitchProps = SwitchPrimitiveProps & SwitchVariants & {
|
|
758
758
|
css?: CSS;
|
|
759
759
|
};
|
|
760
|
-
export declare const Switch: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<
|
|
760
|
+
export declare const Switch: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<Omit<SwitchProps, "ref"> & React.RefAttributes<HTMLButtonElement>>, {}, {
|
|
761
761
|
bp1: "(min-width: 520px)";
|
|
762
762
|
bp2: "(min-width: 900px)";
|
|
763
763
|
bp3: "(min-width: 1200px)";
|
|
@@ -2251,7 +2251,7 @@ export declare const TabsTrigger: import("@stitches/react/types/styled-component
|
|
|
2251
2251
|
};
|
|
2252
2252
|
};
|
|
2253
2253
|
}>>;
|
|
2254
|
-
export declare const TabsList: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<
|
|
2254
|
+
export declare const TabsList: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<Omit<TabsListProps, "ref"> & React.RefAttributes<HTMLDivElement>>, {}, {
|
|
2255
2255
|
bp1: "(min-width: 520px)";
|
|
2256
2256
|
bp2: "(min-width: 900px)";
|
|
2257
2257
|
bp3: "(min-width: 1200px)";
|
|
@@ -758,5 +758,5 @@ declare const StyledVerifiedBadge: import("@stitches/react/types/styled-componen
|
|
|
758
758
|
declare type VerifiedBadgeProps = React.ComponentProps<typeof StyledVerifiedBadge> & {
|
|
759
759
|
css?: CSS;
|
|
760
760
|
};
|
|
761
|
-
export declare const VerifiedBadge: React.ForwardRefExoticComponent<
|
|
761
|
+
export declare const VerifiedBadge: React.ForwardRefExoticComponent<Omit<VerifiedBadgeProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
|
|
762
762
|
export {};
|
package/dist/index.es.js
CHANGED
|
@@ -472,6 +472,7 @@ var StyledOverlay$2 = styled(AlertDialogPrimitive.Overlay, overlayStyles, {
|
|
|
472
472
|
left: 0,
|
|
473
473
|
backgroundColor: "rgba(0,0,0,.35)",
|
|
474
474
|
inset: 0,
|
|
475
|
+
zIndex: 1000,
|
|
475
476
|
variants: {
|
|
476
477
|
animation: {
|
|
477
478
|
true: {
|
|
@@ -504,6 +505,7 @@ var StyledAlertDialogContent = styled(AlertDialogPrimitive.Content, panelStyles,
|
|
|
504
505
|
borderRadius: "$4",
|
|
505
506
|
boxShadow: "$colors$shadowLight 0px 10px 38px -10px, $colors$shadowDark 0px 10px 20px -15px",
|
|
506
507
|
color: "$black",
|
|
508
|
+
zIndex: 1001,
|
|
507
509
|
"&:focus": {
|
|
508
510
|
outline: "none",
|
|
509
511
|
},
|
|
@@ -528,7 +530,7 @@ var StyledAlertDialogContent = styled(AlertDialogPrimitive.Content, panelStyles,
|
|
|
528
530
|
});
|
|
529
531
|
var AlertDialogContent = function (_a) {
|
|
530
532
|
var children = _a.children, _b = _a.animation, animation = _b === void 0 ? "scale" : _b, props = __rest(_a, ["children", "animation"]);
|
|
531
|
-
return (React.createElement(StyledAlertDialogContent, __assign({ animation: animation }, props), children));
|
|
533
|
+
return (React.createElement(StyledAlertDialogContent, __assign({ animation: animation }, props, { style: { overflow: 'auto' } }), children));
|
|
532
534
|
};
|
|
533
535
|
var AlertDialogTitle = AlertDialogPrimitive.Title;
|
|
534
536
|
var AlertDialogDescription = AlertDialogPrimitive.Description;
|
|
@@ -1372,12 +1374,12 @@ var compoundVariants = [];
|
|
|
1372
1374
|
for (var _i$1 = 0, naturalPairingsKeys_1$1 = naturalPairingsKeys; _i$1 < naturalPairingsKeys_1$1.length; _i$1++) {
|
|
1373
1375
|
var color$1 = naturalPairingsKeys_1$1[_i$1];
|
|
1374
1376
|
colorVariants$1[color$1] = {
|
|
1375
|
-
bc: "$".concat(color$1, "
|
|
1376
|
-
color: "
|
|
1377
|
-
"&:hover": { bc: "$".concat(color$1, "
|
|
1378
|
-
"&:active": { bc: "$".concat(color$1, "
|
|
1377
|
+
bc: "$".concat(color$1, "9"),
|
|
1378
|
+
color: "white",
|
|
1379
|
+
"&:hover": { bc: "$".concat(color$1, "10") },
|
|
1380
|
+
"&:active": { bc: "$".concat(color$1, "11") },
|
|
1379
1381
|
'&[data-radix-popover-trigger][data-state="open"], &[data-radix-dropdown-menu-trigger][data-state="open"]': {
|
|
1380
|
-
bc: "$".concat(color$1, "
|
|
1382
|
+
bc: "$".concat(color$1, "9"),
|
|
1381
1383
|
boxShadow: "inset 0 0 0 1px $colors$".concat(color$1, "8"),
|
|
1382
1384
|
},
|
|
1383
1385
|
};
|
|
@@ -1437,14 +1439,14 @@ var Button = styled("button", {
|
|
|
1437
1439
|
variants: {
|
|
1438
1440
|
size: {
|
|
1439
1441
|
"1": {
|
|
1440
|
-
borderRadius: "$
|
|
1442
|
+
borderRadius: "$1",
|
|
1441
1443
|
height: "$5",
|
|
1442
1444
|
px: "$2",
|
|
1443
1445
|
fontSize: "$1",
|
|
1444
1446
|
lineHeight: "$sizes$5",
|
|
1445
1447
|
},
|
|
1446
1448
|
"2": {
|
|
1447
|
-
borderRadius: "$
|
|
1449
|
+
borderRadius: "$2",
|
|
1448
1450
|
height: "$5",
|
|
1449
1451
|
px: "$3",
|
|
1450
1452
|
py: "$3",
|
|
@@ -1452,14 +1454,14 @@ var Button = styled("button", {
|
|
|
1452
1454
|
lineHeight: "$sizes$6",
|
|
1453
1455
|
},
|
|
1454
1456
|
"3": {
|
|
1455
|
-
borderRadius: "$
|
|
1457
|
+
borderRadius: "$2",
|
|
1456
1458
|
height: "$6",
|
|
1457
1459
|
px: "$3",
|
|
1458
1460
|
fontSize: "$3",
|
|
1459
1461
|
lineHeight: "$sizes$6",
|
|
1460
1462
|
},
|
|
1461
1463
|
"4": {
|
|
1462
|
-
borderRadius: "$
|
|
1464
|
+
borderRadius: "$2",
|
|
1463
1465
|
height: "$7",
|
|
1464
1466
|
px: "$4",
|
|
1465
1467
|
fontSize: "$4",
|
|
@@ -1467,22 +1469,22 @@ var Button = styled("button", {
|
|
|
1467
1469
|
},
|
|
1468
1470
|
},
|
|
1469
1471
|
variant: __assign(__assign({ primary: {
|
|
1470
|
-
bc: "$
|
|
1471
|
-
color: "
|
|
1472
|
-
"&:hover": { bc: "$
|
|
1473
|
-
"&:active": { bc: "$
|
|
1472
|
+
bc: "$primary9",
|
|
1473
|
+
color: "white",
|
|
1474
|
+
"&:hover": { bc: "$primary10" },
|
|
1475
|
+
"&:active": { bc: "$primary11" },
|
|
1474
1476
|
"&:disabled": {
|
|
1475
1477
|
opacity: 0.5,
|
|
1476
1478
|
},
|
|
1477
1479
|
'&[data-radix-popover-trigger][data-state="open"], &[data-radix-dropdown-menu-trigger][data-state="open"]': {
|
|
1478
|
-
bc: "$
|
|
1480
|
+
bc: "$primary9",
|
|
1479
1481
|
boxShadow: "inset 0 0 0 1px $colors$primary8",
|
|
1480
1482
|
},
|
|
1481
1483
|
}, neutral: {
|
|
1482
|
-
bc: "$
|
|
1483
|
-
color: "
|
|
1484
|
-
"&:hover": { bc: "$
|
|
1485
|
-
"&:active": { bc: "$
|
|
1484
|
+
bc: "$neutral8",
|
|
1485
|
+
color: "white",
|
|
1486
|
+
"&:hover": { bc: "$neutral10" },
|
|
1487
|
+
"&:active": { bc: "$neutral11" },
|
|
1486
1488
|
"&:disabled": {
|
|
1487
1489
|
opacity: 0.5,
|
|
1488
1490
|
},
|
|
@@ -2457,8 +2459,8 @@ var StyledOverlay$1 = styled(DialogPrimitive.Overlay, overlayStyles, {
|
|
|
2457
2459
|
bottom: 0,
|
|
2458
2460
|
left: 0,
|
|
2459
2461
|
backgroundColor: "rgba(0,0,0,.35)",
|
|
2460
|
-
backdropFilter: "blur(5px)",
|
|
2461
2462
|
inset: 0,
|
|
2463
|
+
zIndex: 1000,
|
|
2462
2464
|
variants: {
|
|
2463
2465
|
animation: {
|
|
2464
2466
|
true: {
|
|
@@ -2490,6 +2492,7 @@ var StyledDialogContent = styled(DialogPrimitive.Content, panelStyles, {
|
|
|
2490
2492
|
borderRadius: "$4",
|
|
2491
2493
|
boxShadow: "$colors$shadowLight 0px 10px 38px -10px, $colors$shadowDark 0px 10px 20px -15px",
|
|
2492
2494
|
color: "$black",
|
|
2495
|
+
zIndex: 1001,
|
|
2493
2496
|
"&:focus": {
|
|
2494
2497
|
outline: "none",
|
|
2495
2498
|
},
|
|
@@ -2525,7 +2528,7 @@ var DialogContent = React.forwardRef(function (_a, forwardedRef) {
|
|
|
2525
2528
|
var children = _a.children; _a.animation; var props = __rest(_a, ["children", "animation"]);
|
|
2526
2529
|
return (React.createElement(DialogPrimitive.Portal, null,
|
|
2527
2530
|
React.createElement(StyledOverlay$1, null),
|
|
2528
|
-
React.createElement(StyledDialogContent, __assign({}, props, { ref: forwardedRef }),
|
|
2531
|
+
React.createElement(StyledDialogContent, __assign({}, props, { ref: forwardedRef, style: { overflow: 'auto' } }),
|
|
2529
2532
|
children,
|
|
2530
2533
|
React.createElement(StyledCloseButton$1, { asChild: true },
|
|
2531
2534
|
React.createElement(IconButton, { variant: "ghost" },
|
package/dist/index.js
CHANGED
|
@@ -516,6 +516,7 @@ var StyledOverlay$2 = styled(AlertDialogPrimitive__namespace.Overlay, overlaySty
|
|
|
516
516
|
left: 0,
|
|
517
517
|
backgroundColor: "rgba(0,0,0,.35)",
|
|
518
518
|
inset: 0,
|
|
519
|
+
zIndex: 1000,
|
|
519
520
|
variants: {
|
|
520
521
|
animation: {
|
|
521
522
|
true: {
|
|
@@ -548,6 +549,7 @@ var StyledAlertDialogContent = styled(AlertDialogPrimitive__namespace.Content, p
|
|
|
548
549
|
borderRadius: "$4",
|
|
549
550
|
boxShadow: "$colors$shadowLight 0px 10px 38px -10px, $colors$shadowDark 0px 10px 20px -15px",
|
|
550
551
|
color: "$black",
|
|
552
|
+
zIndex: 1001,
|
|
551
553
|
"&:focus": {
|
|
552
554
|
outline: "none",
|
|
553
555
|
},
|
|
@@ -572,7 +574,7 @@ var StyledAlertDialogContent = styled(AlertDialogPrimitive__namespace.Content, p
|
|
|
572
574
|
});
|
|
573
575
|
var AlertDialogContent = function (_a) {
|
|
574
576
|
var children = _a.children, _b = _a.animation, animation = _b === void 0 ? "scale" : _b, props = tslib.__rest(_a, ["children", "animation"]);
|
|
575
|
-
return (React__default["default"].createElement(StyledAlertDialogContent, tslib.__assign({ animation: animation }, props), children));
|
|
577
|
+
return (React__default["default"].createElement(StyledAlertDialogContent, tslib.__assign({ animation: animation }, props, { style: { overflow: 'auto' } }), children));
|
|
576
578
|
};
|
|
577
579
|
var AlertDialogTitle = AlertDialogPrimitive__namespace.Title;
|
|
578
580
|
var AlertDialogDescription = AlertDialogPrimitive__namespace.Description;
|
|
@@ -1416,12 +1418,12 @@ var compoundVariants = [];
|
|
|
1416
1418
|
for (var _i$1 = 0, naturalPairingsKeys_1$1 = naturalPairingsKeys; _i$1 < naturalPairingsKeys_1$1.length; _i$1++) {
|
|
1417
1419
|
var color$1 = naturalPairingsKeys_1$1[_i$1];
|
|
1418
1420
|
colorVariants$1[color$1] = {
|
|
1419
|
-
bc: "$".concat(color$1, "
|
|
1420
|
-
color: "
|
|
1421
|
-
"&:hover": { bc: "$".concat(color$1, "
|
|
1422
|
-
"&:active": { bc: "$".concat(color$1, "
|
|
1421
|
+
bc: "$".concat(color$1, "9"),
|
|
1422
|
+
color: "white",
|
|
1423
|
+
"&:hover": { bc: "$".concat(color$1, "10") },
|
|
1424
|
+
"&:active": { bc: "$".concat(color$1, "11") },
|
|
1423
1425
|
'&[data-radix-popover-trigger][data-state="open"], &[data-radix-dropdown-menu-trigger][data-state="open"]': {
|
|
1424
|
-
bc: "$".concat(color$1, "
|
|
1426
|
+
bc: "$".concat(color$1, "9"),
|
|
1425
1427
|
boxShadow: "inset 0 0 0 1px $colors$".concat(color$1, "8"),
|
|
1426
1428
|
},
|
|
1427
1429
|
};
|
|
@@ -1481,14 +1483,14 @@ var Button = styled("button", {
|
|
|
1481
1483
|
variants: {
|
|
1482
1484
|
size: {
|
|
1483
1485
|
"1": {
|
|
1484
|
-
borderRadius: "$
|
|
1486
|
+
borderRadius: "$1",
|
|
1485
1487
|
height: "$5",
|
|
1486
1488
|
px: "$2",
|
|
1487
1489
|
fontSize: "$1",
|
|
1488
1490
|
lineHeight: "$sizes$5",
|
|
1489
1491
|
},
|
|
1490
1492
|
"2": {
|
|
1491
|
-
borderRadius: "$
|
|
1493
|
+
borderRadius: "$2",
|
|
1492
1494
|
height: "$5",
|
|
1493
1495
|
px: "$3",
|
|
1494
1496
|
py: "$3",
|
|
@@ -1496,14 +1498,14 @@ var Button = styled("button", {
|
|
|
1496
1498
|
lineHeight: "$sizes$6",
|
|
1497
1499
|
},
|
|
1498
1500
|
"3": {
|
|
1499
|
-
borderRadius: "$
|
|
1501
|
+
borderRadius: "$2",
|
|
1500
1502
|
height: "$6",
|
|
1501
1503
|
px: "$3",
|
|
1502
1504
|
fontSize: "$3",
|
|
1503
1505
|
lineHeight: "$sizes$6",
|
|
1504
1506
|
},
|
|
1505
1507
|
"4": {
|
|
1506
|
-
borderRadius: "$
|
|
1508
|
+
borderRadius: "$2",
|
|
1507
1509
|
height: "$7",
|
|
1508
1510
|
px: "$4",
|
|
1509
1511
|
fontSize: "$4",
|
|
@@ -1511,22 +1513,22 @@ var Button = styled("button", {
|
|
|
1511
1513
|
},
|
|
1512
1514
|
},
|
|
1513
1515
|
variant: tslib.__assign(tslib.__assign({ primary: {
|
|
1514
|
-
bc: "$
|
|
1515
|
-
color: "
|
|
1516
|
-
"&:hover": { bc: "$
|
|
1517
|
-
"&:active": { bc: "$
|
|
1516
|
+
bc: "$primary9",
|
|
1517
|
+
color: "white",
|
|
1518
|
+
"&:hover": { bc: "$primary10" },
|
|
1519
|
+
"&:active": { bc: "$primary11" },
|
|
1518
1520
|
"&:disabled": {
|
|
1519
1521
|
opacity: 0.5,
|
|
1520
1522
|
},
|
|
1521
1523
|
'&[data-radix-popover-trigger][data-state="open"], &[data-radix-dropdown-menu-trigger][data-state="open"]': {
|
|
1522
|
-
bc: "$
|
|
1524
|
+
bc: "$primary9",
|
|
1523
1525
|
boxShadow: "inset 0 0 0 1px $colors$primary8",
|
|
1524
1526
|
},
|
|
1525
1527
|
}, neutral: {
|
|
1526
|
-
bc: "$
|
|
1527
|
-
color: "
|
|
1528
|
-
"&:hover": { bc: "$
|
|
1529
|
-
"&:active": { bc: "$
|
|
1528
|
+
bc: "$neutral8",
|
|
1529
|
+
color: "white",
|
|
1530
|
+
"&:hover": { bc: "$neutral10" },
|
|
1531
|
+
"&:active": { bc: "$neutral11" },
|
|
1530
1532
|
"&:disabled": {
|
|
1531
1533
|
opacity: 0.5,
|
|
1532
1534
|
},
|
|
@@ -2501,8 +2503,8 @@ var StyledOverlay$1 = styled(DialogPrimitive__namespace.Overlay, overlayStyles,
|
|
|
2501
2503
|
bottom: 0,
|
|
2502
2504
|
left: 0,
|
|
2503
2505
|
backgroundColor: "rgba(0,0,0,.35)",
|
|
2504
|
-
backdropFilter: "blur(5px)",
|
|
2505
2506
|
inset: 0,
|
|
2507
|
+
zIndex: 1000,
|
|
2506
2508
|
variants: {
|
|
2507
2509
|
animation: {
|
|
2508
2510
|
true: {
|
|
@@ -2534,6 +2536,7 @@ var StyledDialogContent = styled(DialogPrimitive__namespace.Content, panelStyles
|
|
|
2534
2536
|
borderRadius: "$4",
|
|
2535
2537
|
boxShadow: "$colors$shadowLight 0px 10px 38px -10px, $colors$shadowDark 0px 10px 20px -15px",
|
|
2536
2538
|
color: "$black",
|
|
2539
|
+
zIndex: 1001,
|
|
2537
2540
|
"&:focus": {
|
|
2538
2541
|
outline: "none",
|
|
2539
2542
|
},
|
|
@@ -2569,7 +2572,7 @@ var DialogContent = React__default["default"].forwardRef(function (_a, forwarded
|
|
|
2569
2572
|
var children = _a.children; _a.animation; var props = tslib.__rest(_a, ["children", "animation"]);
|
|
2570
2573
|
return (React__default["default"].createElement(DialogPrimitive__namespace.Portal, null,
|
|
2571
2574
|
React__default["default"].createElement(StyledOverlay$1, null),
|
|
2572
|
-
React__default["default"].createElement(StyledDialogContent, tslib.__assign({}, props, { ref: forwardedRef }),
|
|
2575
|
+
React__default["default"].createElement(StyledDialogContent, tslib.__assign({}, props, { ref: forwardedRef, style: { overflow: 'auto' } }),
|
|
2573
2576
|
children,
|
|
2574
2577
|
React__default["default"].createElement(StyledCloseButton$1, { asChild: true },
|
|
2575
2578
|
React__default["default"].createElement(IconButton, { variant: "ghost" },
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@livepeer/design-system",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.7",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/index.es.js",
|
|
@@ -61,14 +61,14 @@
|
|
|
61
61
|
},
|
|
62
62
|
"devDependencies": {
|
|
63
63
|
"@next/mdx": "^12.2.4",
|
|
64
|
-
"@rollup/plugin-commonjs": "^
|
|
64
|
+
"@rollup/plugin-commonjs": "^22.0.1",
|
|
65
65
|
"@rollup/plugin-node-resolve": "^13.3.0",
|
|
66
66
|
"@types/bezier-easing": "^2.1.2",
|
|
67
67
|
"@types/chroma-js": "^2.1.4",
|
|
68
68
|
"@types/lodash.merge": "^4.6.7",
|
|
69
69
|
"@types/lodash.omit": "^4.5.7",
|
|
70
70
|
"@types/node": "18.6.4",
|
|
71
|
-
"@types/react": "^18.0.
|
|
71
|
+
"@types/react": "^18.0.15",
|
|
72
72
|
"@types/react-transition-group": "^4.4.5",
|
|
73
73
|
"bezier-easing": "^2.1.0",
|
|
74
74
|
"chroma-js": "^2.4.2",
|
|
@@ -82,10 +82,10 @@
|
|
|
82
82
|
"react": "^18.2.0",
|
|
83
83
|
"react-bezier-curve-editor": "^1.1.2",
|
|
84
84
|
"react-dom": "^18.2.0",
|
|
85
|
-
"rollup": "^2.
|
|
85
|
+
"rollup": "^2.77.2",
|
|
86
86
|
"rollup-plugin-peer-deps-external": "^2.2.4",
|
|
87
87
|
"rollup-plugin-typescript2": "^0.32.1",
|
|
88
|
-
"typescript": "
|
|
88
|
+
"typescript": "4.7.4"
|
|
89
89
|
},
|
|
90
90
|
"publishConfig": {
|
|
91
91
|
"registry": "https://registry.npmjs.org"
|