@apify/ui-library 1.141.3 → 1.145.2-featverifieddeveloperbadge-bd59c6.13
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 +90 -19
- package/dist/src/components/box/box.d.ts +15 -14
- package/dist/src/components/box/box.d.ts.map +1 -1
- package/dist/src/components/box/box.js +10 -33
- package/dist/src/components/box/box.js.map +1 -1
- package/dist/src/components/breadcrumb/breadcrumb.d.ts.map +1 -1
- package/dist/src/components/breadcrumb/breadcrumb.js +1 -0
- package/dist/src/components/breadcrumb/breadcrumb.js.map +1 -1
- package/dist/src/components/card/card.d.ts.map +1 -1
- package/dist/src/components/card/card.js +1 -0
- package/dist/src/components/card/card.js.map +1 -1
- package/dist/src/components/chip/chip.d.ts.map +1 -1
- package/dist/src/components/chip/chip.js +2 -0
- package/dist/src/components/chip/chip.js.map +1 -1
- package/dist/src/components/code/code_block/code_block.styled.d.ts.map +1 -1
- package/dist/src/components/code/code_block/code_block.styled.js +1 -2
- package/dist/src/components/code/code_block/code_block.styled.js.map +1 -1
- package/dist/src/components/code/one_light_theme.d.ts.map +1 -1
- package/dist/src/components/code/one_light_theme.js +1 -0
- package/dist/src/components/code/one_light_theme.js.map +1 -1
- package/dist/src/components/dropdown/dropdown.context.d.ts +6 -0
- package/dist/src/components/dropdown/dropdown.context.d.ts.map +1 -0
- package/dist/src/components/dropdown/dropdown.context.js +10 -0
- package/dist/src/components/dropdown/dropdown.context.js.map +1 -0
- package/dist/src/components/dropdown/dropdown.d.ts +48 -0
- package/dist/src/components/dropdown/dropdown.d.ts.map +1 -0
- package/dist/src/components/dropdown/dropdown.js +65 -0
- package/dist/src/components/dropdown/dropdown.js.map +1 -0
- package/dist/src/components/dropdown/dropdown.styled.d.ts +35 -0
- package/dist/src/components/dropdown/dropdown.styled.d.ts.map +1 -0
- package/dist/src/components/dropdown/dropdown.styled.js +241 -0
- package/dist/src/components/dropdown/dropdown.styled.js.map +1 -0
- package/dist/src/components/dropdown/dropdown.types.d.ts +17 -0
- package/dist/src/components/dropdown/dropdown.types.d.ts.map +1 -0
- package/dist/src/components/dropdown/dropdown.types.js +2 -0
- package/dist/src/components/dropdown/dropdown.types.js.map +1 -0
- package/dist/src/components/dropdown/dropdown_button.d.ts +10 -0
- package/dist/src/components/dropdown/dropdown_button.d.ts.map +1 -0
- package/dist/src/components/dropdown/dropdown_button.js +16 -0
- package/dist/src/components/dropdown/dropdown_button.js.map +1 -0
- package/dist/src/components/dropdown/dropdown_root.d.ts +11 -0
- package/dist/src/components/dropdown/dropdown_root.d.ts.map +1 -0
- package/dist/src/components/dropdown/dropdown_root.js +19 -0
- package/dist/src/components/dropdown/dropdown_root.js.map +1 -0
- package/dist/src/components/dropdown/dropdown_shell.d.ts +15 -0
- package/dist/src/components/dropdown/dropdown_shell.d.ts.map +1 -0
- package/dist/src/components/dropdown/dropdown_shell.js +69 -0
- package/dist/src/components/dropdown/dropdown_shell.js.map +1 -0
- package/dist/src/components/dropdown/index.d.ts +7 -0
- package/dist/src/components/dropdown/index.d.ts.map +1 -0
- package/dist/src/components/dropdown/index.js +5 -0
- package/dist/src/components/dropdown/index.js.map +1 -0
- package/dist/src/components/index.d.ts +1 -0
- package/dist/src/components/index.d.ts.map +1 -1
- package/dist/src/components/index.js +1 -0
- package/dist/src/components/index.js.map +1 -1
- package/dist/src/components/message/message.d.ts +2 -0
- package/dist/src/components/message/message.d.ts.map +1 -1
- package/dist/src/components/message/message.js +2 -0
- package/dist/src/components/message/message.js.map +1 -1
- package/dist/src/components/pagination/pagination.d.ts.map +1 -1
- package/dist/src/components/pagination/pagination.js +1 -0
- package/dist/src/components/pagination/pagination.js.map +1 -1
- package/dist/src/components/tabs/tab.js +1 -1
- package/dist/src/components/tabs/tab.js.map +1 -1
- package/dist/src/utils/css_utils.d.ts +17 -0
- package/dist/src/utils/css_utils.d.ts.map +1 -1
- package/dist/src/utils/css_utils.js +54 -0
- package/dist/src/utils/css_utils.js.map +1 -1
- package/dist/tsconfig.build.tsbuildinfo +1 -1
- package/package.json +10 -5
- package/src/components/box/box.stories.tsx +18 -0
- package/src/components/box/box.tsx +31 -62
- package/src/components/breadcrumb/breadcrumb.tsx +1 -0
- package/src/components/card/card.tsx +1 -0
- package/src/components/chip/chip.tsx +2 -0
- package/src/components/code/code_block/code_block.styled.tsx +1 -2
- package/src/components/code/one_light_theme.ts +1 -0
- package/src/components/dropdown/dropdown.context.tsx +14 -0
- package/src/components/dropdown/dropdown.stories.tsx +343 -0
- package/src/components/dropdown/dropdown.styled.ts +265 -0
- package/src/components/dropdown/dropdown.tsx +259 -0
- package/src/components/dropdown/dropdown.types.ts +18 -0
- package/src/components/dropdown/dropdown_button.tsx +45 -0
- package/src/components/dropdown/dropdown_root.tsx +41 -0
- package/src/components/dropdown/dropdown_shell.tsx +139 -0
- package/src/components/dropdown/index.ts +6 -0
- package/src/components/index.ts +1 -0
- package/src/components/message/message.stories.jsx +1 -0
- package/src/components/message/message.tsx +2 -0
- package/src/components/pagination/pagination.tsx +1 -0
- package/src/components/tabs/tab.tsx +1 -1
- package/src/design_system/colors/build_color_tokens.js +14 -0
- package/src/design_system/colors/colors.stories.tsx +395 -0
- package/src/utils/css_utils.ts +79 -0
- package/style/colors/tokens.dark.css +149 -0
- package/style/colors/tokens.light.css +149 -0
- package/src/design_system/colors/Colors.mdx +0 -50
package/README.md
CHANGED
|
@@ -1,30 +1,101 @@
|
|
|
1
|
-
|
|
1
|
+
<!-- cspell:words apify -->
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
# `@apify/ui-library`
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
Browse components at the [hosted Storybook](https://apify.github.io/apify-core/storybook-shared).
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
It shouldn't have any relation or dependency to Apify internal logic - we want to use it across our repositories and some of them might be public.
|
|
7
|
+
Apify's React design-system library — primitives, theme tokens, and styled components shared across Apify Console and the marketing web.
|
|
9
8
|
|
|
10
|
-
|
|
11
|
-
If you’re changing any shared logic with the web that might affect the behavior, performance, or SEO, you need to always test it on both applications before it’s merged and published as a new version of the packages and after it’s done it’s your duty to make sure there are the latest versions within both repositories.
|
|
9
|
+
## Install
|
|
12
10
|
|
|
13
|
-
|
|
14
|
-
|
|
11
|
+
```bash
|
|
12
|
+
pnpm add @apify/ui-library
|
|
13
|
+
```
|
|
15
14
|
|
|
16
|
-
|
|
17
|
-
No technology-specific logic. We don’t want to use anything technology or codebase-specific (such as Meteor, React router, Next …) as there might be different approaches for the technology where the component is used (examples as linking logic - in Next.js there is Next Link component, same of Next Image instead of using normal <img /> tag). This kind of behavior should not happen on the component level. Browser vs. server - some of the components might be used on the web with SSR (Server Side Renderings) and such a component can’t be using browser-specific features (such as accessing window.location)
|
|
15
|
+
Peer dependencies (install in your project if not already there):
|
|
18
16
|
|
|
19
|
-
|
|
20
|
-
|
|
17
|
+
- `react` 17.x · 18.x · 19.x
|
|
18
|
+
- `react-dom` 17.x · 18.x · 19.x
|
|
19
|
+
- `styled-components` ^6.1.19
|
|
21
20
|
|
|
22
|
-
|
|
23
|
-
We use the [Design Tokens Manager](https://www.figma.com/community/plugin/1263743870981744253/design-tokens-manager) Figma plugin to export color tokens from our design files. This tool allows us to convert design-defined color styles into structured token JSON format that developers can easily consume.
|
|
24
|
-
The design team is responsible for exporting and maintaining the tokens. Once finalized, the exported file is shared with developers to integrate into the codebase, ensuring consistent color usage across platforms.
|
|
21
|
+
## Quick start
|
|
25
22
|
|
|
26
|
-
|
|
23
|
+
```tsx
|
|
24
|
+
import { Box, Button, Text } from '@apify/ui-library';
|
|
27
25
|
|
|
28
|
-
|
|
26
|
+
export const SaveBar = ({ onSave }: { onSave: () => void }) => (
|
|
27
|
+
<Box pt="space8" pb="space8">
|
|
28
|
+
<Text size="regular">You have unsaved changes.</Text>
|
|
29
|
+
<Button variant="primary" color="default" mt="space4" onClick={onSave}>
|
|
30
|
+
Save
|
|
31
|
+
</Button>
|
|
32
|
+
</Box>
|
|
33
|
+
);
|
|
34
|
+
```
|
|
29
35
|
|
|
30
|
-
|
|
36
|
+
`<Box>` exposes spacing tokens as utility props (`pt`, `mb`, `mx`, `p`, …); `<Text>` and `<Heading>` apply typography tokens via `size`. All values come from the shared `theme` — never hardcode colors, spacing, or radii.
|
|
37
|
+
|
|
38
|
+
## What's inside
|
|
39
|
+
|
|
40
|
+
- **Layout** — `Box` (utility-prop wrapper around any element)
|
|
41
|
+
- **Typography** — `Text`, `Heading`, plus content / shared / marketing variants
|
|
42
|
+
- **Forms** — `Button`, `IconButton`, `Checkbox`, `RadioButton`, `Switch`, `Select`
|
|
43
|
+
- **Data** — `Table` + primitives (`TableHead`, `TableRow`, `TableCell`, …), `Badge`, `Chip`, `Tag`
|
|
44
|
+
- **Feedback** — `Banner`, `Message`, `Spinner`
|
|
45
|
+
- **Navigation** — `Tabs`, `Breadcrumb`, `Pagination`, `Link`
|
|
46
|
+
- **Overlay** — `Floating` (menus, tooltips), `CollapsibleCard`
|
|
47
|
+
- **Theme tokens** — `theme.color.*`, `theme.space.*`, `theme.text.*`, `theme.radius.*`, `theme.shadow.*`, `theme.transition.*`
|
|
48
|
+
|
|
49
|
+
## Using color tokens outside of styled-components
|
|
50
|
+
|
|
51
|
+
For external projects that don't use styled-components — such as Tailwind-based apps or plain CSS — the package ships pre-built CSS files that register all color tokens as CSS custom properties on `:root`:
|
|
52
|
+
|
|
53
|
+
- `@apify/ui-library/style/colors/tokens.light.css`
|
|
54
|
+
- `@apify/ui-library/style/colors/tokens.dark.css`
|
|
55
|
+
|
|
56
|
+
Import the file that matches your theme in your global stylesheet:
|
|
57
|
+
|
|
58
|
+
```css
|
|
59
|
+
@import '@apify/ui-library/style/colors/tokens.light.css';
|
|
60
|
+
```
|
|
61
|
+
|
|
62
|
+
You can then reference any token via CSS custom properties:
|
|
63
|
+
|
|
64
|
+
```css
|
|
65
|
+
.my-element {
|
|
66
|
+
color: var(--color-neutral-text);
|
|
67
|
+
background: var(--color-neutral-background);
|
|
68
|
+
border-color: var(--color-neutral-border);
|
|
69
|
+
}
|
|
70
|
+
```
|
|
71
|
+
|
|
72
|
+
For Tailwind, map the variables in `tailwind.config.js`:
|
|
73
|
+
|
|
74
|
+
```js
|
|
75
|
+
/** @type {import('tailwindcss').Config} */
|
|
76
|
+
export default {
|
|
77
|
+
theme: {
|
|
78
|
+
extend: {
|
|
79
|
+
colors: {
|
|
80
|
+
'neutral-text': 'var(--color-neutral-text)',
|
|
81
|
+
'neutral-bg': 'var(--color-neutral-background)',
|
|
82
|
+
'neutral-border': 'var(--color-neutral-border)',
|
|
83
|
+
},
|
|
84
|
+
},
|
|
85
|
+
},
|
|
86
|
+
};
|
|
87
|
+
```
|
|
88
|
+
|
|
89
|
+
## Storybook
|
|
90
|
+
|
|
91
|
+
From the repository root:
|
|
92
|
+
|
|
93
|
+
```bash
|
|
94
|
+
pnpm run storybook
|
|
95
|
+
```
|
|
96
|
+
|
|
97
|
+
This starts both Storybooks in parallel — Console-specific stories on [http://localhost:6006](http://localhost:6006) and shared design-system stories (this library) on [http://localhost:6007](http://localhost:6007).
|
|
98
|
+
|
|
99
|
+
## Contributing
|
|
100
|
+
|
|
101
|
+
See [`CONTRIBUTING.md`](./CONTRIBUTING.md) for the component lifecycle, design-token sync (Figma colors and Supernova typography), Storybook conventions, publishing, and the review checklist. New components are easiest to scaffold with the [`/create-ui-component`](../../../.claude/skills/create-ui-component/SKILL.md) Claude Code skill.
|
|
@@ -1,23 +1,24 @@
|
|
|
1
1
|
import type React from 'react';
|
|
2
2
|
import type { Size } from '../../design_system/tokens';
|
|
3
|
+
import { type ResponsiveValue } from '../../utils/css_utils.js';
|
|
3
4
|
type ExtendedSize = Size | 'none' | 'auto';
|
|
4
5
|
export interface MarginSpacingProps {
|
|
5
|
-
m?: ExtendedSize
|
|
6
|
-
mt?: ExtendedSize
|
|
7
|
-
mb?: ExtendedSize
|
|
8
|
-
ml?: ExtendedSize
|
|
9
|
-
mr?: ExtendedSize
|
|
10
|
-
mx?: ExtendedSize
|
|
11
|
-
my?: ExtendedSize
|
|
6
|
+
m?: ResponsiveValue<ExtendedSize>;
|
|
7
|
+
mt?: ResponsiveValue<ExtendedSize>;
|
|
8
|
+
mb?: ResponsiveValue<ExtendedSize>;
|
|
9
|
+
ml?: ResponsiveValue<ExtendedSize>;
|
|
10
|
+
mr?: ResponsiveValue<ExtendedSize>;
|
|
11
|
+
mx?: ResponsiveValue<ExtendedSize>;
|
|
12
|
+
my?: ResponsiveValue<ExtendedSize>;
|
|
12
13
|
}
|
|
13
14
|
export interface PaddingSpacingProps {
|
|
14
|
-
p?: ExtendedSize
|
|
15
|
-
pt?: ExtendedSize
|
|
16
|
-
pb?: ExtendedSize
|
|
17
|
-
pl?: ExtendedSize
|
|
18
|
-
pr?: ExtendedSize
|
|
19
|
-
px?: ExtendedSize
|
|
20
|
-
py?: ExtendedSize
|
|
15
|
+
p?: ResponsiveValue<ExtendedSize>;
|
|
16
|
+
pt?: ResponsiveValue<ExtendedSize>;
|
|
17
|
+
pb?: ResponsiveValue<ExtendedSize>;
|
|
18
|
+
pl?: ResponsiveValue<ExtendedSize>;
|
|
19
|
+
pr?: ResponsiveValue<ExtendedSize>;
|
|
20
|
+
px?: ResponsiveValue<ExtendedSize>;
|
|
21
|
+
py?: ResponsiveValue<ExtendedSize>;
|
|
21
22
|
}
|
|
22
23
|
type SharedBoxProps = {
|
|
23
24
|
children?: React.ReactNode;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"box.d.ts","sourceRoot":"","sources":["../../../../src/components/box/box.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;
|
|
1
|
+
{"version":3,"file":"box.d.ts","sourceRoot":"","sources":["../../../../src/components/box/box.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAEvD,OAAO,EAAuB,KAAK,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAErF,KAAK,YAAY,GAAG,IAAI,GAAG,MAAM,GAAG,MAAM,CAAC;AAE3C,MAAM,WAAW,kBAAkB;IAC/B,CAAC,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IAClC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;CACtC;AAED,MAAM,WAAW,mBAAmB;IAChC,CAAC,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IAClC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;IACnC,EAAE,CAAC,EAAE,eAAe,CAAC,YAAY,CAAC,CAAC;CACtC;AAED,KAAK,cAAc,GAAG;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAGF,MAAM,MAAM,eAAe,GAAG,cAAc,GAAG;IAAE,EAAE,CAAC,EAAE,KAAK,CAAC,WAAW,CAAA;CAAE,CAAC;AAE1E,KAAK,UAAU,GAAG,cAAc,GAAG;IAAE,EAAE,EAAE,IAAI,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAEhE,yEAAyE;AACzE,KAAK,WAAW,GAAG,eAAe,GAAG,UAAU,CAAC;AAEhD,MAAM,MAAM,QAAQ,GAAG,kBAAkB,GAAG,mBAAmB,GAAG,WAAW,CAAC;AA4B9E,eAAO,MAAM,GAAG,8EAsBf,CAAC"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef } from 'react';
|
|
3
|
-
import styled
|
|
3
|
+
import styled from 'styled-components';
|
|
4
4
|
import { theme } from '../../design_system/theme.js';
|
|
5
|
+
import { getResponsiveStyles } from '../../utils/css_utils.js';
|
|
5
6
|
const getSizeValue = (token) => {
|
|
6
7
|
if (!token || token === 'none')
|
|
7
8
|
return 0;
|
|
@@ -10,45 +11,21 @@ const getSizeValue = (token) => {
|
|
|
10
11
|
return theme.space[token] || 0;
|
|
11
12
|
};
|
|
12
13
|
const StyledBox = styled.div `
|
|
13
|
-
${({ $mt, $my, $m }) => ($mt
|
|
14
|
-
css `
|
|
15
|
-
margin-top: ${getSizeValue($mt || $my || $m)};
|
|
16
|
-
`}
|
|
14
|
+
${({ $mt, $my, $m }) => getResponsiveStyles('margin-top', getSizeValue, $mt, [$my, $m])}
|
|
17
15
|
|
|
18
|
-
${({ $mb, $my, $m }) => ($mb
|
|
19
|
-
css `
|
|
20
|
-
margin-bottom: ${getSizeValue($mb || $my || $m)};
|
|
21
|
-
`}
|
|
16
|
+
${({ $mb, $my, $m }) => getResponsiveStyles('margin-bottom', getSizeValue, $mb, [$my, $m])}
|
|
22
17
|
|
|
23
|
-
${({ $mr, $mx, $m }) => ($mr
|
|
24
|
-
css `
|
|
25
|
-
margin-right: ${getSizeValue($mr || $mx || $m)};
|
|
26
|
-
`}
|
|
18
|
+
${({ $mr, $mx, $m }) => getResponsiveStyles('margin-right', getSizeValue, $mr, [$mx, $m])}
|
|
27
19
|
|
|
28
|
-
${({ $ml, $mx, $m }) => ($ml
|
|
29
|
-
css `
|
|
30
|
-
margin-left: ${getSizeValue($ml || $mx || $m)};
|
|
31
|
-
`}
|
|
20
|
+
${({ $ml, $mx, $m }) => getResponsiveStyles('margin-left', getSizeValue, $ml, [$mx, $m])}
|
|
32
21
|
|
|
33
|
-
${({ $pt, $py, $p }) => ($pt
|
|
34
|
-
css `
|
|
35
|
-
padding-top: ${getSizeValue($pt || $py || $p)};
|
|
36
|
-
`}
|
|
22
|
+
${({ $pt, $py, $p }) => getResponsiveStyles('padding-top', getSizeValue, $pt, [$py, $p])}
|
|
37
23
|
|
|
38
|
-
${({ $pb, $py, $p }) => ($pb
|
|
39
|
-
css `
|
|
40
|
-
padding-bottom: ${getSizeValue($pb || $py || $p)};
|
|
41
|
-
`}
|
|
24
|
+
${({ $pb, $py, $p }) => getResponsiveStyles('padding-bottom', getSizeValue, $pb, [$py, $p])}
|
|
42
25
|
|
|
43
|
-
${({ $pr, $px, $p }) => ($pr
|
|
44
|
-
css `
|
|
45
|
-
padding-right: ${getSizeValue($pr || $px || $p)};
|
|
46
|
-
`}
|
|
26
|
+
${({ $pr, $px, $p }) => getResponsiveStyles('padding-right', getSizeValue, $pr, [$px, $p])}
|
|
47
27
|
|
|
48
|
-
${({ $pl, $px, $p }) => ($pl
|
|
49
|
-
css `
|
|
50
|
-
padding-left: ${getSizeValue($pl || $px || $p)};
|
|
51
|
-
`}
|
|
28
|
+
${({ $pl, $px, $p }) => getResponsiveStyles('padding-left', getSizeValue, $pl, [$px, $p])}
|
|
52
29
|
`;
|
|
53
30
|
// This component should work as a base component for all low level components (Heading, Message, Card, ...) to make it easy to define spacing.
|
|
54
31
|
// Right now, it's quite common to define some sort of spacing on these components already using css. Card = styled.div`margin-bottom: theme.space.space8`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"box.js","sourceRoot":"","sources":["../../../../src/components/box/box.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,MAAM,
|
|
1
|
+
{"version":3,"file":"box.js","sourceRoot":"","sources":["../../../../src/components/box/box.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"breadcrumb.d.ts","sourceRoot":"","sources":["../../../../src/components/breadcrumb/breadcrumb.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,eAAO,MAAM,oBAAoB;;;;;CAKvB,CAAC;
|
|
1
|
+
{"version":3,"file":"breadcrumb.d.ts","sourceRoot":"","sources":["../../../../src/components/breadcrumb/breadcrumb.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,eAAO,MAAM,oBAAoB;;;;;CAKvB,CAAC;AA4BX,MAAM,MAAM,cAAc,GAAG;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC3B,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAsClD,CAAC"}
|
|
@@ -26,6 +26,7 @@ const StyledBreadcrumbLink = styled(Link) `
|
|
|
26
26
|
&:hover {
|
|
27
27
|
color: ${theme.color.neutral.textMuted};
|
|
28
28
|
span {
|
|
29
|
+
/* TODO: (typography-partial) font-weight override without paired font-size/line-height — revisit to confirm intended typography token. */
|
|
29
30
|
font-weight: 500;
|
|
30
31
|
}
|
|
31
32
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"breadcrumb.js","sourceRoot":"","sources":["../../../../src/components/breadcrumb/breadcrumb.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EAAE,KAAK,EAAE,MAAM,8BAA8B,CAAC;AACrD,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAC;AAC7B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC/B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAE/B,MAAM,CAAC,MAAM,oBAAoB,GAAG;IAChC,OAAO,EAAE,sBAAsB;IAC/B,SAAS,EAAE,wBAAwB;IACnC,IAAI,EAAE,mBAAmB;IACzB,WAAW,EAAE,2BAA2B;CAClC,CAAC;AAEX,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAA;;;WAG1B,KAAK,CAAC,KAAK,CAAC,MAAM;CAC5B,CAAC;AAEF,MAAM,oBAAoB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;eAE1B,KAAK,CAAC,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM;qBAClC,KAAK,CAAC,MAAM,CAAC,OAAO;aAC5B,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU;;;iBAG1B,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS
|
|
1
|
+
{"version":3,"file":"breadcrumb.js","sourceRoot":"","sources":["../../../../src/components/breadcrumb/breadcrumb.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,OAAO,EAAE,KAAK,EAAE,MAAM,8BAA8B,CAAC;AACrD,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAC;AAC7B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAC/B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAE/B,MAAM,CAAC,MAAM,oBAAoB,GAAG;IAChC,OAAO,EAAE,sBAAsB;IAC/B,SAAS,EAAE,wBAAwB;IACnC,IAAI,EAAE,mBAAmB;IACzB,WAAW,EAAE,2BAA2B;CAClC,CAAC;AAEX,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAA;;;WAG1B,KAAK,CAAC,KAAK,CAAC,MAAM;CAC5B,CAAC;AAEF,MAAM,oBAAoB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;eAE1B,KAAK,CAAC,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM;qBAClC,KAAK,CAAC,MAAM,CAAC,OAAO;aAC5B,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU;;;iBAG1B,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS;;;;;;CAM7C,CAAC;AAEF,MAAM,wBAAwB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;eAC9B,KAAK,CAAC,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM;;CAEtD,CAAC;AAYF,MAAM,CAAC,MAAM,WAAW,GAA+B,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,CAC7E,KAAC,iBAAiB,IAAC,SAAS,EAAE,IAAI,CAAC,oBAAoB,CAAC,OAAO,EAAE,SAAS,CAAC,YACtE,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;QACvB,MAAM,QAAQ,GAAG,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC;QAC5C,OAAO,CACH,MAAC,KAAK,CAAC,QAAQ,eACV,KAAK,GAAG,CAAC,IAAI,CACV,KAAC,IAAI,IACD,EAAE,EAAC,MAAM,EACT,IAAI,EAAC,OAAO,EACZ,MAAM,EAAC,QAAQ,EACf,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,EACrC,SAAS,EAAE,oBAAoB,CAAC,SAAS,kBAGtC,CACV,EACD,eAAM,SAAS,EAAE,IAAI,CAAC,oBAAoB,CAAC,IAAI,EAAE,QAAQ,IAAI,oBAAoB,CAAC,WAAW,CAAC,YACzF,CAAC,QAAQ,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CACrB,KAAC,oBAAoB,IAAC,EAAE,EAAE,IAAI,CAAC,GAAG,YAC9B,KAAC,IAAI,IAAC,EAAE,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,MAAM,EAAC,QAAQ,YACvC,IAAI,CAAC,KAAK,GACR,GACY,CAC1B,CAAC,CAAC,CAAC,CACA,KAAC,wBAAwB,IACrB,IAAI,EAAC,OAAO,EACZ,MAAM,EAAE,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,EACpC,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU,YAE1E,IAAI,CAAC,KAAK,GACY,CAC9B,GACE,KA5BU,IAAI,CAAC,KAAK,CA6Bd,CACpB,CAAC;IACN,CAAC,CAAC,GACc,CACvB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../../src/components/card/card.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAC3D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAIvC,eAAO,MAAM,cAAc;;;;;;;CAO1B,CAAC;AAEF,UAAU,kBAAkB;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,UAAU,gBAAgB;IACtB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B;AAED,MAAM,MAAM,eAAe,GAAG,kBAAkB,CAAC,kBAAkB,CAAC,CAAC;AACrE,MAAM,MAAM,SAAS,GAAG,kBAAkB,GAAG,gBAAgB,GAAG,QAAQ,CAAC;AAEzE,eAAO,MAAM,iBAAiB,
|
|
1
|
+
{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../../src/components/card/card.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAC3D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAIvC,eAAO,MAAM,cAAc;;;;;;;CAO1B,CAAC;AAEF,UAAU,kBAAkB;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,UAAU,gBAAgB;IACtB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC7B;AAED,MAAM,MAAM,eAAe,GAAG,kBAAkB,CAAC,kBAAkB,CAAC,CAAC;AACrE,MAAM,MAAM,SAAS,GAAG,kBAAkB,GAAG,gBAAgB,GAAG,QAAQ,CAAC;AAEzE,eAAO,MAAM,iBAAiB,uXAuE7B,CAAC;AAEF,eAAO,MAAM,IAAI,+EA2ChB,CAAC"}
|
|
@@ -40,6 +40,7 @@ export const StyledCardWrapper = styled(Box) `
|
|
|
40
40
|
margin-left: 2rem;
|
|
41
41
|
|
|
42
42
|
button {
|
|
43
|
+
/* TODO: (typography-mismatch) font-size 1.4rem + line-height 1.4rem + font-weight 500 is not a token in typography_theme.ts — resolve with designer. */
|
|
43
44
|
font-size: 1.4rem;
|
|
44
45
|
line-height: 1.4rem;
|
|
45
46
|
font-weight: 500;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.js","sourceRoot":"","sources":["../../../../src/components/card/card.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,KAAK,EAAE,MAAM,8BAA8B,CAAC;AAGrD,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAC;AAC7B,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAE/B,MAAM,CAAC,MAAM,cAAc,GAAG;IAC1B,OAAO,EAAE,MAAM;IACf,MAAM,EAAE,aAAa;IACrB,OAAO,EAAE,cAAc;IACvB,OAAO,EAAE,cAAc;IACvB,WAAW,EAAE,kBAAkB;IAC/B,OAAO,EAAE,cAAc;CAC1B,CAAC;AAiBF,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAiB;;wBAErC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,cAAc;wBAClC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM;qBAC7B,KAAK,CAAC,MAAM,CAAC,OAAO;;;;;;;;;;;WAW9B,cAAc,CAAC,MAAM;;;;;mBAKb,KAAK,CAAC,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM;yBAC1D,KAAK,CAAC,MAAM,CAAC,OAAO,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO;;WAE1D,cAAc,CAAC,OAAO
|
|
1
|
+
{"version":3,"file":"card.js","sourceRoot":"","sources":["../../../../src/components/card/card.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chip.d.ts","sourceRoot":"","sources":["../../../../src/components/chip/chip.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAGrD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,QAAQ,CAAC;AAE9C,eAAO,MAAM,UAAU;;;;;CAKb,CAAC;AACX,KAAK,UAAU,GAAG,OAAO,CAAC,OAAO,UAAU,CAAC,CAAC;AAE7C,eAAO,MAAM,UAAU;;;;;;CAMb,CAAC;AACX,MAAM,MAAM,UAAU,GAAG,OAAO,CAAC,OAAO,UAAU,CAAC,CAAC;AAEpD,eAAO,MAAM,UAAU;;CAEtB,CAAC;
|
|
1
|
+
{"version":3,"file":"chip.d.ts","sourceRoot":"","sources":["../../../../src/components/chip/chip.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAChC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAGrD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,QAAQ,CAAC;AAE9C,eAAO,MAAM,UAAU;;;;;CAKb,CAAC;AACX,KAAK,UAAU,GAAG,OAAO,CAAC,OAAO,UAAU,CAAC,CAAC;AAE7C,eAAO,MAAM,UAAU;;;;;;CAMb,CAAC;AACX,MAAM,MAAM,UAAU,GAAG,OAAO,CAAC,OAAO,UAAU,CAAC,CAAC;AAEpD,eAAO,MAAM,UAAU;;CAEtB,CAAC;AA8FF,MAAM,MAAM,SAAS,GAAG,eAAe,GAAG;IACtC,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,IAAI;;;;;;;;;;WAVN,UAAU;WACV,UAAU;WACV,KAAK,CAAC,SAAS;gBACV,OAAO;iCA6BtB,CAAC;AAIF,KAAK,iBAAiB,GAAG,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;AAEjD,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,iBAAiB,CAA4D,CAAC;AAC3G,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,iBAAiB,CAA4D,CAAC;AAC3G,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,iBAAiB,CAA4D,CAAC;AAC3G,eAAO,MAAM,UAAU,EAAE,EAAE,CAAC,iBAAiB,CAA2D,CAAC;AACzG,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,iBAAiB,CAA4D,CAAC"}
|
|
@@ -39,6 +39,7 @@ const chipSizeStyle = {
|
|
|
39
39
|
border-radius: 100px;
|
|
40
40
|
`,
|
|
41
41
|
[CHIP_SIZES.LARGE]: css `
|
|
42
|
+
/* TODO: (typography-mismatch) 16px/20px does not match any canonical typography token — needs designer input. Blocks migrating chipSizeStyle to typography token interpolations (XS/S match bodyS, M matches bodyM). */
|
|
42
43
|
font-size: 16px;
|
|
43
44
|
line-height: 20px;
|
|
44
45
|
padding: 2px 8px;
|
|
@@ -99,6 +100,7 @@ const StyledChip = styled.span `
|
|
|
99
100
|
flex-direction: row;
|
|
100
101
|
justify-content: center;
|
|
101
102
|
align-items: center;
|
|
103
|
+
/* TODO: (typography-keyword) 'normal' keyword used instead of numeric value (400) or typography token. */
|
|
102
104
|
font-weight: normal;
|
|
103
105
|
white-space: nowrap;
|
|
104
106
|
cursor: ${({ clickable }) => (clickable ? 'pointer' : 'default')};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"chip.js","sourceRoot":"","sources":["../../../../src/components/chip/chip.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AAGxB,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAIhD,OAAO,EAAE,KAAK,EAAE,MAAM,8BAA8B,CAAC;AAGrD,MAAM,CAAC,MAAM,UAAU,GAAG;IACtB,WAAW,EAAE,IAAI;IACjB,KAAK,EAAE,GAAG;IACV,MAAM,EAAE,GAAG;IACX,KAAK,EAAE,GAAG;CACJ,CAAC;AAGX,MAAM,CAAC,MAAM,UAAU,GAAG;IACtB,OAAO,EAAE,SAAS;IAClB,OAAO,EAAE,SAAS;IAClB,OAAO,EAAE,SAAS;IAClB,OAAO,EAAE,SAAS;IAClB,MAAM,EAAE,QAAQ;CACV,CAAC;AAGX,MAAM,CAAC,MAAM,UAAU,GAAG;IACtB,IAAI,EAAE,WAAW;CACpB,CAAC;AAEF,MAAM,aAAa,GAAG;IAClB,CAAC,UAAU,CAAC,WAAW,CAAC,EAAE,GAAG,CAAA;;;;;KAK5B;IACD,CAAC,UAAU,CAAC,KAAK,CAAC,EAAE,GAAG,CAAA;;;;;KAKtB;IACD,CAAC,UAAU,CAAC,MAAM,CAAC,EAAE,GAAG,CAAA;;;;;KAKvB;IACD,CAAC,UAAU,CAAC,KAAK,CAAC,EAAE,GAAG,CAAA
|
|
1
|
+
{"version":3,"file":"chip.js","sourceRoot":"","sources":["../../../../src/components/chip/chip.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"code_block.styled.d.ts","sourceRoot":"","sources":["../../../../../src/components/code/code_block/code_block.styled.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAE9E,MAAM,MAAM,uCAAuC,GAAG,eAAe,GAAG;IACpE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC9B,CAAC;AAEF,eAAO,MAAM,kCAAkC,+dAoB9C,CAAC;AAEF,eAAO,MAAM,gBAAgB;gBACb,OAAO;wBACC,MAAM;sBACR,MAAM,EAAE;uBACP,OAAO;eACf,OAAO;iBACL,OAAO;uBACD,OAAO;kBACZ,OAAO;WACd,cAAc;
|
|
1
|
+
{"version":3,"file":"code_block.styled.d.ts","sourceRoot":"","sources":["../../../../../src/components/code/code_block/code_block.styled.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AAE9E,MAAM,MAAM,uCAAuC,GAAG,eAAe,GAAG;IACpE,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC9B,CAAC;AAEF,eAAO,MAAM,kCAAkC,+dAoB9C,CAAC;AAEF,eAAO,MAAM,gBAAgB;gBACb,OAAO;wBACC,MAAM;sBACR,MAAM,EAAE;uBACP,OAAO;eACf,OAAO;iBACL,OAAO;uBACD,OAAO;kBACZ,OAAO;WACd,cAAc;YA+IxB,CAAC"}
|
|
@@ -96,10 +96,9 @@ export const CodeBlockWrapper = styled(SyntaxHighlighterBaseStylesWrapper) `
|
|
|
96
96
|
|
|
97
97
|
&::after {
|
|
98
98
|
/* ensures same width of text when switching tabs and making it bold */
|
|
99
|
-
${theme.typography.
|
|
99
|
+
${theme.typography.content.tablet.heading5}
|
|
100
100
|
display: block;
|
|
101
101
|
content: attr(title);
|
|
102
|
-
font-weight: bold;
|
|
103
102
|
height: 0px;
|
|
104
103
|
color: transparent;
|
|
105
104
|
overflow: hidden;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"code_block.styled.js","sourceRoot":"","sources":["../../../../../src/components/code/code_block/code_block.styled.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,KAAK,EAAE,MAAM,iCAAiC,CAAC;AACxD,OAAO,EAAE,GAAG,EAAE,MAAM,WAAW,CAAC;AAShC,MAAM,CAAC,MAAM,kCAAkC,GAAG,MAAM,CAAC,GAAG,CAAC,CAAyC;wBAC9E,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,eAAe;wBACnC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM;qBAC7B,KAAK,CAAC,MAAM,CAAC,QAAQ;;;;MAIpC,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,CACjB,CAAC,UAAU;IACX,GAAG,CAAA;;SAEF;MACH,CAAC,EAAE,WAAW,EAAE,EAAE,EAAE,CAClB,CAAC,WAAW;IACZ,GAAG,CAAA;;SAEF;;;;CAIR,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,kCAAkC,CAAC,CAUxE;;;;;;;;eAQa,KAAK,CAAC,KAAK,CAAC,MAAM;4BACL,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,gBAAgB;mCAC7B,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM;;;;;;;2BAOlC,KAAK,CAAC,KAAK,CAAC,OAAO;6BACjB,KAAK,CAAC,KAAK,CAAC,MAAM;;;;;;;6BAOlB,KAAK,CAAC,KAAK,CAAC,OAAO;4BACpB,KAAK,CAAC,KAAK,CAAC,MAAM;;;;mBAI3B,KAAK,CAAC,KAAK,CAAC,MAAM;;4BAET,CAAC,EAAE,gBAAgB,EAAE,EAAE,EAAE,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC;;;iCAGtD,KAAK,CAAC,MAAM,CAAC,OAAO;;;;;;;;;;yBAU5B,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS;;;;;kCAKpB,KAAK,CAAC,KAAK,CAAC,MAAM,WAAW,KAAK,CAAC,KAAK,CAAC,MAAM;;;;;;;;6BAQpD,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI;wCACb,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM;wCAC1B,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,eAAe;;sCAErC,KAAK,CAAC,KAAK,CAAC,MAAM;;;;;;;wCAOhB,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM;;;;;;;sBAO5C,KAAK,CAAC,UAAU,CAAC,
|
|
1
|
+
{"version":3,"file":"code_block.styled.js","sourceRoot":"","sources":["../../../../../src/components/code/code_block/code_block.styled.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,KAAK,EAAE,MAAM,iCAAiC,CAAC;AACxD,OAAO,EAAE,GAAG,EAAE,MAAM,WAAW,CAAC;AAShC,MAAM,CAAC,MAAM,kCAAkC,GAAG,MAAM,CAAC,GAAG,CAAC,CAAyC;wBAC9E,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,eAAe;wBACnC,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM;qBAC7B,KAAK,CAAC,MAAM,CAAC,QAAQ;;;;MAIpC,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,CACjB,CAAC,UAAU;IACX,GAAG,CAAA;;SAEF;MACH,CAAC,EAAE,WAAW,EAAE,EAAE,EAAE,CAClB,CAAC,WAAW;IACZ,GAAG,CAAA;;SAEF;;;;CAIR,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,kCAAkC,CAAC,CAUxE;;;;;;;;eAQa,KAAK,CAAC,KAAK,CAAC,MAAM;4BACL,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,gBAAgB;mCAC7B,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM;;;;;;;2BAOlC,KAAK,CAAC,KAAK,CAAC,OAAO;6BACjB,KAAK,CAAC,KAAK,CAAC,MAAM;;;;;;;6BAOlB,KAAK,CAAC,KAAK,CAAC,OAAO;4BACpB,KAAK,CAAC,KAAK,CAAC,MAAM;;;;mBAI3B,KAAK,CAAC,KAAK,CAAC,MAAM;;4BAET,CAAC,EAAE,gBAAgB,EAAE,EAAE,EAAE,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC;;;iCAGtD,KAAK,CAAC,MAAM,CAAC,OAAO;;;;;;;;;;yBAU5B,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS;;;;;kCAKpB,KAAK,CAAC,KAAK,CAAC,MAAM,WAAW,KAAK,CAAC,KAAK,CAAC,MAAM;;;;;;;;6BAQpD,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI;wCACb,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM;wCAC1B,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,eAAe;;sCAErC,KAAK,CAAC,KAAK,CAAC,MAAM;;;;;;;wCAOhB,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,MAAM;;;;;;;sBAO5C,KAAK,CAAC,UAAU,CAAC,OAAO,CAAC,MAAM,CAAC,QAAQ;;;;;;;;;;;;;;;;UAgBpD,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,CACjB,UAAU;IACN,CAAC,CAAC,GAAG,CAAA;;uCAEkB,KAAK,CAAC,KAAK,CAAC,MAAM;mBACtC;IACH,CAAC,CAAC,GAAG,CAAA;qCACgB,KAAK,CAAC,KAAK,CAAC,OAAO;uCACjB,KAAK,CAAC,KAAK,CAAC,OAAO;mBACvC;;;eAGJ,KAAK,CAAC,KAAK,CAAC,MAAM;;;;UAIvB,CAAC,EAAE,UAAU,EAAE,EAAE,EAAE,CACjB,UAAU;IACV,GAAG,CAAA;gCACiB,KAAK,CAAC,KAAK,CAAC,OAAO;qEACkB,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,gBAAgB;aAC5F;;;;;;;;;;gDAUmC,CAAC,EAAE,iBAAiB,EAAE,EAAE,EAAE,CAAC,iBAAiB,IAAI,CAAC;;;;;mBAK9E,KAAK,CAAC,KAAK,CAAC,MAAM;;eAEtB,KAAK,CAAC,KAAK,CAAC,MAAM;;uBAEV,KAAK,CAAC,KAAK,CAAC,MAAM;;;;;;;gCAOT,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,UAAU;;;CAG7D,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"one_light_theme.d.ts","sourceRoot":"","sources":["../../../../src/components/code/one_light_theme.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAEvD,eAAO,MAAM,aAAa,EAAE,
|
|
1
|
+
{"version":3,"file":"one_light_theme.d.ts","sourceRoot":"","sources":["../../../../src/components/code/one_light_theme.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAEvD,eAAO,MAAM,aAAa,EAAE,UA6F3B,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"one_light_theme.js","sourceRoot":"","sources":["../../../../src/components/code/one_light_theme.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,aAAa,GAAe;IACrC,KAAK,EAAE;QACH,eAAe,EAAE,mBAAmB;QACpC,KAAK,EAAE,mBAAmB;KAC7B;IACD,MAAM,EAAE;QACJ;YACI,KAAK,EAAE,CAAC,SAAS,EAAE,QAAQ,EAAE,OAAO,CAAC;YACrC,KAAK,EAAE;gBACH,KAAK,EAAE,mBAAmB;aAC7B;SACJ;QACD;YACI,KAAK,EAAE,CAAC,SAAS,EAAE,QAAQ,CAAC;YAC5B,KAAK,EAAE;gBACH,KAAK,EAAE,mBAAmB;aAC7B;SACJ;QACD;YACI,KAAK,EAAE,CAAC,WAAW,EAAE,YAAY,EAAE,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,CAAC;YAC7E,KAAK,EAAE;gBACH,KAAK,EAAE,mBAAmB;aAC7B;SACJ;QACD;YACI,KAAK,EAAE,CAAC,SAAS,CAAC;YAClB,KAAK,EAAE;gBACH,KAAK,EAAE,oBAAoB;aAC9B;SACJ;QAED;YACI,KAAK,EAAE,CAAC,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,CAAC;YAC5D,KAAK,EAAE;gBACH,KAAK,EAAE,kBAAkB;aAC5B;SACJ;QACD;YACI,KAAK,EAAE,CAAC,aAAa,CAAC;YACtB,KAAK,EAAE;gBACH,KAAK,EAAE,mBAAmB;aAC7B;SACJ;QACD;YACI,KAAK,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,YAAY,CAAC;YACnF,KAAK,EAAE;gBACH,KAAK,EAAE,oBAAoB;aAC9B;SACJ;QACD;YACI,KAAK,EAAE,CAAC,UAAU,EAAE,UAAU,EAAE,UAAU,CAAC;YAC3C,KAAK,EAAE;gBACH,KAAK,EAAE,oBAAoB;aAC9B;SACJ;QACD;YACI,KAAK,EAAE,CAAC,KAAK,CAAC;YACd,KAAK,EAAE;gBACH,KAAK,EAAE,oBAAoB;aAC9B;SACJ;QACD;YACI,KAAK,EAAE,CAAC,SAAS,CAAC;YAClB,KAAK,EAAE;gBACH,kBAAkB,EAAE,cAAc;aACrC;SACJ;QACD;YACI,KAAK,EAAE,CAAC,UAAU,CAAC;YACnB,KAAK,EAAE;gBACH,kBAAkB,EAAE,WAAW;aAClC;SACJ;QACD;YACI,KAAK,EAAE,CAAC,QAAQ,CAAC;YACjB,KAAK,EAAE;gBACH,SAAS,EAAE,QAAQ;aACtB;SACJ;QACD;YACI,KAAK,EAAE,CAAC,WAAW,EAAE,MAAM,CAAC;YAC5B,KAAK,EAAE;gBACH,UAAU,EAAE,MAAM;aACrB;SACJ;QACD;YACI,KAAK,EAAE,CAAC,WAAW,CAAC;YACpB,KAAK,EAAE;gBACH,KAAK,EAAE,mBAAmB;aAC7B;SACJ;KACJ;CACJ,CAAC"}
|
|
1
|
+
{"version":3,"file":"one_light_theme.js","sourceRoot":"","sources":["../../../../src/components/code/one_light_theme.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,aAAa,GAAe;IACrC,KAAK,EAAE;QACH,eAAe,EAAE,mBAAmB;QACpC,KAAK,EAAE,mBAAmB;KAC7B;IACD,MAAM,EAAE;QACJ;YACI,KAAK,EAAE,CAAC,SAAS,EAAE,QAAQ,EAAE,OAAO,CAAC;YACrC,KAAK,EAAE;gBACH,KAAK,EAAE,mBAAmB;aAC7B;SACJ;QACD;YACI,KAAK,EAAE,CAAC,SAAS,EAAE,QAAQ,CAAC;YAC5B,KAAK,EAAE;gBACH,KAAK,EAAE,mBAAmB;aAC7B;SACJ;QACD;YACI,KAAK,EAAE,CAAC,WAAW,EAAE,YAAY,EAAE,SAAS,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,CAAC;YAC7E,KAAK,EAAE;gBACH,KAAK,EAAE,mBAAmB;aAC7B;SACJ;QACD;YACI,KAAK,EAAE,CAAC,SAAS,CAAC;YAClB,KAAK,EAAE;gBACH,KAAK,EAAE,oBAAoB;aAC9B;SACJ;QAED;YACI,KAAK,EAAE,CAAC,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,WAAW,CAAC;YAC5D,KAAK,EAAE;gBACH,KAAK,EAAE,kBAAkB;aAC5B;SACJ;QACD;YACI,KAAK,EAAE,CAAC,aAAa,CAAC;YACtB,KAAK,EAAE;gBACH,KAAK,EAAE,mBAAmB;aAC7B;SACJ;QACD;YACI,KAAK,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,YAAY,CAAC;YACnF,KAAK,EAAE;gBACH,KAAK,EAAE,oBAAoB;aAC9B;SACJ;QACD;YACI,KAAK,EAAE,CAAC,UAAU,EAAE,UAAU,EAAE,UAAU,CAAC;YAC3C,KAAK,EAAE;gBACH,KAAK,EAAE,oBAAoB;aAC9B;SACJ;QACD;YACI,KAAK,EAAE,CAAC,KAAK,CAAC;YACd,KAAK,EAAE;gBACH,KAAK,EAAE,oBAAoB;aAC9B;SACJ;QACD;YACI,KAAK,EAAE,CAAC,SAAS,CAAC;YAClB,KAAK,EAAE;gBACH,kBAAkB,EAAE,cAAc;aACrC;SACJ;QACD;YACI,KAAK,EAAE,CAAC,UAAU,CAAC;YACnB,KAAK,EAAE;gBACH,kBAAkB,EAAE,WAAW;aAClC;SACJ;QACD;YACI,KAAK,EAAE,CAAC,QAAQ,CAAC;YACjB,KAAK,EAAE;gBACH,SAAS,EAAE,QAAQ;aACtB;SACJ;QACD;YACI,KAAK,EAAE,CAAC,WAAW,EAAE,MAAM,CAAC;YAC5B,KAAK,EAAE;gBACH,kHAAkH;gBAClH,UAAU,EAAE,MAAM;aACrB;SACJ;QACD;YACI,KAAK,EAAE,CAAC,WAAW,CAAC;YACpB,KAAK,EAAE;gBACH,KAAK,EAAE,mBAAmB;aAC7B;SACJ;KACJ;CACJ,CAAC"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export type DropdownContextValue = {
|
|
2
|
+
handleSelectAndClose: (event?: Event) => void;
|
|
3
|
+
};
|
|
4
|
+
export declare const DropdownContext: import("react").Context<DropdownContextValue | null>;
|
|
5
|
+
export declare const useDropdownContext: () => DropdownContextValue;
|
|
6
|
+
//# sourceMappingURL=dropdown.context.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown.context.d.ts","sourceRoot":"","sources":["../../../../src/components/dropdown/dropdown.context.tsx"],"names":[],"mappings":"AAEA,MAAM,MAAM,oBAAoB,GAAG;IAC/B,oBAAoB,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,KAAK,IAAI,CAAC;CACjD,CAAC;AAEF,eAAO,MAAM,eAAe,sDAAmD,CAAC;AAChF,eAAO,MAAM,kBAAkB,4BAM9B,CAAC"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { createContext, useContext } from 'react';
|
|
2
|
+
export const DropdownContext = createContext(null);
|
|
3
|
+
export const useDropdownContext = () => {
|
|
4
|
+
const context = useContext(DropdownContext);
|
|
5
|
+
if (!context) {
|
|
6
|
+
throw new Error('Dropdown components must be used within a DropdownRoot provider');
|
|
7
|
+
}
|
|
8
|
+
return context;
|
|
9
|
+
};
|
|
10
|
+
//# sourceMappingURL=dropdown.context.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown.context.js","sourceRoot":"","sources":["../../../../src/components/dropdown/dropdown.context.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAMlD,MAAM,CAAC,MAAM,eAAe,GAAG,aAAa,CAA8B,IAAI,CAAC,CAAC;AAChF,MAAM,CAAC,MAAM,kBAAkB,GAAG,GAAG,EAAE;IACnC,MAAM,OAAO,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IAC5C,IAAI,CAAC,OAAO,EAAE,CAAC;QACX,MAAM,IAAI,KAAK,CAAC,iEAAiE,CAAC,CAAC;IACvF,CAAC;IACD,OAAO,OAAO,CAAC;AACnB,CAAC,CAAC"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import type * as DropdownMenu from '@radix-ui/react-dropdown-menu';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import type { BaseDropdownItemProps } from './dropdown.types.js';
|
|
4
|
+
type DropdownItemProps = React.ComponentPropsWithRef<typeof DropdownMenu.Item> & BaseDropdownItemProps & {
|
|
5
|
+
trailingIcon?: React.ReactNode;
|
|
6
|
+
selected?: boolean;
|
|
7
|
+
onSelect?: (event: Event) => void;
|
|
8
|
+
tags?: React.ReactNode[];
|
|
9
|
+
};
|
|
10
|
+
type DropdownCheckboxItemProps = React.ComponentPropsWithRef<typeof DropdownMenu.CheckboxItem> & BaseDropdownItemProps & {
|
|
11
|
+
checked?: boolean;
|
|
12
|
+
trailingIcon?: React.ReactNode;
|
|
13
|
+
onCheckedChange?: (checked: boolean) => void;
|
|
14
|
+
onSelect?: (event: Event) => void;
|
|
15
|
+
};
|
|
16
|
+
type RadioOption = {
|
|
17
|
+
label: string;
|
|
18
|
+
description?: string;
|
|
19
|
+
disabled?: boolean;
|
|
20
|
+
value: string;
|
|
21
|
+
};
|
|
22
|
+
type DropdownRadioGroupProps = {
|
|
23
|
+
options: RadioOption[];
|
|
24
|
+
value: string;
|
|
25
|
+
setValue: (value: string) => void;
|
|
26
|
+
};
|
|
27
|
+
type DropdownLabelProps = React.ComponentPropsWithRef<typeof DropdownMenu.Label> & {
|
|
28
|
+
children?: React.ReactNode | React.ReactNode[];
|
|
29
|
+
};
|
|
30
|
+
type DropdownControlProps = React.ComponentPropsWithRef<typeof DropdownMenu.Label> & {
|
|
31
|
+
children?: React.ReactNode | React.ReactNode[];
|
|
32
|
+
};
|
|
33
|
+
export declare const Dropdown: (({ closeOnSelect, children, isOpen, onIsOpenChange, ...props }: DropdownMenu.DropdownMenuProps & {
|
|
34
|
+
closeOnSelect?: boolean;
|
|
35
|
+
children: React.ReactNode;
|
|
36
|
+
onIsOpenChange?: (isOpen: boolean) => void;
|
|
37
|
+
isOpen?: boolean;
|
|
38
|
+
contentProps?: React.ComponentPropsWithRef<typeof DropdownMenu.Content>;
|
|
39
|
+
}) => import("react/jsx-runtime").JSX.Element) & {
|
|
40
|
+
Item: ({ children, icon, trailingIcon, selected, description, onSelect, className, disabled, tags, ...props }: DropdownItemProps) => import("react/jsx-runtime").JSX.Element;
|
|
41
|
+
CheckboxItem: ({ checked, children, icon, trailingIcon, onCheckedChange, description, onSelect, disabled, className, ...props }: DropdownCheckboxItemProps) => import("react/jsx-runtime").JSX.Element;
|
|
42
|
+
Label: (props: DropdownLabelProps) => import("react/jsx-runtime").JSX.Element;
|
|
43
|
+
RadioGroup: ({ options, value, setValue }: DropdownRadioGroupProps) => import("react/jsx-runtime").JSX.Element;
|
|
44
|
+
Controls: (props: DropdownControlProps) => import("react/jsx-runtime").JSX.Element;
|
|
45
|
+
Separator: (props: React.ComponentPropsWithRef<typeof DropdownMenu.Separator>) => import("react/jsx-runtime").JSX.Element;
|
|
46
|
+
};
|
|
47
|
+
export {};
|
|
48
|
+
//# sourceMappingURL=dropdown.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../../src/components/dropdown/dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,YAAY,MAAM,+BAA+B,CAAC;AAGnE,OAAO,KAAK,MAAM,OAAO,CAAC;AAyB1B,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AAGjE,KAAK,iBAAiB,GAAG,KAAK,CAAC,qBAAqB,CAAC,OAAO,YAAY,CAAC,IAAI,CAAC,GAC1E,qBAAqB,GAAG;IACpB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IAClC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC;CAC5B,CAAC;AAkDN,KAAK,yBAAyB,GAAG,KAAK,CAAC,qBAAqB,CAAC,OAAO,YAAY,CAAC,YAAY,CAAC,GAC1F,qBAAqB,GAAG;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;CACrC,CAAC;AAgEN,KAAK,WAAW,GAAG;IACf,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;CACjB,CAAC;AA8BF,KAAK,uBAAuB,GAAG;IAC3B,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACrC,CAAC;AAsCF,KAAK,kBAAkB,GAAG,KAAK,CAAC,qBAAqB,CAAC,OAAO,YAAY,CAAC,KAAK,CAAC,GAAG;IAC/E,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,EAAE,CAAC;CAClD,CAAC;AAIF,KAAK,oBAAoB,GAAG,KAAK,CAAC,qBAAqB,CAAC,OAAO,YAAY,CAAC,KAAK,CAAC,GAAG;IACjF,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,EAAE,CAAC;CAClD,CAAC;AASF,eAAO,MAAM,QAAQ;;;;;;;mHAzMlB,iBAAiB;qIAwDjB,yBAAyB;mBAoIE,kBAAkB;+CAxCU,uBAAuB;sBA6ChD,oBAAoB;uBAInB,KAAK,CAAC,qBAAqB,CAAC,OAAO,YAAY,CAAC,SAAS,CAAC;CAW1F,CAAC"}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
+
import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
|
|
3
|
+
import { clsx } from 'clsx';
|
|
4
|
+
import React from 'react';
|
|
5
|
+
import styled from 'styled-components';
|
|
6
|
+
import { CheckIcon } from '@apify/ui-icons';
|
|
7
|
+
import { theme } from '../../design_system/theme.js';
|
|
8
|
+
import { CheckboxPrimitive } from '../checkbox/checkbox.js';
|
|
9
|
+
import { radioButtonStyle } from '../radio_button/radio_button.style.js';
|
|
10
|
+
import { useDropdownContext } from './dropdown.context.js';
|
|
11
|
+
import { DROPDOWN_ELEMENT_CLASSES, StyledCheckboxIconWrapper, StyledCheckboxItem, StyledContentWrapper, StyledControls, StyledDescription, StyledIconWrapper, StyledItem, StyledItemRow, StyledItemTitle, StyledItemWrapper, StyledLabel, StyledSeparator, StyledTagWrapper, } from './dropdown.styled.js';
|
|
12
|
+
import { DropdownRoot } from './dropdown_root.js';
|
|
13
|
+
const DropdownItem = ({ children, icon, trailingIcon, selected, description, onSelect, className, disabled, tags = [], ...props }) => {
|
|
14
|
+
const { handleSelectAndClose } = useDropdownContext();
|
|
15
|
+
const handleSelect = (event) => {
|
|
16
|
+
if (onSelect)
|
|
17
|
+
onSelect(event);
|
|
18
|
+
handleSelectAndClose(event);
|
|
19
|
+
};
|
|
20
|
+
return (_jsx(StyledItemWrapper, { children: _jsx(StyledItem, { onSelect: handleSelect, disabled: disabled, ...props, className: clsx(DROPDOWN_ELEMENT_CLASSES.ITEM, className, selected && 'dropdown-item-selected'), "data-test": disabled ? 'dropdown-item-disabled' : 'dropdown-item', children: _jsxs(StyledItemRow, { children: [icon && _jsx(StyledIconWrapper, { children: icon }), _jsxs(StyledContentWrapper, { children: [_jsx(StyledItemTitle, { children: children }), description && _jsx(StyledDescription, { children: description })] }), (trailingIcon || selected) && (_jsxs(StyledIconWrapper, { children: [trailingIcon, !trailingIcon && selected && _jsx(CheckIcon, { size: "16", color: theme.color.neutral.text })] })), tags.length > 0 && (_jsx(StyledTagWrapper, { onClick: (e) => e.stopPropagation(), children: tags }))] }) }) }));
|
|
21
|
+
};
|
|
22
|
+
const DropdownCheckboxItem = ({ checked, children, icon, trailingIcon, onCheckedChange, description, onSelect, disabled, className, ...props }) => {
|
|
23
|
+
const { handleSelectAndClose } = useDropdownContext();
|
|
24
|
+
const handleSelect = (event) => {
|
|
25
|
+
if (disabled)
|
|
26
|
+
return;
|
|
27
|
+
if (onSelect)
|
|
28
|
+
onSelect(event);
|
|
29
|
+
handleSelectAndClose(event);
|
|
30
|
+
};
|
|
31
|
+
return (_jsx(StyledItemWrapper, { children: _jsx(StyledCheckboxItem, { checked: checked, onSelect: handleSelect, disabled: disabled, ...props, onCheckedChange: disabled ? undefined : onCheckedChange, className: clsx(className), "data-test": disabled ? 'dropdown-item-disabled' : 'dropdown-item', children: _jsxs(StyledItemRow, { children: [_jsx(StyledCheckboxIconWrapper, { children: _jsx(CheckboxPrimitive, { value: !!checked, setValue: disabled ? () => undefined : onCheckedChange || (() => undefined), readOnly: disabled || !onCheckedChange }) }), icon && _jsx(StyledIconWrapper, { children: icon }), _jsxs(StyledContentWrapper, { children: [_jsx(StyledItemTitle, { children: children }), description && _jsx(StyledDescription, { children: description })] }), trailingIcon && _jsx(StyledIconWrapper, { children: trailingIcon })] }) }) }));
|
|
32
|
+
};
|
|
33
|
+
// --- Radio group: self-contained, uses radioButtonStyle from radio_button component ---
|
|
34
|
+
const StyledRadioGroupRoot = styled(RadioGroupPrimitive.Root) `
|
|
35
|
+
display: flex;
|
|
36
|
+
flex-direction: column;
|
|
37
|
+
`;
|
|
38
|
+
const StyledRadioGroupItem = styled(RadioGroupPrimitive.Item) `
|
|
39
|
+
${radioButtonStyle}
|
|
40
|
+
flex-shrink: 0;
|
|
41
|
+
`;
|
|
42
|
+
const DropdownRadioOptionLabel = ({ label, description }) => (_jsxs(_Fragment, { children: [_jsx(StyledItemTitle, { children: label }), description && _jsx(StyledDescription, { title: description, children: description })] }));
|
|
43
|
+
const DropdownRadioOption = ({ option, isSelected, onSelect, children }) => (_jsx("div", { className: clsx(DROPDOWN_ELEMENT_CLASSES.RADIO_OPTION, option.disabled && DROPDOWN_ELEMENT_CLASSES.RADIO_OPTION_DISABLED, isSelected && DROPDOWN_ELEMENT_CLASSES.RADIO_OPTION_SELECTED), onClick: onSelect, "aria-disabled": option.disabled, children: children }));
|
|
44
|
+
const DropdownRadioGroup = ({ options, value, setValue }) => {
|
|
45
|
+
const { handleSelectAndClose } = useDropdownContext();
|
|
46
|
+
const handleSelect = (newValue) => {
|
|
47
|
+
setValue(newValue);
|
|
48
|
+
handleSelectAndClose();
|
|
49
|
+
};
|
|
50
|
+
return (_jsx(StyledItemWrapper, { children: _jsx(StyledRadioGroupRoot, { value: value, onValueChange: handleSelect, children: options.map((option) => (_jsxs(DropdownRadioOption, { option: option, isSelected: option.value === value, onSelect: option.disabled ? undefined : () => handleSelect(option.value), children: [_jsx("span", { className: DROPDOWN_ELEMENT_CLASSES.RADIO_OPTION_ICON, children: _jsx(StyledRadioGroupItem, { value: option.value, id: option.value, disabled: option.disabled, onClick: (e) => e.stopPropagation() }) }), _jsx("span", { className: DROPDOWN_ELEMENT_CLASSES.RADIO_OPTION_CONTENT, children: _jsx(DropdownRadioOptionLabel, { label: option.label, description: option.description }) })] }, option.value))) }) }));
|
|
51
|
+
};
|
|
52
|
+
const DropdownLabel = (props) => _jsx(StyledLabel, { ...props });
|
|
53
|
+
const DropdownControls = (props) => {
|
|
54
|
+
return _jsx(StyledControls, { children: props.children });
|
|
55
|
+
};
|
|
56
|
+
const DropdownSeparator = (props) => (_jsx(StyledSeparator, { ...props }));
|
|
57
|
+
export const Dropdown = Object.assign(DropdownRoot, {
|
|
58
|
+
Item: DropdownItem,
|
|
59
|
+
CheckboxItem: DropdownCheckboxItem,
|
|
60
|
+
Label: DropdownLabel,
|
|
61
|
+
RadioGroup: DropdownRadioGroup,
|
|
62
|
+
Controls: DropdownControls,
|
|
63
|
+
Separator: DropdownSeparator,
|
|
64
|
+
});
|
|
65
|
+
//# sourceMappingURL=dropdown.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../../src/components/dropdown/dropdown.tsx"],"names":[],"mappings":"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"}
|