@livepeer/design-system 1.0.5 → 1.0.7
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/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"
|