@fpkit/acss 0.4.18 → 0.5.0
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/package.json +2 -2
- package/src/components/badge/badge.stories.tsx +3 -3
- package/src/components/breadcrumbs/breadcrumb.stories.tsx +24 -8
- package/src/components/breadcrumbs/breadcrumb.tsx +47 -40
- package/src/components/buttons/button.stories.tsx +2 -2
- package/src/components/buttons/button.test.tsx +1 -1
- package/src/components/cards/card.stories.tsx +2 -2
- package/src/components/details/details.scss +10 -2
- package/src/components/details/details.stories.tsx +20 -4
- package/src/components/details/details.tsx +2 -1
- package/src/components/form/form.stories.tsx +2 -2
- package/src/components/form/input.stories.tsx +2 -2
- package/src/components/form/select.stories.tsx +2 -2
- package/src/components/form/select.tsx +23 -33
- package/src/components/fp.test.tsx +1 -1
- package/src/components/heading/heading.stories.tsx +2 -2
- package/src/components/images/figure.stories.tsx +3 -6
- package/src/components/images/img.stories.tsx +3 -3
- package/src/components/layout/footer.stories.tsx +2 -2
- package/src/components/layout/landmarks.stories.tsx +2 -2
- package/src/components/layout/main.stories.tsx +2 -2
- package/src/components/link/link.stories.tsx +2 -2
- package/src/components/list/list.stories.tsx +1 -2
- package/src/components/nav/nav.stories.tsx +4 -3
- package/src/components/popover/popover.stories.tsx +2 -2
- package/src/components/progress/progress.stories.tsx +2 -2
- package/src/components/tag/tag.stories.tsx +3 -3
- package/src/components/text/text.stories.tsx +6 -6
- package/src/patterns/page/page-header.stories.tsx +2 -2
- package/src/sass/_globals.scss +1 -0
- package/src/sass/_grid.scss +16 -16
- package/src/styles/cards/card.css +5 -0
- package/src/styles/cards/card.css.map +5 -1
- package/src/styles/details/details.css +9 -2
- package/src/styles/details/details.css.map +1 -1
- package/src/styles/form/form.css +3 -0
- package/src/styles/index.css +27 -19
- package/src/styles/index.css.map +1 -1
- package/LICENSE +0 -21
- package/libs/chunk-GCGKYLDG.js +0 -7
- package/libs/chunk-GCGKYLDG.js.map +0 -1
- package/libs/chunk-PDD4N5P5.cjs +0 -10
- package/libs/chunk-PDD4N5P5.cjs.map +0 -1
- package/libs/chunk-QHIABQNQ.js +0 -8
- package/libs/chunk-QHIABQNQ.js.map +0 -1
- package/libs/chunk-ZOHIKF6I.cjs +0 -31
- package/libs/chunk-ZOHIKF6I.cjs.map +0 -1
- package/libs/components/badge/badge.css +0 -1
- package/libs/components/badge/badge.css.map +0 -1
- package/libs/components/badge/badge.min.css +0 -3
- package/libs/components/breadcrumbs/breadcrumb.css +0 -1
- package/libs/components/breadcrumbs/breadcrumb.css.map +0 -1
- package/libs/components/breadcrumbs/breadcrumb.min.css +0 -3
- package/libs/components/buttons/button.css +0 -1
- package/libs/components/buttons/button.css.map +0 -1
- package/libs/components/buttons/button.min.css +0 -3
- package/libs/components/cards/card-style.css +0 -1
- package/libs/components/cards/card-style.css.map +0 -1
- package/libs/components/cards/card-style.min.css +0 -3
- package/libs/components/cards/card.css +0 -1
- package/libs/components/cards/card.css.map +0 -1
- package/libs/components/cards/card.min.css +0 -3
- package/libs/components/details/details.css +0 -1
- package/libs/components/details/details.css.map +0 -1
- package/libs/components/details/details.min.css +0 -3
- package/libs/components/form/form.css +0 -1
- package/libs/components/form/form.css.map +0 -1
- package/libs/components/form/form.min.css +0 -3
- package/libs/components/icons/icon.css +0 -1
- package/libs/components/icons/icon.css.map +0 -1
- package/libs/components/icons/icon.min.css +0 -3
- package/libs/components/images/img.css +0 -1
- package/libs/components/images/img.css.map +0 -1
- package/libs/components/images/img.min.css +0 -3
- package/libs/components/layout/landmarks.css +0 -1
- package/libs/components/layout/landmarks.css.map +0 -1
- package/libs/components/layout/landmarks.min.css +0 -3
- package/libs/components/link/link.css +0 -1
- package/libs/components/link/link.css.map +0 -1
- package/libs/components/link/link.min.css +0 -3
- package/libs/components/nav/nav.css +0 -1
- package/libs/components/nav/nav.css.map +0 -1
- package/libs/components/nav/nav.min.css +0 -3
- package/libs/components/progress/progress.css +0 -1
- package/libs/components/progress/progress.css.map +0 -1
- package/libs/components/progress/progress.min.css +0 -3
- package/libs/components/styles/index.css +0 -1
- package/libs/components/styles/index.css.map +0 -1
- package/libs/components/styles/index.min.css +0 -3
- package/libs/components/tag/tag.css +0 -1
- package/libs/components/tag/tag.css.map +0 -1
- package/libs/components/tag/tag.min.css +0 -3
- package/libs/components/text-to-speech/text-to-speech.css +0 -1
- package/libs/components/text-to-speech/text-to-speech.css.map +0 -1
- package/libs/components/text-to-speech/text-to-speech.min.css +0 -3
- package/libs/hooks.cjs +0 -12
- package/libs/hooks.cjs.map +0 -1
- package/libs/hooks.d.cts +0 -32
- package/libs/hooks.d.ts +0 -32
- package/libs/hooks.js +0 -3
- package/libs/hooks.js.map +0 -1
- package/libs/icons-1f5afc0c.d.ts +0 -318
- package/libs/icons.cjs +0 -12
- package/libs/icons.cjs.map +0 -1
- package/libs/icons.d.cts +0 -2
- package/libs/icons.d.ts +0 -2
- package/libs/icons.js +0 -3
- package/libs/icons.js.map +0 -1
- package/libs/index.cjs +0 -71
- package/libs/index.cjs.map +0 -1
- package/libs/index.css +0 -1
- package/libs/index.css.map +0 -1
- package/libs/index.d.cts +0 -558
- package/libs/index.d.ts +0 -558
- package/libs/index.js +0 -11
- package/libs/index.js.map +0 -1
package/libs/index.d.cts
DELETED
|
@@ -1,558 +0,0 @@
|
|
|
1
|
-
import { F as FP$1, C as ComponentProps$1 } from './icons-1f5afc0c.js';
|
|
2
|
-
export { I as Icon } from './icons-1f5afc0c.js';
|
|
3
|
-
import * as React from 'react';
|
|
4
|
-
import React__default, { ReactNode } from 'react';
|
|
5
|
-
|
|
6
|
-
type ButtonProps = React__default.ButtonHTMLAttributes<HTMLButtonElement> & Partial<React__default.ComponentProps<typeof FP$1>> & {
|
|
7
|
-
/**
|
|
8
|
-
* The button type
|
|
9
|
-
* Required - 'button' | 'submit' | 'reset'
|
|
10
|
-
*/
|
|
11
|
-
type: 'button' | 'submit' | 'reset';
|
|
12
|
-
};
|
|
13
|
-
declare const Button: {
|
|
14
|
-
({ type, children, styles, disabled, classes, onPointerDown, onPointerOver, onPointerLeave, ...props }: ButtonProps): React__default.JSX.Element;
|
|
15
|
-
displayName: string;
|
|
16
|
-
};
|
|
17
|
-
|
|
18
|
-
type CardProps = {
|
|
19
|
-
elm?: 'div' | 'aside' | 'section' | 'article';
|
|
20
|
-
title?: React__default.ReactNode;
|
|
21
|
-
footer?: React__default.ReactNode;
|
|
22
|
-
} & React__default.ComponentProps<typeof FP$1>;
|
|
23
|
-
declare const Card: {
|
|
24
|
-
({ elm, styles, children, classes, id, ...props }: CardProps): React__default.JSX.Element;
|
|
25
|
-
displayName: string;
|
|
26
|
-
Title: {
|
|
27
|
-
({ children, className, styles, as, ...props }: React__default.PropsWithChildren<{
|
|
28
|
-
className?: string | undefined;
|
|
29
|
-
styles?: React__default.CSSProperties | undefined;
|
|
30
|
-
as?: React__default.ElementType<any> | undefined;
|
|
31
|
-
}>): React__default.JSX.Element;
|
|
32
|
-
displayName: string;
|
|
33
|
-
};
|
|
34
|
-
Content: {
|
|
35
|
-
({ children, className, styles, ...props }: React__default.PropsWithChildren<{
|
|
36
|
-
className?: string | undefined;
|
|
37
|
-
styles?: React__default.CSSProperties | undefined;
|
|
38
|
-
}>): React__default.JSX.Element;
|
|
39
|
-
displayName: string;
|
|
40
|
-
};
|
|
41
|
-
Footer: {
|
|
42
|
-
({ children, className, styles, ...props }: React__default.PropsWithChildren<{
|
|
43
|
-
className?: string | undefined;
|
|
44
|
-
styles?: React__default.CSSProperties | undefined;
|
|
45
|
-
}>): React__default.JSX.Element;
|
|
46
|
-
displayName: string;
|
|
47
|
-
};
|
|
48
|
-
};
|
|
49
|
-
|
|
50
|
-
type DialogProps = {
|
|
51
|
-
/**
|
|
52
|
-
* React ref for dialog element
|
|
53
|
-
*/
|
|
54
|
-
modalRef: React__default.RefObject<HTMLDialogElement>;
|
|
55
|
-
/**
|
|
56
|
-
* Handle close modal event
|
|
57
|
-
*/
|
|
58
|
-
closeModal?: (e: React__default.SyntheticEvent<HTMLDialogElement>) => void;
|
|
59
|
-
/**
|
|
60
|
-
* open modal on mount
|
|
61
|
-
*/
|
|
62
|
-
openOnMount?: boolean;
|
|
63
|
-
} & React__default.ComponentProps<typeof FP$1>;
|
|
64
|
-
/**
|
|
65
|
-
* Dialog component
|
|
66
|
-
*/
|
|
67
|
-
declare const Dialog: {
|
|
68
|
-
({ id, children, classes, modalRef, openOnMount, ...props }: DialogProps): React__default.JSX.Element;
|
|
69
|
-
displayName: string;
|
|
70
|
-
};
|
|
71
|
-
|
|
72
|
-
type FieldProps = {
|
|
73
|
-
/**
|
|
74
|
-
* The label content
|
|
75
|
-
*/
|
|
76
|
-
label: React__default.ReactNode;
|
|
77
|
-
children: React__default.ReactNode;
|
|
78
|
-
} & React__default.ComponentProps<'label'> & Partial<React__default.ComponentProps<typeof FP$1>>;
|
|
79
|
-
/**
|
|
80
|
-
* Field component that renders a label and children wrapped in a div element.
|
|
81
|
-
* @param labelFor Defines the for attribute of the label element
|
|
82
|
-
* @param styles Custom styles to be applied to the component
|
|
83
|
-
* @param label The label content
|
|
84
|
-
* @param children The children to be rendered inside the component
|
|
85
|
-
* @param props Additional props to be spread to the component
|
|
86
|
-
*/
|
|
87
|
-
declare const Field: {
|
|
88
|
-
({ label, labelFor, id, styles, classes, children, ...props }: FieldProps): React__default.JSX.Element;
|
|
89
|
-
displayName: string;
|
|
90
|
-
};
|
|
91
|
-
|
|
92
|
-
type ComponentProps = React__default.ComponentProps<typeof FP$1>;
|
|
93
|
-
/**
|
|
94
|
-
* Renders children elements without any wrapping component.
|
|
95
|
-
* Can be used as a placeholder when no semantic landmark is needed.
|
|
96
|
-
*/
|
|
97
|
-
declare const Landmarks: {
|
|
98
|
-
(children?: React__default.FC): React__default.JSX.Element;
|
|
99
|
-
displayName: string;
|
|
100
|
-
Header: ({ id, children, headerBackground, styles, classes, ...props }: HeaderProps) => React__default.JSX.Element;
|
|
101
|
-
Main: ({ id, children, styles, classes, ...props }: ComponentProps) => React__default.JSX.Element;
|
|
102
|
-
Footer: ({ id, classes, children, styles, ...props }: ComponentProps) => React__default.JSX.Element;
|
|
103
|
-
Aside: ({ id, children, styles, classes, ...props }: ComponentProps) => React__default.JSX.Element;
|
|
104
|
-
Section: ({ id, children, styles, classes, ...props }: ComponentProps) => React__default.JSX.Element;
|
|
105
|
-
Article: ({ id, children, styles, classes, ...props }: ComponentProps) => React__default.JSX.Element;
|
|
106
|
-
};
|
|
107
|
-
type HeaderProps = {
|
|
108
|
-
headerBackground?: ReactNode;
|
|
109
|
-
} & ComponentProps;
|
|
110
|
-
/**
|
|
111
|
-
* Header component.
|
|
112
|
-
*
|
|
113
|
-
* Renders a header landmark with a section child.
|
|
114
|
-
*
|
|
115
|
-
* @param children - The content to render inside the header.
|
|
116
|
-
* @param styles - Optional styles object.
|
|
117
|
-
* @param props - Other props.
|
|
118
|
-
*/
|
|
119
|
-
declare const Header: ({ id, children, headerBackground, styles, classes, ...props }: HeaderProps) => React__default.JSX.Element;
|
|
120
|
-
/**
|
|
121
|
-
* Main component.
|
|
122
|
-
*
|
|
123
|
-
* Renders a main landmark.
|
|
124
|
-
*
|
|
125
|
-
* @param children - The content to render inside the main element.
|
|
126
|
-
* @param styles - Optional styles object.
|
|
127
|
-
* @param props - Other props.
|
|
128
|
-
*/
|
|
129
|
-
declare const Main: ({ id, children, styles, classes, ...props }: ComponentProps) => React__default.JSX.Element;
|
|
130
|
-
/**
|
|
131
|
-
* Footer component that renders a footer element with a section element inside.
|
|
132
|
-
* @param {ReactNode} children - Child elements to render inside the section element.
|
|
133
|
-
* @param styles - CSS styles to apply to the footer element.
|
|
134
|
-
* @param props - Additional props to pass to the footer element.
|
|
135
|
-
* @returns A React component that renders a footer element with a section element inside.
|
|
136
|
-
*/
|
|
137
|
-
declare const Footer: ({ id, classes, children, styles, ...props }: ComponentProps) => React__default.JSX.Element;
|
|
138
|
-
declare const Aside: ({ id, children, styles, classes, ...props }: ComponentProps) => React__default.JSX.Element;
|
|
139
|
-
/**
|
|
140
|
-
* Section component that renders a section element.
|
|
141
|
-
*
|
|
142
|
-
* @param children - Child elements to render inside the section.
|
|
143
|
-
* @param styles - CSS styles to apply to the section.
|
|
144
|
-
* @param props - Other props.
|
|
145
|
-
*/
|
|
146
|
-
declare const Section: ({ id, children, styles, classes, ...props }: ComponentProps) => React__default.JSX.Element;
|
|
147
|
-
/**
|
|
148
|
-
* Article component renders an HTML <article> element.
|
|
149
|
-
*
|
|
150
|
-
* @param children - Child elements to render inside the article.
|
|
151
|
-
* @param styles - CSS styles to apply to the article.
|
|
152
|
-
* @param props - Additional props to pass to the article element.
|
|
153
|
-
*/
|
|
154
|
-
declare const Article: ({ id, children, styles, classes, ...props }: ComponentProps) => React__default.JSX.Element;
|
|
155
|
-
|
|
156
|
-
type ImageProps = React__default.ComponentProps<'img'> & React__default.ComponentProps<typeof FP$1>;
|
|
157
|
-
declare const Img: {
|
|
158
|
-
({ src, alt, width, height, styles, loading, placeholder, fetchpriority, decoding, imgLoaded, imgError, ...props }: ImageProps): React__default.JSX.Element;
|
|
159
|
-
displayName: string;
|
|
160
|
-
};
|
|
161
|
-
|
|
162
|
-
type PolymorphicRef<C extends React__default.ElementType> = React__default.ComponentPropsWithRef<C>['ref'];
|
|
163
|
-
type AsProp<C extends React__default.ElementType> = {
|
|
164
|
-
as?: C;
|
|
165
|
-
};
|
|
166
|
-
type PropsToOmit<C extends React__default.ElementType, P> = keyof (AsProp<C> & P);
|
|
167
|
-
type PolymorphicComponentProp<C extends React__default.ElementType, Props = {}> = React__default.PropsWithChildren<Props & AsProp<C>> & Omit<React__default.ComponentPropsWithoutRef<C>, PropsToOmit<C, Props>>;
|
|
168
|
-
type PolymorphicComponentPropWithRef<C extends React__default.ElementType, Props = {}> = PolymorphicComponentProp<C, Props> & {
|
|
169
|
-
ref?: PolymorphicRef<C>;
|
|
170
|
-
};
|
|
171
|
-
type FPProps<C extends React__default.ElementType> = PolymorphicComponentPropWithRef<C, {
|
|
172
|
-
renderStyles?: boolean;
|
|
173
|
-
styles?: React__default.CSSProperties;
|
|
174
|
-
classes?: string;
|
|
175
|
-
}>;
|
|
176
|
-
type FPComponent = <C extends React__default.ElementType = 'span'>(props: FPProps<C>) => React__default.ReactElement | any;
|
|
177
|
-
/**
|
|
178
|
-
* FP component is a polymorphic component that renders an HTML element with optional styles.
|
|
179
|
-
* @param {Object} props - Component props
|
|
180
|
-
* @param {React.ElementType} props.as - The HTML element to render. Defaults to 'div'.
|
|
181
|
-
* @param {boolean} props.renderStyles - Whether to render styles or not. Defaults to true.
|
|
182
|
-
* @param {Object} props.styles - The styles to apply to the component.
|
|
183
|
-
* @param {Object} props.defaultStyles - The default styles to apply to the component.
|
|
184
|
-
* @param {React.ReactNode} props.children - The children to render inside the component.
|
|
185
|
-
* @returns {React.ReactElement} - A React component that renders an HTML element with optional styles.
|
|
186
|
-
*/
|
|
187
|
-
declare const FP: FPComponent;
|
|
188
|
-
|
|
189
|
-
type InputProps = {
|
|
190
|
-
/**
|
|
191
|
-
* The type of the input.
|
|
192
|
-
*/
|
|
193
|
-
type?: 'text' | 'password' | 'email' | 'number' | 'tel' | 'url' | 'search';
|
|
194
|
-
/**
|
|
195
|
-
* Set the element as disabled
|
|
196
|
-
*/
|
|
197
|
-
isDisabled?: boolean;
|
|
198
|
-
} & React__default.ComponentProps<typeof FP>;
|
|
199
|
-
/**
|
|
200
|
-
* Input component that renders an HTML input element.
|
|
201
|
-
* @param {InputProps} props - The input component props.
|
|
202
|
-
* @returns {JSX.Element} - The input component.
|
|
203
|
-
*/
|
|
204
|
-
declare const Input: {
|
|
205
|
-
({ type, name, value, placeholder, id, styles, classes, isDisabled, disabled, readonly, required, ref, onChange, onBlur, onPointerDown, ...props }: InputProps): JSX.Element;
|
|
206
|
-
displayName: string;
|
|
207
|
-
};
|
|
208
|
-
|
|
209
|
-
type LinkProps = {
|
|
210
|
-
/** Applies button styling to the link */
|
|
211
|
-
btnStyle?: boolean;
|
|
212
|
-
} & React__default.ComponentProps<typeof FP$1> & React__default.ComponentProps<'a'>;
|
|
213
|
-
declare const Link: {
|
|
214
|
-
({ href, target, rel, children, styles, prefetch, btnStyle, onPointerDown, ...props }: LinkProps): React__default.JSX.Element;
|
|
215
|
-
displayName: string;
|
|
216
|
-
};
|
|
217
|
-
|
|
218
|
-
type ListProps = {
|
|
219
|
-
/** Type of list to render (default: 'ul') */
|
|
220
|
-
type?: 'ul' | 'ol' | 'dl';
|
|
221
|
-
/** variant of list to render (default: 'none') */
|
|
222
|
-
variant?: string;
|
|
223
|
-
} & React.ComponentProps<typeof FP$1>;
|
|
224
|
-
type ListItemProps = {
|
|
225
|
-
/** Type of list item to render (default: 'li') */
|
|
226
|
-
type?: 'li' | 'dt' | 'dd';
|
|
227
|
-
} & React.ComponentProps<typeof FP$1>;
|
|
228
|
-
/**
|
|
229
|
-
* List component renders a list element with provided props
|
|
230
|
-
* @param children - Child elements to render inside the list
|
|
231
|
-
* @param classes - CSS classes to apply
|
|
232
|
-
* @param type - Type of list element (default: 'ul')
|
|
233
|
-
* @param variant - Variant for styling purposes
|
|
234
|
-
* @param styles - Inline styles object
|
|
235
|
-
* @param role - ARIA role
|
|
236
|
-
* @param props - Additional props to pass to underlying element
|
|
237
|
-
*/
|
|
238
|
-
declare const List: {
|
|
239
|
-
({ children, classes, type, variant, styles, role, ...props }: ListProps): React.JSX.Element;
|
|
240
|
-
displayName: string;
|
|
241
|
-
ListItem: ({ type, id, styles, children, classes, ...props }: ListItemProps) => React.JSX.Element;
|
|
242
|
-
};
|
|
243
|
-
|
|
244
|
-
interface ModalProps extends ComponentProps$1 {
|
|
245
|
-
/**
|
|
246
|
-
* The child component/content for open button
|
|
247
|
-
*/
|
|
248
|
-
openChild?: React__default.ReactNode;
|
|
249
|
-
/**
|
|
250
|
-
* The child component/content for close button
|
|
251
|
-
*/
|
|
252
|
-
closeChild?: React__default.ReactNode;
|
|
253
|
-
/**
|
|
254
|
-
* The child component/content for modal header
|
|
255
|
-
*/
|
|
256
|
-
modalHeader?: React__default.ReactNode;
|
|
257
|
-
/**
|
|
258
|
-
* The child component/content for modal footer
|
|
259
|
-
*/
|
|
260
|
-
modalFooter?: React__default.ReactNode;
|
|
261
|
-
/**
|
|
262
|
-
* The child component/content for modal body
|
|
263
|
-
*/
|
|
264
|
-
children: React__default.ReactNode;
|
|
265
|
-
/**
|
|
266
|
-
* Open modal on mount when set to true
|
|
267
|
-
*/
|
|
268
|
-
showOpen?: boolean;
|
|
269
|
-
}
|
|
270
|
-
declare const Modal: {
|
|
271
|
-
({ openChild, closeChild, modalHeader, modalFooter, children, showOpen, ...props }: ModalProps): React__default.JSX.Element;
|
|
272
|
-
displayName: string;
|
|
273
|
-
};
|
|
274
|
-
|
|
275
|
-
type NavListProps = React__default.ComponentProps<typeof List> & {
|
|
276
|
-
isBlock?: boolean;
|
|
277
|
-
};
|
|
278
|
-
type NavItemProps = React__default.ComponentProps<typeof List.ListItem>;
|
|
279
|
-
type NavProps = React__default.ComponentProps<typeof FP$1>;
|
|
280
|
-
/**
|
|
281
|
-
* Renders a NavList component.
|
|
282
|
-
* @param {Object} props - The props for the component.
|
|
283
|
-
* @param {ReactNode} props.children - The child elements.
|
|
284
|
-
* @param {Object} props - Additional props to spread to the List component.
|
|
285
|
-
* @returns {JSX.Element} The rendered NavList component.
|
|
286
|
-
*/
|
|
287
|
-
declare const NavList: ({ isBlock, children, ...props }: NavListProps) => React__default.JSX.Element;
|
|
288
|
-
/**
|
|
289
|
-
* Renders a NavItem component.
|
|
290
|
-
* @param {Object} props - The props for the component.
|
|
291
|
-
* @param {string} [props.id] - The id for the component.
|
|
292
|
-
* @param {Object} [props.styles] - The styles for the component.
|
|
293
|
-
* @param {string} [props.classes] - The classes for the component.
|
|
294
|
-
* @param {ReactNode} props.children - The child elements.
|
|
295
|
-
* @param {boolean} [props.inline=true] - Whether the item should display inline.
|
|
296
|
-
* @param {Object} props - Additional props to spread to the ListItem component.
|
|
297
|
-
* @returns {JSX.Element} The rendered NavItem component.
|
|
298
|
-
*/
|
|
299
|
-
declare const NavItem: ({ id, styles, classes, children, ...props }: NavItemProps) => React__default.JSX.Element;
|
|
300
|
-
/**
|
|
301
|
-
* Renders a Nav component.
|
|
302
|
-
* @param {Object} props - The props for the component.
|
|
303
|
-
* @param {ReactNode} props.children - The child elements.
|
|
304
|
-
* @param {Object} props - Additional props to spread to the UI component.
|
|
305
|
-
* @returns {JSX.Element} The rendered Nav component.
|
|
306
|
-
*/
|
|
307
|
-
declare const Nav: {
|
|
308
|
-
({ children, ...props }: NavProps): React__default.JSX.Element;
|
|
309
|
-
displayName: string;
|
|
310
|
-
List: ({ isBlock, children, ...props }: NavListProps) => React__default.JSX.Element;
|
|
311
|
-
Item: ({ id, styles, classes, children, ...props }: NavItemProps) => React__default.JSX.Element;
|
|
312
|
-
};
|
|
313
|
-
|
|
314
|
-
/**
|
|
315
|
-
* Interface for props accepted by the Popover component
|
|
316
|
-
*
|
|
317
|
-
* @property {ReactNode} children - The content to show in the popover
|
|
318
|
-
* @property {ReactNode} [content] - Optional alternative content for popover
|
|
319
|
-
*/
|
|
320
|
-
type PopoverProps = {
|
|
321
|
-
children: React__default.ReactNode;
|
|
322
|
-
popoverTrigger: React__default.ReactNode;
|
|
323
|
-
styles?: {};
|
|
324
|
-
};
|
|
325
|
-
/**
|
|
326
|
-
* Popover component to display popover content.
|
|
327
|
-
*
|
|
328
|
-
* @param props - The props for the component
|
|
329
|
-
* @param props.children - The content to show in the popover
|
|
330
|
-
* @param props.popoverTrigger - The element that triggers the popover on hover
|
|
331
|
-
*
|
|
332
|
-
* @returns JSX.Element - The rendered JSX element for the Popover
|
|
333
|
-
* @example - <Popover popoverTrigger={<button>Hover here</button>}>Popover content</Popover>
|
|
334
|
-
*
|
|
335
|
-
* The component uses the usePopover hook to handle popover visibility and positioning.
|
|
336
|
-
*
|
|
337
|
-
* It renders the triggerElement, and conditionally renders the popover content
|
|
338
|
-
* positioned absolutely when visible.
|
|
339
|
-
*
|
|
340
|
-
* Inline styles handle visuals like background, border, padding, etc.
|
|
341
|
-
*
|
|
342
|
-
* Transforms and opacity animate the enter/exit transition of the popover.
|
|
343
|
-
*/
|
|
344
|
-
declare const Popover: {
|
|
345
|
-
({ children, popoverTrigger, styles, ...props }: PopoverProps): JSX.Element;
|
|
346
|
-
displayName: string;
|
|
347
|
-
styles: React__default.CSSProperties;
|
|
348
|
-
};
|
|
349
|
-
|
|
350
|
-
interface TableProps extends ComponentProps$1 {
|
|
351
|
-
tblHead: React__default.ReactNode;
|
|
352
|
-
tblBody: React__default.ReactNode;
|
|
353
|
-
tblCaption?: React__default.ReactNode;
|
|
354
|
-
}
|
|
355
|
-
/**
|
|
356
|
-
* Render the table placing `caption`, `thead` and `tbody` in the correct order
|
|
357
|
-
* caption is optional
|
|
358
|
-
*/
|
|
359
|
-
declare const RenderTable: {
|
|
360
|
-
({ tblBody, tblCaption, tblHead }: TableProps): React__default.JSX.Element;
|
|
361
|
-
displayName: string;
|
|
362
|
-
};
|
|
363
|
-
|
|
364
|
-
type TagProps = {
|
|
365
|
-
/** HTML element to display the badge as span or p */
|
|
366
|
-
elm?: 'span' | 'p';
|
|
367
|
-
/** Aria role for the component - conditional */
|
|
368
|
-
role: 'note' | 'status';
|
|
369
|
-
} & React__default.ComponentProps<typeof FP$1>;
|
|
370
|
-
declare const Tag: {
|
|
371
|
-
({ elm, role, children, styles, ...props }: TagProps): React__default.JSX.Element;
|
|
372
|
-
displayName: string;
|
|
373
|
-
};
|
|
374
|
-
|
|
375
|
-
declare const Caption: {
|
|
376
|
-
({ children, ...props }: ComponentProps$1): React__default.JSX.Element;
|
|
377
|
-
displayName: string;
|
|
378
|
-
};
|
|
379
|
-
declare const Thead: {
|
|
380
|
-
({ children, ...props }: ComponentProps$1): React__default.JSX.Element;
|
|
381
|
-
displayName: string;
|
|
382
|
-
};
|
|
383
|
-
declare const Tbody: {
|
|
384
|
-
({ children, ...props }: ComponentProps$1): React__default.JSX.Element;
|
|
385
|
-
displayName: string;
|
|
386
|
-
};
|
|
387
|
-
declare const Tr: {
|
|
388
|
-
({ children, ...props }: ComponentProps$1): React__default.JSX.Element;
|
|
389
|
-
displayName: string;
|
|
390
|
-
};
|
|
391
|
-
declare const Td: {
|
|
392
|
-
({ children, ...props }: ComponentProps$1): React__default.JSX.Element;
|
|
393
|
-
displayName: string;
|
|
394
|
-
};
|
|
395
|
-
declare const Table: {
|
|
396
|
-
({ id, dataStyle, children, ...props }: ComponentProps$1): React__default.JSX.Element;
|
|
397
|
-
displayName: string;
|
|
398
|
-
};
|
|
399
|
-
|
|
400
|
-
type DetailsProps = {
|
|
401
|
-
/**
|
|
402
|
-
* The summary text shown for the details.
|
|
403
|
-
* Required.
|
|
404
|
-
*/
|
|
405
|
-
summary: React__default.ReactNode;
|
|
406
|
-
/**
|
|
407
|
-
* The aria-label element for accessibility.
|
|
408
|
-
*/
|
|
409
|
-
ariaLabel: string;
|
|
410
|
-
} & React__default.ComponentProps<'details'> & Partial<React__default.ComponentProps<typeof FP$1>>;
|
|
411
|
-
/**3
|
|
412
|
-
* Details component props interface.
|
|
413
|
-
*
|
|
414
|
-
* @param {React.CSSProperties} [styles] - CSS styles object.
|
|
415
|
-
* @param {string} [classes] - Classnames string.
|
|
416
|
-
* @param {boolean} [open] - Whether the details is open.
|
|
417
|
-
* @param {(e: React.PointerEvent<HTMLDetailsElement>) => void} [onToggle] - onToggle callback.
|
|
418
|
-
* @param {(e: React.PointerEvent<HTMLDetailsElement>) => void} [onPointerDown] - onPointerDown callback.
|
|
419
|
-
* @param {ReactNode} children - The content inside the details.
|
|
420
|
-
* @param {string} [ariaLabel] - aria-label for accessibility.
|
|
421
|
-
* @param {React.Ref<any>} [ref] - Ref object.
|
|
422
|
-
* @param {Object} props - Other props.
|
|
423
|
-
*/
|
|
424
|
-
declare const Details: {
|
|
425
|
-
({ summary, icon, styles, classes, ariaLabel, name, open, onPointerDown, onToggle, children, ref, ...props }: DetailsProps): React__default.JSX.Element;
|
|
426
|
-
displayName: string;
|
|
427
|
-
};
|
|
428
|
-
|
|
429
|
-
type InheritedProps = React__default.ComponentProps<typeof FP$1>;
|
|
430
|
-
type TextElements = 'a' | 'b' | 'blockquote' | 'b' | 'blockquote' | 'cite' | 'code' | 'em' | 'i' | 'em' | 'i' | 'kbd' | 'mark' | 'p' | 's' | 'small' | 'span' | 'span' | 'strong' | 'mark' | 'p' | 's' | 'small' | 'span' | 'span' | 'strong' | 'sub' | 'sup' | 'time' | 'time' | 'u';
|
|
431
|
-
type TextProps = {
|
|
432
|
-
/**
|
|
433
|
-
* Text element to to use
|
|
434
|
-
* Text element to to use
|
|
435
|
-
*/
|
|
436
|
-
elm?: TextElements;
|
|
437
|
-
/** Pass a text element or string */
|
|
438
|
-
text?: string;
|
|
439
|
-
} & InheritedProps;
|
|
440
|
-
declare const Text: {
|
|
441
|
-
({ elm, id, text, styles, classes, children, ...props }: TextProps): React__default.JSX.Element;
|
|
442
|
-
displayName: string;
|
|
443
|
-
};
|
|
444
|
-
type TitleProps$1 = {
|
|
445
|
-
/**
|
|
446
|
-
* HTML headings
|
|
447
|
-
*/
|
|
448
|
-
elm?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
|
|
449
|
-
} & InheritedProps;
|
|
450
|
-
declare const Title: {
|
|
451
|
-
({ elm, id, children, styles, classes, ...props }: TitleProps$1): React__default.JSX.Element;
|
|
452
|
-
displayName: string;
|
|
453
|
-
};
|
|
454
|
-
|
|
455
|
-
type TextareaProps = React__default.ComponentProps<'textarea'> & React__default.ComponentProps<typeof FP$1>;
|
|
456
|
-
/**
|
|
457
|
-
* Textarea component.
|
|
458
|
-
*
|
|
459
|
-
* @param value - The value of the textarea.
|
|
460
|
-
* @param rows - The number of rows.
|
|
461
|
-
* @param cols - The number of columns.
|
|
462
|
-
* @param id - The id of the textarea.
|
|
463
|
-
* @param name - The name of the textarea.
|
|
464
|
-
* @param required - Whether the textarea is required.
|
|
465
|
-
* @param disabled - Whether the textarea is disabled.
|
|
466
|
-
* @param readOnly - Whether the textarea is read only.
|
|
467
|
-
* @param onBlur - Blur event handler.
|
|
468
|
-
* @param onPointerDown - Pointer down event handler.
|
|
469
|
-
* @param onChange - Change event handler.
|
|
470
|
-
* @param ref - Ref for the textarea.
|
|
471
|
-
* @param styles - Styles object for the textarea.
|
|
472
|
-
* @param textareaRef - Ref specifically for the textarea element.
|
|
473
|
-
* @param props - Other props.
|
|
474
|
-
*/
|
|
475
|
-
declare const Textarea: {
|
|
476
|
-
({ id, classes, value, rows, cols, name, required, disabled, readOnly, onBlur, onPointerDown, onChange, ref, styles, placeholder, ...props }: TextareaProps): React__default.JSX.Element;
|
|
477
|
-
displayName: string;
|
|
478
|
-
};
|
|
479
|
-
|
|
480
|
-
type TitleProps = {
|
|
481
|
-
children: React__default.ReactNode;
|
|
482
|
-
type: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
|
|
483
|
-
ui?: string;
|
|
484
|
-
} & React__default.ComponentProps<typeof FP$1>;
|
|
485
|
-
|
|
486
|
-
type customRoute = {
|
|
487
|
-
/** The path or id for routing */
|
|
488
|
-
path?: string;
|
|
489
|
-
/** The display name */
|
|
490
|
-
name: string;
|
|
491
|
-
/** The url if linking out */
|
|
492
|
-
url?: string;
|
|
493
|
-
};
|
|
494
|
-
type BreadcrumbProps = {
|
|
495
|
-
/** Array of custom route objects */
|
|
496
|
-
routes?: customRoute[];
|
|
497
|
-
/** Starting route node */
|
|
498
|
-
startRoute?: React__default.ReactNode;
|
|
499
|
-
/** Spacer node between routes */
|
|
500
|
-
spacer?: React__default.ReactNode;
|
|
501
|
-
/** String representing current route */
|
|
502
|
-
currentRoute?: string;
|
|
503
|
-
/** Prefix breadcrumb aria-label - "prefix breadcrumb" */
|
|
504
|
-
ariaLabelPrefix?: string;
|
|
505
|
-
/** Truncate breadcrumb text after this length */
|
|
506
|
-
truncateLength?: number;
|
|
507
|
-
} & React__default.ComponentProps<typeof FP$1>;
|
|
508
|
-
/**
|
|
509
|
-
* Navigation component for breadcrumbs.
|
|
510
|
-
*
|
|
511
|
-
* @param props - Props for the navigation component.
|
|
512
|
-
* @param props.startRoute - Starting route node. Default 'Home'.
|
|
513
|
-
* @param props.currentRoute - String representing current route.
|
|
514
|
-
* @param props.spacer - Spacer node between routes. Default '/'.
|
|
515
|
-
* @param props.routes - Array of custom route objects.
|
|
516
|
-
* @param props.styles - Styles object for the nav.
|
|
517
|
-
* @param props.id - Id for the nav.
|
|
518
|
-
* @param props.classes - Class names for the nav.
|
|
519
|
-
* @param props.children - Child components.
|
|
520
|
-
*/
|
|
521
|
-
declare const Breadcrumb: {
|
|
522
|
-
({ startRoute, currentRoute, spacer, routes, styles, id, classes, ariaLabelPrefix, truncateLength, ...props }: BreadcrumbProps): React__default.JSX.Element;
|
|
523
|
-
displayName: string;
|
|
524
|
-
Nav: ({ styles, id, classes, children, ...props }: React__default.ComponentProps<typeof FP$1>) => React__default.JSX.Element;
|
|
525
|
-
List: ({ children, ...props }: React__default.ComponentProps<typeof FP$1>) => React__default.JSX.Element;
|
|
526
|
-
Items: ({ styles, id, classes, children, ...props }: React__default.ComponentProps<typeof FP$1>) => React__default.JSX.Element;
|
|
527
|
-
};
|
|
528
|
-
|
|
529
|
-
/**
|
|
530
|
-
* Props for the TextToSpeechComponent.
|
|
531
|
-
* @interface TextToSpeechComponentProps
|
|
532
|
-
*/
|
|
533
|
-
interface TextToSpeechComponentProps {
|
|
534
|
-
/** Initial text to be spoken. Defaults to an empty string. */
|
|
535
|
-
initialText?: string;
|
|
536
|
-
/** Whether to show the text input field. Defaults to true. */
|
|
537
|
-
showTextInput?: boolean;
|
|
538
|
-
/** The voice to be used for speech synthesis. */
|
|
539
|
-
voice?: SpeechSynthesisVoice | undefined;
|
|
540
|
-
/** The pitch of the voice. Defaults to 1. */
|
|
541
|
-
pitch?: number;
|
|
542
|
-
/** The rate of speech. Defaults to 1. */
|
|
543
|
-
rate?: number;
|
|
544
|
-
/** The language to be used for speech synthesis. */
|
|
545
|
-
language?: string;
|
|
546
|
-
/** Player label */
|
|
547
|
-
label?: string | React__default.ReactNode;
|
|
548
|
-
/** Callback function to be called when speech ends. */
|
|
549
|
-
onEnd?: () => void;
|
|
550
|
-
}
|
|
551
|
-
/**
|
|
552
|
-
* A component that converts text to speech using the Web Speech API.
|
|
553
|
-
* @param {TextToSpeechComponentProps} props - The props for the component.
|
|
554
|
-
* @returns {JSX.Element} The rendered TextToSpeechComponent.
|
|
555
|
-
*/
|
|
556
|
-
declare const TextToSpeech: React__default.FC<TextToSpeechComponentProps>;
|
|
557
|
-
|
|
558
|
-
export { Article, Aside, FP as Box, Breadcrumb, Button, Caption, Card, Details, Dialog, FP, Field, Footer, Header, Img, Input, Landmarks, Link, List, Main, Modal, Nav, NavItem, NavItemProps, NavList, NavListProps, NavProps, Popover, Section, RenderTable as TBL, Table, Tag, TagProps, Tbody, Td, Text, TextProps, TextToSpeech, Textarea, TextareaProps, Thead, Title, TitleProps, Link as To, Tr };
|