@shape-digital-env/shape-ui 0.0.1 → 0.0.2
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/README.md +24 -85
- package/components/Accordion/Accordion.d.ts +1 -1
- package/components/Accordion/Accordion.d.ts.map +1 -1
- package/components/Checkbox/Checkbox.d.ts +4 -1
- package/components/Checkbox/Checkbox.d.ts.map +1 -1
- package/components/Checkbox/Checkbox.stories.d.ts +2 -0
- package/components/Checkbox/Checkbox.stories.d.ts.map +1 -1
- package/components/LegendIcon/LegendIcon.d.ts +1 -1
- package/components/LegendIcon/LegendIcon.d.ts.map +1 -1
- package/components/LoginScreen/LoginScreen.d.ts +4 -5
- package/components/LoginScreen/LoginScreen.d.ts.map +1 -1
- package/components/MetricCard/MetricCard.d.ts +3 -1
- package/components/MetricCard/MetricCard.d.ts.map +1 -1
- package/components/Modal/Modal.d.ts +2 -4
- package/components/Modal/Modal.d.ts.map +1 -1
- package/components/RadioGroup/RadioGroup.stories.d.ts +1 -0
- package/components/RadioGroup/RadioGroup.stories.d.ts.map +1 -1
- package/components/Table/DataTable/DataTable.d.ts +1 -1
- package/components/Table/DataTable/DataTable.d.ts.map +1 -1
- package/components/Table/DataTable/DataTable.types.d.ts +6 -0
- package/components/Table/DataTable/DataTable.types.d.ts.map +1 -1
- package/index.js +8180 -8104
- package/package.json +1 -1
- package/styles.css +4 -1622
package/README.md
CHANGED
|
@@ -1,53 +1,38 @@
|
|
|
1
|
-
# @shape/shape-ui
|
|
1
|
+
# @shape-digital-env/shape-ui
|
|
2
2
|
|
|
3
|
-
Shape UI is
|
|
3
|
+
Shape UI is Shape Digital's design system — a React component library styled with [Tailwind CSS v4](https://tailwindcss.com/), built on top of [Radix UI](https://www.radix-ui.com/) primitives.
|
|
4
4
|
|
|
5
|
-
## What it
|
|
5
|
+
## What it provides
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
- **
|
|
10
|
-
- **React components** — accessible, unstyled-at-the-primitive-level components built on top of [Radix UI](https://www.radix-ui.com/), styled with [Tailwind CSS v4](https://tailwindcss.com/) using Shape tokens
|
|
11
|
-
- **Icons** — the Material Symbols Rounded catalogue as tree-shakeable SVG modules
|
|
12
|
-
- **Storybook** — interactive component documentation and visual testing
|
|
13
|
-
|
|
14
|
-
## What problem it solves
|
|
15
|
-
|
|
16
|
-
Before Shape UI, UI decisions were made app-by-app. Components were duplicated across Aura, Lighthouse, and Reef with inconsistent styles, tokens, and behavior. Design changes required manual updates in multiple places.
|
|
17
|
-
|
|
18
|
-
Shape UI creates a single source of truth between design and code:
|
|
19
|
-
|
|
20
|
-
- A change to a color token in `color.css` propagates to every app that imports `@shape/shape-ui/styles.css`
|
|
21
|
-
- A component built once in Shape UI is available to all Shape apps without duplication
|
|
22
|
-
- Designers and developers share the same language — the same token names appear in Figma variables and in code
|
|
23
|
-
|
|
24
|
-
## Goals
|
|
25
|
-
|
|
26
|
-
- **Consistency** — every Shape product looks and behaves like it belongs to the same family
|
|
27
|
-
- **Figma-first** — tokens and components are derived directly from the Figma design system, not the other way around
|
|
28
|
-
- **Accessible by default** — Radix UI primitives handle keyboard navigation, focus management, and ARIA attributes so product teams don't have to
|
|
29
|
-
- **Zero runtime overhead** — Tailwind v4 generates only the CSS that's used; no CSS-in-JS, no runtime style injection
|
|
30
|
-
- **Developer experience** — a dev adds a component in 3 lines of code; a designer opens Dev Mode and sees that exact code
|
|
7
|
+
- **Design tokens** — colors, typography, and spacing as CSS custom properties, sourced from the Shape Figma design system
|
|
8
|
+
- **React components** — accessible, unstyled-at-the-primitive-level components built on Radix UI
|
|
9
|
+
- **Self-hosted fonts** — Nunito and Roboto ship with the package; no external font requests
|
|
31
10
|
|
|
32
11
|
## Usage
|
|
33
12
|
|
|
34
13
|
Import the compiled stylesheet once in your app's entry point (e.g. `main.tsx`):
|
|
35
14
|
```ts
|
|
36
|
-
import '@shape/shape-ui/styles.css';
|
|
15
|
+
import '@shape-digital-env/shape-ui/styles.css';
|
|
37
16
|
```
|
|
38
17
|
|
|
39
18
|
This loads all design tokens (colors, spacing, typography) and base styles globally. Do not import it inside individual components.
|
|
40
19
|
|
|
41
20
|
Then use components:
|
|
42
21
|
```tsx
|
|
43
|
-
import {
|
|
44
|
-
|
|
45
|
-
<
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
22
|
+
import { Button } from '@shape-digital-env/shape-ui';
|
|
23
|
+
|
|
24
|
+
<Button variant="primary">Click me</Button>
|
|
25
|
+
```
|
|
26
|
+
|
|
27
|
+
## Dark background assumption
|
|
28
|
+
|
|
29
|
+
Components are designed against a dark page background — `--color-black` is meant to be the app's own background color, and surfaces like `Card` (`--color-gray-100`) are styled for contrast against it. Set the background yourself (e.g. on `<body>`) if your app doesn't already render on dark:
|
|
30
|
+
|
|
31
|
+
```css
|
|
32
|
+
body {
|
|
33
|
+
background: var(--color-black);
|
|
34
|
+
color: #fff;
|
|
35
|
+
}
|
|
51
36
|
```
|
|
52
37
|
|
|
53
38
|
## Form fields
|
|
@@ -55,7 +40,7 @@ import { Tabs, TabsList, TabsTrigger } from '@shape/shape-ui';
|
|
|
55
40
|
A control on its own — `Input`, `Select`, `Checkbox`… — renders the control and nothing more. The required marker, the validation message and the label/description wiring live in `Field`, which wraps any of them:
|
|
56
41
|
|
|
57
42
|
```tsx
|
|
58
|
-
import { Field, FieldLabel, FieldError, Input } from '@shape/shape-ui';
|
|
43
|
+
import { Field, FieldLabel, FieldError, Input } from '@shape-digital-env/shape-ui';
|
|
59
44
|
|
|
60
45
|
<Field required>
|
|
61
46
|
<FieldLabel>Case title</FieldLabel>
|
|
@@ -64,54 +49,8 @@ import { Field, FieldLabel, FieldError, Input } from '@shape/shape-ui';
|
|
|
64
49
|
</Field>
|
|
65
50
|
```
|
|
66
51
|
|
|
67
|
-
`required` puts the `*` on the label and `required`/`aria-required` on the control.
|
|
68
|
-
|
|
69
|
-
Existing screens are unaffected: outside a `Field` every control behaves exactly as before, and the `error` prop that `Input`, `Textarea` and `Select` already had still wins when both are present. See the **Components/Field** page in Storybook for the full API.
|
|
70
|
-
|
|
71
|
-
## Architecture
|
|
72
|
-
|
|
73
|
-
shape-ui follows the same pattern as [shadcn/ui](https://ui.shadcn.com/) — but instead of copying components into your project, they live in this shared lib. The dependency chain is:
|
|
74
|
-
```
|
|
75
|
-
Radix UI primitives → shape-ui components → Shape apps
|
|
76
|
-
(behavior, a11y) (tokens, style) (Aura, Reef…)
|
|
77
|
-
```
|
|
78
|
-
|
|
79
|
-
Components are not black boxes. They accept `className` overrides and forward refs, so apps can extend them when needed without forking.
|
|
80
|
-
|
|
81
|
-
## Running Storybook
|
|
82
|
-
```bash
|
|
83
|
-
# from libs/shape-ui
|
|
84
|
-
yarn run storybook
|
|
85
|
-
```
|
|
86
|
-
|
|
87
|
-
## Contributing
|
|
88
|
-
|
|
89
|
-
The contribution rules live in Storybook, under **Guides**, next to the components they describe (source in [`src/docs/`](src/docs/)):
|
|
90
|
-
|
|
91
|
-
- **Presentational components** — what a component in this lib may and may not do, and how the lint enforces it.
|
|
92
|
-
- **Configuration objects** — naming, item shape, state and callbacks for data-driven props (`tabs`, `columns`, `options`…).
|
|
93
|
-
- **New component or change an existing one** — the decision, and the steps to add a component.
|
|
94
|
-
- **Writing stories** — the stories every component needs, interaction tests, example data and a template.
|
|
52
|
+
`required` puts the `*` on the label and `required`/`aria-required` on the control. Controls that Radix renders as buttons (`Select`, `MultiSelect`, `Checkbox`, `Switch`, `RadioGroup`) are never validated by the browser — pass `invalid` to the `Field` for those.
|
|
95
53
|
|
|
96
54
|
## Icons
|
|
97
55
|
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
```tsx
|
|
101
|
-
import { Icon } from '@shape/shape-ui';
|
|
102
|
-
import settingsIcon from '@shape/shape-ui/icons/settings';
|
|
103
|
-
|
|
104
|
-
<Icon icon={settingsIcon} size="lg" filled />
|
|
105
|
-
```
|
|
106
|
-
|
|
107
|
-
Only the icons you import end up in your bundle — there is no font to download, so nothing flashes as text while the page loads and nothing can be blocked by an ad-blocker. There is deliberately no barrel (`@shape/shape-ui/icons`): always import the single icon.
|
|
108
|
-
|
|
109
|
-
Component props that take an icon (`SelectTrigger`'s `leadingIcon`/`trailingIcon`, `LegendIcon`'s `icon`) take the same imported value.
|
|
110
|
-
|
|
111
|
-
When the icon name only exists at runtime (e.g. it comes from a database), keep an explicit map in the app — `{ settings: settingsIcon, … }` — instead of importing icons by computed path, which would pull the whole catalogue.
|
|
112
|
-
|
|
113
|
-
The modules are generated from [`@material-symbols/svg-500`](https://www.npmjs.com/package/@material-symbols/svg-500) by `scripts/generate-icons.mjs` and committed. To pick up new icons, bump the version pinned in the script and run `node scripts/generate-icons.mjs` from `libs/shape-ui`.
|
|
114
|
-
|
|
115
|
-
## Fonts
|
|
116
|
-
|
|
117
|
-
Nunito (`--font-head`) and Roboto (`--font-body`) are self-hosted: `src/fonts/` holds the variable woff2 files (latin and latin-ext, weights 300–700) and their OFL licenses, and `styles.css` ships the `@font-face` rules. Importing `@shape/shape-ui/styles.css` is enough — no Google Fonts link is needed in the consuming app.
|
|
56
|
+
Not available in this package yet. `Icon` is exported, but its required `icon` prop is only sourced from per-icon modules (`@shape-digital-env/shape-ui/icons/<name>`) that aren't published in this version — support is planned for an upcoming release.
|
|
@@ -17,5 +17,5 @@ export type AccordionProps = {
|
|
|
17
17
|
onOpenChange?: (open: boolean) => void;
|
|
18
18
|
headerExtra?: React.ReactNode;
|
|
19
19
|
};
|
|
20
|
-
export declare const Accordion:
|
|
20
|
+
export declare const Accordion: React.ForwardRefExoticComponent<AccordionProps & React.RefAttributes<HTMLDivElement>>;
|
|
21
21
|
//# sourceMappingURL=Accordion.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,MAAM,aAAa,GAAG;IAC1B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,aAAa,EAAE,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC/B,CAAC;AAEF,eAAO,MAAM,SAAS,
|
|
1
|
+
{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,MAAM,aAAa,GAAG;IAC1B,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,aAAa,EAAE,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC/B,CAAC;AAEF,eAAO,MAAM,SAAS,uFA4GrB,CAAC"}
|
|
@@ -1,5 +1,8 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
|
|
3
|
-
|
|
3
|
+
export interface CheckboxProps extends React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root> {
|
|
4
|
+
label?: React.ReactNode;
|
|
5
|
+
}
|
|
6
|
+
declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLButtonElement>>;
|
|
4
7
|
export { Checkbox };
|
|
5
8
|
//# sourceMappingURL=Checkbox.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAC;AAK9D,QAAA,MAAM,QAAQ,
|
|
1
|
+
{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAC;AAK9D,MAAM,WAAW,aACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,iBAAiB,CAAC,IAAI,CAAC;IACrE,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACzB;AAED,QAAA,MAAM,QAAQ,yFAqDb,CAAC;AAGF,OAAO,EAAE,QAAQ,EAAE,CAAC"}
|
|
@@ -7,4 +7,6 @@ export declare const Default: Story;
|
|
|
7
7
|
export declare const Checked: Story;
|
|
8
8
|
export declare const Disabled: Story;
|
|
9
9
|
export declare const DisabledChecked: Story;
|
|
10
|
+
export declare const WithLabel: Story;
|
|
11
|
+
export declare const DisabledWithLabel: Story;
|
|
10
12
|
//# sourceMappingURL=Checkbox.stories.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,QAAQ,CAY/B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,QAAQ,CAAC,CAAC;AAEvC,eAAO,MAAM,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"Checkbox.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Checkbox/Checkbox.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,QAAQ,CAY/B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,QAAQ,CAAC,CAAC;AAEvC,eAAO,MAAM,OAAO,EAAE,KAkBrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAUrB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAUtB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAU7B,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAmBvB,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KAY/B,CAAC"}
|
|
@@ -12,6 +12,6 @@ interface LegendIconProps extends React.HTMLAttributes<HTMLSpanElement> {
|
|
|
12
12
|
/** Ícone de `@shape/shape-ui/icons/<nome>`. */
|
|
13
13
|
icon?: IconDefinition;
|
|
14
14
|
}
|
|
15
|
-
export declare const LegendIcon:
|
|
15
|
+
export declare const LegendIcon: React.ForwardRefExoticComponent<LegendIconProps & React.RefAttributes<HTMLSpanElement>>;
|
|
16
16
|
export {};
|
|
17
17
|
//# sourceMappingURL=LegendIcon.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LegendIcon.d.ts","sourceRoot":"","sources":["../../../src/components/LegendIcon/LegendIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"LegendIcon.d.ts","sourceRoot":"","sources":["../../../src/components/LegendIcon/LegendIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAQ,KAAK,cAAc,EAAE,MAAM,SAAS,CAAC;AAIpD,oBAAY,eAAe;IACzB,QAAQ,aAAa;IACrB,MAAM,WAAW;IACjB,MAAM,WAAW;IACjB,IAAI,SAAS;CACd;AAED,UAAU,eAAgB,SAAQ,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC;IACrE,QAAQ,EAAE,eAAe,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,+CAA+C;IAC/C,IAAI,CAAC,EAAE,cAAc,CAAC;CACvB;AAED,eAAO,MAAM,UAAU,yFA4DtB,CAAC"}
|
|
@@ -31,9 +31,8 @@ export interface AppSelectorProps {
|
|
|
31
31
|
apps: AppEntry[];
|
|
32
32
|
contactSupportUrl?: string;
|
|
33
33
|
}
|
|
34
|
-
export type LoginScreenProps = EmailStepProps | PasswordStepProps | AppSelectorProps
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
}
|
|
34
|
+
export type LoginScreenProps = (EmailStepProps | PasswordStepProps | AppSelectorProps) & {
|
|
35
|
+
className?: string;
|
|
36
|
+
};
|
|
37
|
+
export declare const LoginScreen: React.ForwardRefExoticComponent<LoginScreenProps & React.RefAttributes<HTMLDivElement>>;
|
|
39
38
|
//# sourceMappingURL=LoginScreen.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LoginScreen.d.ts","sourceRoot":"","sources":["../../../src/components/LoginScreen/LoginScreen.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"LoginScreen.d.ts","sourceRoot":"","sources":["../../../src/components/LoginScreen/LoginScreen.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,MAAM,WAAW,QAAQ;IACvB,EAAE,EAAE,YAAY,GAAG,MAAM,GAAG,OAAO,GAAG,MAAM,CAAC;IAC7C,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,cAAc;IAC7B,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,YAAY,EAAE,OAAO,CAAC;IACtB,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,kBAAkB,GAAG,iBAAiB,GAAG,SAAS,CAAC;IAC3D,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,MAAM,WAAW,iBAAiB;IAChC,OAAO,EAAE,UAAU,CAAC;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,gBAAgB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,qBAAqB,GAAG,iBAAiB,GAAG,SAAS,CAAC;IAC9D,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,cAAc,GAAG,kBAAkB,CAAC;IAC7C,IAAI,EAAE,QAAQ,EAAE,CAAC;IACjB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,MAAM,MAAM,gBAAgB,GAAG,CAC3B,cAAc,GACd,iBAAiB,GACjB,gBAAgB,CACnB,GAAG;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAmB3B,eAAO,MAAM,WAAW,yFAqKvB,CAAC"}
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
|
+
import * as React from "react";
|
|
2
3
|
export type MetricCardProps = {
|
|
3
4
|
onClick?: () => void;
|
|
4
5
|
tooltipText?: string;
|
|
5
6
|
isSelected?: boolean;
|
|
6
7
|
width?: string;
|
|
8
|
+
className?: string;
|
|
7
9
|
metric: {
|
|
8
10
|
title: string;
|
|
9
11
|
value: string | number;
|
|
@@ -11,5 +13,5 @@ export type MetricCardProps = {
|
|
|
11
13
|
};
|
|
12
14
|
};
|
|
13
15
|
export declare const getTestId: (title: string, part?: "title" | "value" | "unit") => string;
|
|
14
|
-
export declare const MetricCard:
|
|
16
|
+
export declare const MetricCard: React.ForwardRefExoticComponent<MetricCardProps & React.RefAttributes<HTMLButtonElement>>;
|
|
15
17
|
//# sourceMappingURL=MetricCard.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MetricCard.d.ts","sourceRoot":"","sources":["../../../src/components/MetricCard/MetricCard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAWvC,MAAM,MAAM,eAAe,GAAG;IAC5B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,EAAE;QACN,KAAK,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;QACvB,IAAI,EAAE,SAAS,CAAC;KACjB,CAAC;CACH,CAAC;AAEF,eAAO,MAAM,SAAS,UACb,MAAM,SACN,OAAO,GAAG,OAAO,GAAG,MAAM,KAChC,MAMF,CAAC;AAEF,eAAO,MAAM,UAAU,
|
|
1
|
+
{"version":3,"file":"MetricCard.d.ts","sourceRoot":"","sources":["../../../src/components/MetricCard/MetricCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAWvC,MAAM,MAAM,eAAe,GAAG;IAC5B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE;QACN,KAAK,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;QACvB,IAAI,EAAE,SAAS,CAAC;KACjB,CAAC;CACH,CAAC;AAEF,eAAO,MAAM,SAAS,UACb,MAAM,SACN,OAAO,GAAG,OAAO,GAAG,MAAM,KAChC,MAMF,CAAC;AAEF,eAAO,MAAM,UAAU,2FAwDtB,CAAC"}
|
|
@@ -33,9 +33,7 @@ export interface ModalProps {
|
|
|
33
33
|
*/
|
|
34
34
|
modal?: boolean;
|
|
35
35
|
}
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
displayName: string;
|
|
39
|
-
};
|
|
36
|
+
/** `ref` points at the dialog panel (`DialogPrimitive.Content`), which renders in a portal. */
|
|
37
|
+
declare const Modal: React.ForwardRefExoticComponent<ModalProps & React.RefAttributes<HTMLDivElement>>;
|
|
40
38
|
export { Modal };
|
|
41
39
|
//# sourceMappingURL=Modal.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAU3D,MAAM,WAAW,UAAU;IACzB,kCAAkC;IAClC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,4CAA4C;IAC5C,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,0FAA0F;IAC1F,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,qDAAqD;IACrD,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,sDAAsD;IACtD,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,6CAA6C;IAC7C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,0DAA0D;IAC1D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,mDAAmD;IACnD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mDAAmD;IACnD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gEAAgE;IAChE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,yDAAyD;IACzD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,2DAA2D;IAC3D,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,QAAA,MAAM,KAAK
|
|
1
|
+
{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAU3D,MAAM,WAAW,UAAU;IACzB,kCAAkC;IAClC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,4CAA4C;IAC5C,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,0FAA0F;IAC1F,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,qDAAqD;IACrD,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,sDAAsD;IACtD,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,6CAA6C;IAC7C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,0DAA0D;IAC1D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,mDAAmD;IACnD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mDAAmD;IACnD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gEAAgE;IAChE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,yDAAyD;IACzD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,2DAA2D;IAC3D,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,+FAA+F;AAC/F,QAAA,MAAM,KAAK,mFAqHV,CAAC;AAIF,OAAO,EAAE,KAAK,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioGroup.stories.d.ts","sourceRoot":"","sources":["../../../src/components/RadioGroup/RadioGroup.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAQ1C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,UAAU,
|
|
1
|
+
{"version":3,"file":"RadioGroup.stories.d.ts","sourceRoot":"","sources":["../../../src/components/RadioGroup/RadioGroup.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAQ1C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,UAAU,CAoBjC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,UAAU,CAAC,CAAC;AAEzC,eAAO,MAAM,OAAO,EAAE,KAuBrB,CAAC;AAEF,eAAO,MAAM,MAAM,EAAE,KAuBpB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAwBtB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAoB3B,CAAC"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { DataTableProps } from './DataTable.types';
|
|
2
|
-
export declare function DataTable<TData>({ data, columnSpecs, getColumnLabel, overrideColumns, getRowId, getSubRows, filter, selection, expansion, activeRow, display, }: DataTableProps<TData>): import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
export declare function DataTable<TData>({ data, columnSpecs, getColumnLabel, overrideColumns, getRowId, getSubRows, filter, selection, expansion, activeRow, display, pagination, }: DataTableProps<TData>): import("react/jsx-runtime").JSX.Element;
|
|
3
3
|
//# sourceMappingURL=DataTable.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../../src/components/Table/DataTable/DataTable.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"DataTable.d.ts","sourceRoot":"","sources":["../../../../src/components/Table/DataTable/DataTable.tsx"],"names":[],"mappings":"AAkCA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AA2BxD,wBAAgB,SAAS,CAAC,KAAK,EAAE,EAC/B,IAAI,EACJ,WAAW,EACX,cAAc,EACd,eAAe,EACf,QAAQ,EACR,UAAU,EACV,MAAM,EACN,SAAS,EACT,SAAS,EACT,SAAS,EACT,OAAO,EACP,UAAU,GACX,EAAE,cAAc,CAAC,KAAK,CAAC,2CAqYvB"}
|
|
@@ -41,11 +41,17 @@ export interface DataTableDisplayGroup<TData> {
|
|
|
41
41
|
forcedHiddenColumnIds?: string[];
|
|
42
42
|
defaultVisibleColumnIds?: string[];
|
|
43
43
|
}
|
|
44
|
+
export interface DataTablePaginationGroup {
|
|
45
|
+
onLoadMore?: () => void;
|
|
46
|
+
hasMore?: boolean;
|
|
47
|
+
isLoadingMore?: boolean;
|
|
48
|
+
}
|
|
44
49
|
export type DataTableProps<TData> = DataTableDataProps<TData> & {
|
|
45
50
|
filter?: DataTableFilterGroup;
|
|
46
51
|
selection?: DataTableSelectionGroup;
|
|
47
52
|
expansion?: DataTableExpansionGroup<TData>;
|
|
48
53
|
activeRow?: DataTableActiveRowGroup;
|
|
49
54
|
display?: DataTableDisplayGroup<TData>;
|
|
55
|
+
pagination?: DataTablePaginationGroup;
|
|
50
56
|
};
|
|
51
57
|
//# sourceMappingURL=DataTable.types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTable.types.d.ts","sourceRoot":"","sources":["../../../../src/components/Table/DataTable/DataTable.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AACpC,OAAO,KAAK,EACV,aAAa,EACb,UAAU,EACV,GAAG,EACH,iBAAiB,EACjB,YAAY,EACb,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAE7D,MAAM,WAAW,kBAAkB,CAAC,KAAK;IACvC,IAAI,EAAE,KAAK,EAAE,CAAC;IACd,WAAW,EAAE,mBAAmB,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,CAAC;IACnD,cAAc,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,MAAM,CAAC;IACzC,eAAe,CAAC,EAAE,MAAM,EAAE,CAAC;IAC3B,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACjD,UAAU,CAAC,EAAE,CAAC,GAAG,EAAE,KAAK,KAAK,KAAK,EAAE,GAAG,SAAS,CAAC;CAClD;AAED,MAAM,WAAW,oBAAoB;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,UAAU,CAAC,MAAM,CAAC,CAAC;CAC/B;AAED,MAAM,WAAW,uBAAuB;IACtC,KAAK,CAAC,EAAE,iBAAiB,CAAC;IAC1B,QAAQ,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,CAAC;CAC1C;AAED,MAAM,WAAW,uBAAuB,CAAC,KAAK;IAC5C,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,QAAQ,CAAC,EAAE,UAAU,CAAC,aAAa,CAAC,CAAC;IACrC,kBAAkB,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,CAAC,KAAK,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IAC1D,sBAAsB,CAAC,EAAE,OAAO,CAAC;CAClC;AAED,MAAM,WAAW,uBAAuB;IACtC,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;CAChD;AAED,MAAM,WAAW,qBAAqB,CAAC,KAAK;IAC1C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACnC,eAAe,CAAC,EAAE,CAAC,GAAG,EAAE,KAAK,KAAK,MAAM,CAAC;IACzC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oBAAoB,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC;IACpD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,qBAAqB,CAAC,EAAE,MAAM,EAAE,CAAC;IACjC,uBAAuB,CAAC,EAAE,MAAM,EAAE,CAAC;CACpC;AAED,MAAM,MAAM,cAAc,CAAC,KAAK,IAAI,kBAAkB,CAAC,KAAK,CAAC,GAAG;IAC9D,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B,SAAS,CAAC,EAAE,uBAAuB,CAAC;IACpC,SAAS,CAAC,EAAE,uBAAuB,CAAC,KAAK,CAAC,CAAC;IAC3C,SAAS,CAAC,EAAE,uBAAuB,CAAC;IACpC,OAAO,CAAC,EAAE,qBAAqB,CAAC,KAAK,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"DataTable.types.d.ts","sourceRoot":"","sources":["../../../../src/components/Table/DataTable/DataTable.types.ts"],"names":[],"mappings":"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"}
|