@clicktap/ui 0.0.3
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/Avatar/Avatar.d.ts +3 -0
- package/Avatar/AvatarGroup/AvatarGroup.d.ts +4 -0
- package/Avatar/AvatarGroup/types.d.ts +2 -0
- package/Avatar/types.d.ts +6 -0
- package/Badge/Badge.d.ts +3 -0
- package/Badge/types.d.ts +3 -0
- package/Breadcrumbs/BreadcrumbEllipsis.d.ts +3 -0
- package/Breadcrumbs/BreadcrumbItem.d.ts +3 -0
- package/Breadcrumbs/BreadcrumbLink.d.ts +3 -0
- package/Breadcrumbs/BreadcrumbSeparator.d.ts +3 -0
- package/Breadcrumbs/Breadcrumbs.d.ts +3 -0
- package/Breadcrumbs/styles.d.ts +5 -0
- package/Breadcrumbs/types.d.ts +10 -0
- package/Button/Button.d.ts +3 -0
- package/Button/styles.d.ts +7 -0
- package/Button/types.d.ts +6 -0
- package/Checkbox/Checkbox.d.ts +3 -0
- package/Checkbox/styles.d.ts +5 -0
- package/Collapsible/Collapsible.d.ts +3 -0
- package/Collapsible/CollapsibleTrigger.d.ts +5 -0
- package/Collapsible/styles.d.ts +2 -0
- package/Collapsible/types.d.ts +12 -0
- package/ContextMenu/ContextMenu.d.ts +18 -0
- package/ContextMenu/styles.d.ts +12 -0
- package/DateInput/DateInput.d.ts +15 -0
- package/DateInput/styles.d.ts +8 -0
- package/Dialog/Dialog.d.ts +3 -0
- package/Dialog/styles.d.ts +12 -0
- package/Divider/Divider.d.ts +3 -0
- package/Divider/styles.d.ts +5 -0
- package/Drawer/Drawer.d.ts +11 -0
- package/Drawer/styles.d.ts +12 -0
- package/Input/Input.d.ts +15 -0
- package/Input/styles.d.ts +6 -0
- package/Link/Link.d.ts +3 -0
- package/Link/styles.d.ts +4 -0
- package/Loader/CircularEasing/CircularEasing.d.ts +3 -0
- package/Loader/CircularEasing/styles.d.ts +76 -0
- package/Loader/CircularEasing/types.d.ts +7 -0
- package/Loader/Pulse/Pulse.d.ts +2 -0
- package/Loader/Pulse/styles.d.ts +5 -0
- package/Loader/index.d.ts +2 -0
- package/Meter/Meter.d.ts +3 -0
- package/Meter/styles.d.ts +7 -0
- package/Meter/types.d.ts +5 -0
- package/Modal/Modal.d.ts +3 -0
- package/Modal/styles.d.ts +6 -0
- package/ModalOverlay/ModalOverlay.d.ts +3 -0
- package/ModalOverlay/styles.d.ts +6 -0
- package/NavigationMenu/NavigationMenu.d.ts +2 -0
- package/NavigationMenu/styles.d.ts +19 -0
- package/NumberInput/NumberInput.d.ts +24 -0
- package/NumberInput/styles.d.ts +3 -0
- package/PinInput/PinInput.d.ts +33 -0
- package/PinInput/styles.d.ts +8 -0
- package/Progressbar/CircularProgressbar/CircularProgressbar.d.ts +3 -0
- package/Progressbar/CircularProgressbar/styles.d.ts +7 -0
- package/Progressbar/CircularProgressbar/types.d.ts +7 -0
- package/Progressbar/LinearProgressbar/LinearProgressbar.d.ts +3 -0
- package/Progressbar/LinearProgressbar/styles.d.ts +13 -0
- package/Progressbar/LinearProgressbar/types.d.ts +6 -0
- package/Progressbar/index.d.ts +2 -0
- package/Select/Option.d.ts +3 -0
- package/Select/Select.d.ts +24 -0
- package/Select/styles.d.ts +29 -0
- package/Slider/Slider.d.ts +15 -0
- package/Slider/styles.d.ts +6 -0
- package/Switch/Switch.d.ts +7 -0
- package/Switch/styles.d.ts +3 -0
- package/Tabs/Tab.d.ts +3 -0
- package/Tabs/TabList.d.ts +3 -0
- package/Tabs/TabPanel.d.ts +3 -0
- package/Tabs/Tabs.d.ts +5 -0
- package/Tabs/styles.d.ts +14 -0
- package/Tabs/types.d.ts +13 -0
- package/TimeInput/TimeInput.d.ts +10 -0
- package/TimeInput/styles.d.ts +8 -0
- package/TimeInput/types.d.ts +6 -0
- package/ToggleButton/ToggleButton.d.ts +3 -0
- package/ToggleButton/styles.d.ts +6 -0
- package/ToggleButton/types.d.ts +5 -0
- package/Tooltip/Tooltip.d.ts +3 -0
- package/index.d.ts +39 -0
- package/index.js +2098 -0
- package/index.mjs +31143 -0
- package/package.json +49 -0
package/Badge/Badge.d.ts
ADDED
package/Badge/types.d.ts
ADDED
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const StyledBreadcrumbs: import("styled-components").StyledComponent<(<T extends object>(props: import("react-aria-components").BreadcrumbsProps<T> & import("react").RefAttributes<HTMLOListElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>), import("styled-components").DefaultTheme, {}, never>;
|
|
3
|
+
export declare const StyledBreadcrumbItem: import("styled-components").StyledComponent<(props: import("react-aria-components").BreadcrumbProps & import("react").RefAttributes<HTMLLIElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
4
|
+
export declare const StyledBreadcrumbSeparator: import("styled-components").StyledComponent<(props: import("react-aria-components").BreadcrumbProps & import("react").RefAttributes<HTMLLIElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
5
|
+
export declare const StyledBreadcrumbLink: import("styled-components").StyledComponent<(props: import("react-aria-components").LinkProps & import("react").RefAttributes<HTMLAnchorElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { BreadcrumbProps, type BreadcrumbsProps as AriaBreadcrumbsProps, LinkProps } from 'react-aria-components';
|
|
2
|
+
import React, { ReactNode } from 'react';
|
|
3
|
+
export interface Breadcrumb extends LinkProps {
|
|
4
|
+
name: string;
|
|
5
|
+
component?: ReactNode;
|
|
6
|
+
}
|
|
7
|
+
export interface BreadcrumbItemProps extends Omit<BreadcrumbProps, 'children'>, React.RefAttributes<HTMLLIElement> {
|
|
8
|
+
children?: ReactNode;
|
|
9
|
+
}
|
|
10
|
+
export type BreadcrumbsProps<T extends object> = Omit<AriaBreadcrumbsProps<T>, 'items'>;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const StyledButton: import("styled-components").StyledComponent<(props: import("react-aria-components").ButtonProps & import("react").RefAttributes<HTMLButtonElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, import("react-aria-components").ButtonProps & {
|
|
3
|
+
isLoading?: boolean | undefined;
|
|
4
|
+
variant?: "solid" | "outline" | "ghost" | undefined;
|
|
5
|
+
size?: "sm" | "lg" | "md" | undefined;
|
|
6
|
+
}, never>;
|
|
7
|
+
export default StyledButton;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const Control: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
3
|
+
export declare const StyledSvg: import("styled-components").StyledComponent<"svg", import("styled-components").DefaultTheme, {}, never>;
|
|
4
|
+
export declare const StyledCheckbox: import("styled-components").StyledComponent<(props: import("react-aria-components").CheckboxProps & import("react").RefAttributes<HTMLLabelElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
5
|
+
export default StyledCheckbox;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { CollapsibleTriggerProps, CollapsibleTriggerState } from './types';
|
|
3
|
+
export declare const CollapsibleTriggerStateContext: import("react").Context<CollapsibleTriggerState>;
|
|
4
|
+
export declare function CollapsibleTrigger({ children, ...props }: CollapsibleTriggerProps): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export default CollapsibleTrigger;
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
export declare const CollapsibleRoot: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
2
|
+
export declare const CollapsibleContentRoot: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { PropsWithChildren } from 'react';
|
|
2
|
+
export type CollapsibleTriggerState = {
|
|
3
|
+
isOpen: boolean;
|
|
4
|
+
id: string;
|
|
5
|
+
defaultOpen: boolean;
|
|
6
|
+
};
|
|
7
|
+
export type CollapsibleTriggerProps = PropsWithChildren<{
|
|
8
|
+
isOpen?: boolean;
|
|
9
|
+
defaultOpen?: boolean;
|
|
10
|
+
onOpenChange?: (isOpen: boolean) => void;
|
|
11
|
+
}>;
|
|
12
|
+
export type CollapsibleContentProps = PropsWithChildren<object>;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { PopoverProps as AriaPopoverProps } from 'react-aria-components';
|
|
2
|
+
import { Dispatch, Key, SetStateAction, ReactNode } from 'react';
|
|
3
|
+
export type ContextMenuAnimationState = 'unmounted' | 'hidden' | 'visible';
|
|
4
|
+
interface PopoverProps extends Omit<AriaPopoverProps, 'children'> {
|
|
5
|
+
animation: ContextMenuAnimationState;
|
|
6
|
+
children: ReactNode;
|
|
7
|
+
onAction?: (key: Key) => void;
|
|
8
|
+
setAnimation: Dispatch<SetStateAction<ContextMenuAnimationState>>;
|
|
9
|
+
key?: Key | null;
|
|
10
|
+
}
|
|
11
|
+
export declare function ContextMenu({ children, key, onAction, setAnimation, animation, ...props }: PopoverProps): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
export declare namespace ContextMenu {
|
|
13
|
+
var defaultProps: {
|
|
14
|
+
key: undefined;
|
|
15
|
+
onAction: undefined;
|
|
16
|
+
};
|
|
17
|
+
}
|
|
18
|
+
export default ContextMenu;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const StyledPopover: import("framer-motion").CustomDomComponent<{
|
|
3
|
+
[x: string]: any;
|
|
4
|
+
[x: number]: any;
|
|
5
|
+
[x: symbol]: any;
|
|
6
|
+
} & {
|
|
7
|
+
theme?: import("styled-components").DefaultTheme | undefined;
|
|
8
|
+
} & {
|
|
9
|
+
as?: string | import("react").ComponentType<any> | undefined;
|
|
10
|
+
forwardedAs?: string | import("react").ComponentType<any> | undefined;
|
|
11
|
+
}>;
|
|
12
|
+
export default StyledPopover;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { DateFieldProps, DateValue, ValidationResult } from 'react-aria-components';
|
|
2
|
+
interface DateInputProps extends DateFieldProps<DateValue> {
|
|
3
|
+
label?: string;
|
|
4
|
+
description?: string;
|
|
5
|
+
errorMessage?: string | ((validation: ValidationResult) => string);
|
|
6
|
+
}
|
|
7
|
+
export declare function DateInput({ label, description, errorMessage, ...props }: DateInputProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export declare namespace DateInput {
|
|
9
|
+
var defaultProps: {
|
|
10
|
+
label: undefined;
|
|
11
|
+
description: undefined;
|
|
12
|
+
errorMessage: undefined;
|
|
13
|
+
};
|
|
14
|
+
}
|
|
15
|
+
export default DateInput;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { DateInputRenderProps } from 'react-aria-components';
|
|
3
|
+
export declare const StyledDateField: import("styled-components").StyledComponent<(<T extends import("react-aria-components").DateValue>(props: import("react-aria-components").DateFieldProps<T> & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>), import("styled-components").DefaultTheme, {}, never>;
|
|
4
|
+
export declare const StyledDateInput: import("styled-components").StyledComponent<(props: import("react-aria-components").DateInputProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, Partial<DateInputRenderProps>, never>;
|
|
5
|
+
export declare const StyledDateSegment: import("styled-components").StyledComponent<(props: import("react-aria-components").DateSegmentProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
6
|
+
export declare const StyledLabel: import("styled-components").StyledComponent<(props: import("react-aria-components").LabelProps & import("react").RefAttributes<HTMLLabelElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
7
|
+
export declare const StyledFieldError: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react-aria-components").FieldErrorProps & import("react").RefAttributes<HTMLElement>>, import("styled-components").DefaultTheme, {}, never>;
|
|
8
|
+
export declare const StyledText: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react-aria-components").TextProps & import("react").RefAttributes<HTMLElement>>, import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const StyledDialog: import("styled-components").StyledComponent<(props: import("react-aria-components").DialogProps & import("react").RefAttributes<HTMLElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
3
|
+
export declare const StyledDialogAnimations: import("styled-components").GlobalStyleComponent<{
|
|
4
|
+
[x: string]: any;
|
|
5
|
+
[x: number]: any;
|
|
6
|
+
[x: symbol]: any;
|
|
7
|
+
} & {
|
|
8
|
+
theme?: import("styled-components").DefaultTheme | undefined;
|
|
9
|
+
} & {
|
|
10
|
+
as?: string | import("react").ComponentType<any> | undefined;
|
|
11
|
+
forwardedAs?: string | import("react").ComponentType<any> | undefined;
|
|
12
|
+
}, import("styled-components").DefaultTheme>;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { DialogProps } from 'react-aria-components';
|
|
2
|
+
type DrawerProps = DialogProps & {
|
|
3
|
+
direction?: 'top' | 'right' | 'bottom' | 'left';
|
|
4
|
+
};
|
|
5
|
+
export declare function Drawer({ direction, ...props }: DrawerProps): import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
export declare namespace Drawer {
|
|
7
|
+
var defaultProps: {
|
|
8
|
+
direction: string;
|
|
9
|
+
};
|
|
10
|
+
}
|
|
11
|
+
export default Drawer;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const StyledDrawer: import("styled-components").StyledComponent<(props: import("react-aria-components").DialogProps & import("react").RefAttributes<HTMLElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
3
|
+
export declare const StyledDrawerAnimations: import("styled-components").GlobalStyleComponent<{
|
|
4
|
+
[x: string]: any;
|
|
5
|
+
[x: number]: any;
|
|
6
|
+
[x: symbol]: any;
|
|
7
|
+
} & {
|
|
8
|
+
theme?: import("styled-components").DefaultTheme | undefined;
|
|
9
|
+
} & {
|
|
10
|
+
as?: string | import("react").ComponentType<any> | undefined;
|
|
11
|
+
forwardedAs?: string | import("react").ComponentType<any> | undefined;
|
|
12
|
+
}, import("styled-components").DefaultTheme>;
|
package/Input/Input.d.ts
ADDED
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { TextFieldProps, ValidationResult } from 'react-aria-components';
|
|
2
|
+
interface MyTextFieldProps extends TextFieldProps {
|
|
3
|
+
label?: string;
|
|
4
|
+
description?: string;
|
|
5
|
+
errorMessage?: string | ((validation: ValidationResult) => string);
|
|
6
|
+
}
|
|
7
|
+
export declare function Input({ label, description, errorMessage, ...props }: MyTextFieldProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export declare namespace Input {
|
|
9
|
+
var defaultProps: {
|
|
10
|
+
label: undefined;
|
|
11
|
+
description: undefined;
|
|
12
|
+
errorMessage: undefined;
|
|
13
|
+
};
|
|
14
|
+
}
|
|
15
|
+
export default Input;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const StyledInput: import("styled-components").StyledComponent<(props: import("react-aria-components").InputProps & import("react").RefAttributes<HTMLInputElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
3
|
+
export declare const StyledLabel: import("styled-components").StyledComponent<(props: import("react-aria-components").LabelProps & import("react").RefAttributes<HTMLLabelElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
4
|
+
export declare const StyledTextField: import("styled-components").StyledComponent<(props: import("react-aria-components").TextFieldProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
5
|
+
export declare const StyledFieldError: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react-aria-components").FieldErrorProps & import("react").RefAttributes<HTMLElement>>, import("styled-components").DefaultTheme, {}, never>;
|
|
6
|
+
export declare const StyledText: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react-aria-components").TextProps & import("react").RefAttributes<HTMLElement>>, import("styled-components").DefaultTheme, {}, never>;
|
package/Link/Link.d.ts
ADDED
package/Link/styles.d.ts
ADDED
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { LinkProps } from 'react-aria-components';
|
|
3
|
+
export declare const Root: import("styled-components").StyledComponent<(props: LinkProps & import("react").RefAttributes<HTMLAnchorElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, LinkProps, never>;
|
|
4
|
+
export default Root;
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
import { CircularEasingProps } from './types';
|
|
2
|
+
export declare const Rotate: import("styled-components").Keyframes;
|
|
3
|
+
export declare const Dash: import("styled-components").Keyframes;
|
|
4
|
+
export declare const Loader: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Omit<CircularEasingProps, "stroke">, never>;
|
|
5
|
+
export declare const StyledSvg: import("styled-components").StyledComponent<"svg", import("styled-components").DefaultTheme, {}, never>;
|
|
6
|
+
export declare const StyledCircle: import("styled-components").StyledComponent<"circle", import("styled-components").DefaultTheme, Omit<CircularEasingProps, "width">, never>;
|
|
7
|
+
/**
|
|
8
|
+
* .loader {
|
|
9
|
+
position: relative;
|
|
10
|
+
margin: 0 auto;
|
|
11
|
+
width: $width;
|
|
12
|
+
&:before {
|
|
13
|
+
content: '';
|
|
14
|
+
display: block;
|
|
15
|
+
padding-top: 100%;
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.circular {
|
|
20
|
+
animation: rotate 2s linear infinite;
|
|
21
|
+
height: 100%;
|
|
22
|
+
transform-origin: center center;
|
|
23
|
+
width: 100%;
|
|
24
|
+
position: absolute;
|
|
25
|
+
top: 0;
|
|
26
|
+
bottom: 0;
|
|
27
|
+
left: 0;
|
|
28
|
+
right: 0;
|
|
29
|
+
margin: auto;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
.path {
|
|
33
|
+
stroke-dasharray: 1, 200;
|
|
34
|
+
stroke-dashoffset: 0;
|
|
35
|
+
animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
|
|
36
|
+
stroke-linecap: round;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
@keyframes rotate {
|
|
40
|
+
100% {
|
|
41
|
+
transform: rotate(360deg);
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
@keyframes dash {
|
|
46
|
+
0% {
|
|
47
|
+
stroke-dasharray: 1, 200;
|
|
48
|
+
stroke-dashoffset: 0;
|
|
49
|
+
}
|
|
50
|
+
50% {
|
|
51
|
+
stroke-dasharray: 89, 200;
|
|
52
|
+
stroke-dashoffset: -35px;
|
|
53
|
+
}
|
|
54
|
+
100% {
|
|
55
|
+
stroke-dasharray: 89, 200;
|
|
56
|
+
stroke-dashoffset: -124px;
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
@keyframes color {
|
|
61
|
+
100%,
|
|
62
|
+
0% {
|
|
63
|
+
stroke: $red;
|
|
64
|
+
}
|
|
65
|
+
40% {
|
|
66
|
+
stroke: $blue;
|
|
67
|
+
}
|
|
68
|
+
66% {
|
|
69
|
+
stroke: $green;
|
|
70
|
+
}
|
|
71
|
+
80%,
|
|
72
|
+
90% {
|
|
73
|
+
stroke: $yellow;
|
|
74
|
+
}
|
|
75
|
+
}
|
|
76
|
+
*/
|
package/Meter/Meter.d.ts
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const StyledMeter: import("styled-components").StyledComponent<(props: import("react-aria-components").MeterProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
3
|
+
export declare const StyledMeterHeader: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
4
|
+
export declare const StyledLabel: import("styled-components").StyledComponent<(props: import("react-aria-components").LabelProps & import("react").RefAttributes<HTMLLabelElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
5
|
+
export declare const StyledValue: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
|
|
6
|
+
export declare const StyledBar: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
7
|
+
export declare const StyledBarFill: import("styled-components").StyledComponent<import("framer-motion").ForwardRefComponent<HTMLDivElement, import("framer-motion").HTMLMotionProps<"div">>, import("styled-components").DefaultTheme, {}, never>;
|
package/Meter/types.d.ts
ADDED
package/Modal/Modal.d.ts
ADDED
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const StyledModal: import("styled-components").StyledComponent<(props: import("react-aria-components").ModalOverlayProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
3
|
+
declare const _default: {
|
|
4
|
+
StyledModal: import("styled-components").StyledComponent<(props: import("react-aria-components").ModalOverlayProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
5
|
+
};
|
|
6
|
+
export default _default;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const StyledModalOverlay: import("styled-components").StyledComponent<(props: import("react-aria-components").ModalOverlayProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
3
|
+
declare const _default: {
|
|
4
|
+
StyledModalOverlay: import("styled-components").StyledComponent<(props: import("react-aria-components").ModalOverlayProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
5
|
+
};
|
|
6
|
+
export default _default;
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const CaretDown: import("styled-components").StyledComponent<"svg", import("styled-components").DefaultTheme, {}, never>;
|
|
3
|
+
export declare const StyledRoot: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-navigation-menu").NavigationMenuProps & import("react").RefAttributes<HTMLElement>>, import("styled-components").DefaultTheme, {}, never>;
|
|
4
|
+
export declare const StyledList: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-navigation-menu").NavigationMenuListProps & import("react").RefAttributes<HTMLUListElement>>, import("styled-components").DefaultTheme, {}, never>;
|
|
5
|
+
export declare const StyledTrigger: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-navigation-menu").NavigationMenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>, import("styled-components").DefaultTheme, {}, never>;
|
|
6
|
+
export declare const StyledLink: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-navigation-menu").NavigationMenuLinkProps & import("react").RefAttributes<HTMLAnchorElement>>, import("styled-components").DefaultTheme, {}, never>;
|
|
7
|
+
export declare const StyledContent: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-navigation-menu").NavigationMenuContentProps & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
|
|
8
|
+
export declare const StyledIndicator: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-navigation-menu").NavigationMenuIndicatorProps & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
|
|
9
|
+
/** @todo min-height/width instead? configurable? */
|
|
10
|
+
export declare const StyledViewport: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-navigation-menu").NavigationMenuViewportProps & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
|
|
11
|
+
export declare const StyledUl: import("styled-components").StyledComponent<"ul", import("styled-components").DefaultTheme, {}, never>;
|
|
12
|
+
export declare const ListItemLink: import("styled-components").StyledComponent<(props: import("react-aria-components").LinkProps & import("react").RefAttributes<HTMLAnchorElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
13
|
+
export declare const ListItemHeading: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
14
|
+
export declare const ListItemText: import("styled-components").StyledComponent<"p", import("styled-components").DefaultTheme, {}, never>;
|
|
15
|
+
export declare const Callout: import("styled-components").StyledComponent<(props: import("react-aria-components").LinkProps & import("react").RefAttributes<HTMLAnchorElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
16
|
+
export declare const CalloutHeading: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
17
|
+
export declare const CalloutText: import("styled-components").StyledComponent<"p", import("styled-components").DefaultTheme, {}, never>;
|
|
18
|
+
export declare const ViewportPosition: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
19
|
+
export declare const Arrow: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import type { NumberFieldProps, ValidationResult } from 'react-aria-components';
|
|
3
|
+
interface NumberInputProps extends NumberFieldProps {
|
|
4
|
+
label?: string;
|
|
5
|
+
description?: string;
|
|
6
|
+
errorMessage?: string | ((validation: ValidationResult) => string);
|
|
7
|
+
slots?: {
|
|
8
|
+
decrementIcon?: ReactNode;
|
|
9
|
+
incrementIcon?: ReactNode;
|
|
10
|
+
};
|
|
11
|
+
}
|
|
12
|
+
export declare function NumberInput({ label, description, errorMessage, isInvalid, isReadOnly, slots, ...props }: NumberInputProps): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
export declare namespace NumberInput {
|
|
14
|
+
var defaultProps: {
|
|
15
|
+
label: undefined;
|
|
16
|
+
description: undefined;
|
|
17
|
+
errorMessage: undefined;
|
|
18
|
+
slots: {
|
|
19
|
+
decrementIcon: import("react/jsx-runtime").JSX.Element;
|
|
20
|
+
incrementIcon: import("react/jsx-runtime").JSX.Element;
|
|
21
|
+
};
|
|
22
|
+
};
|
|
23
|
+
}
|
|
24
|
+
export default NumberInput;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const StyledNumberField: import("styled-components").StyledComponent<(props: import("react-aria-components").NumberFieldProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
3
|
+
export declare const StyledGroup: import("styled-components").StyledComponent<(props: import("react-aria-components").GroupProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { GroupProps, ValidationResult } from 'react-aria-components';
|
|
2
|
+
/** @todo extend certain textfield props like name, validationBehavior and isRequired */
|
|
3
|
+
interface PinInputProps extends GroupProps {
|
|
4
|
+
description?: string;
|
|
5
|
+
errorMessage?: string | ((validation: ValidationResult) => string);
|
|
6
|
+
label?: string;
|
|
7
|
+
length?: number;
|
|
8
|
+
name?: string;
|
|
9
|
+
onChange?: (...event: any[]) => void;
|
|
10
|
+
value?: string;
|
|
11
|
+
isMasked?: boolean;
|
|
12
|
+
isRequired?: boolean;
|
|
13
|
+
type?: 'alpha' | 'alphanumeric' | 'numeric';
|
|
14
|
+
validationBehavior?: 'native' | 'aria';
|
|
15
|
+
}
|
|
16
|
+
/** based on https://github.com/chakra-ui/chakra-ui/blob/main/packages/components/src/pin-input/use-pin-input.ts */
|
|
17
|
+
export declare function PinInput({ description, errorMessage, isDisabled, isInvalid, isMasked, isRequired, label, length, name, onChange: controlledOnChange, value, type, validationBehavior, ...props }: PinInputProps): import("react/jsx-runtime").JSX.Element;
|
|
18
|
+
export declare namespace PinInput {
|
|
19
|
+
var defaultProps: {
|
|
20
|
+
description: undefined;
|
|
21
|
+
errorMessage: undefined;
|
|
22
|
+
isMasked: boolean;
|
|
23
|
+
isRequired: boolean;
|
|
24
|
+
label: undefined;
|
|
25
|
+
length: number;
|
|
26
|
+
name: string;
|
|
27
|
+
onChange: () => void;
|
|
28
|
+
value: string;
|
|
29
|
+
type: string;
|
|
30
|
+
validationBehavior: string;
|
|
31
|
+
};
|
|
32
|
+
}
|
|
33
|
+
export default PinInput;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const StyledGroup: import("styled-components").StyledComponent<(props: import("react-aria-components").GroupProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
3
|
+
export declare const StyledInput: import("styled-components").StyledComponent<(props: import("react-aria-components").InputProps & import("react").RefAttributes<HTMLInputElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
4
|
+
export declare const StyledLabel: import("styled-components").StyledComponent<(props: import("react-aria-components").LabelProps & import("react").RefAttributes<HTMLLabelElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
5
|
+
export declare const StyledTextField: import("styled-components").StyledComponent<(props: import("react-aria-components").TextFieldProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
6
|
+
export declare const StyledHiddenTextField: import("styled-components").StyledComponent<(props: import("react-aria-components").TextFieldProps & import("react").RefAttributes<HTMLDivElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
7
|
+
export declare const StyledFieldError: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react-aria-components").FieldErrorProps & import("react").RefAttributes<HTMLElement>>, import("styled-components").DefaultTheme, {}, never>;
|
|
8
|
+
export declare const StyledText: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react-aria-components").TextProps & import("react").RefAttributes<HTMLElement>>, import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const Root: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react-aria-components").ProgressBarProps & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, {}, never>;
|
|
3
|
+
export declare const Block: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
4
|
+
export declare const Label: import("styled-components").StyledComponent<(props: import("react-aria-components").LabelProps & import("react").RefAttributes<HTMLLabelElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>, import("styled-components").DefaultTheme, {}, never>;
|
|
5
|
+
export declare const Bar: import("styled-components").StyledComponent<"circle", import("styled-components").DefaultTheme, {}, never>;
|
|
6
|
+
export declare const Fill: import("styled-components").StyledComponent<"circle", import("styled-components").DefaultTheme, {}, never>;
|
|
7
|
+
export declare const Value: import("styled-components").StyledComponent<"text", import("styled-components").DefaultTheme, {}, never>;
|