@agility/plenum-ui 2.0.0-rc46 → 2.0.0-rc47
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/.eslintrc.json +6 -6
- package/.prettierrc +13 -13
- package/.storybook/Layout.jsx +12 -12
- package/.storybook/head.tsx +4 -4
- package/.storybook/main.ts +18 -18
- package/.storybook/manager-head.html +1 -1
- package/.storybook/manager.ts +25 -25
- package/.storybook/plenumTheme.ts +8 -8
- package/.storybook/preview-head.html +3 -3
- package/.storybook/preview.tsx +28 -28
- package/.vscode/settings.json +3 -3
- package/README.md +271 -271
- package/app/globals.css +99 -99
- package/app/head.tsx +59 -59
- package/app/layout.tsx +28 -28
- package/app/page.tsx +7 -7
- package/build.js +45 -45
- package/dist/index.d.ts +231 -231
- package/dist/index.js.map +2 -2
- package/dist/tailwind.css +58 -0
- package/dist/types/stories/organisms/DropdownComponent/DropdownComponent.d.ts +1 -1
- package/local.sh +100 -100
- package/next.config.js +8 -8
- package/package.json +83 -83
- package/pages/api/hello.ts +13 -13
- package/postcss.config.js +6 -6
- package/rollup.config.mjs +41 -41
- package/scripts/create-component.js +97 -97
- package/stories/Introduction.mdx +314 -314
- package/stories/assets/stackalt.svg +1 -1
- package/stories/atoms/Avatar/Avatar.stories.tsx +96 -96
- package/stories/atoms/Avatar/Avatar.tsx +123 -123
- package/stories/atoms/Avatar/index.ts +3 -3
- package/stories/atoms/badges/Badge.tsx +127 -127
- package/stories/atoms/badges/Pill/Pill.stories.tsx +75 -75
- package/stories/atoms/badges/Rounded/Rounded.stories.tsx +75 -75
- package/stories/atoms/badges/index.ts +3 -3
- package/stories/atoms/buttons/Button/Alternative/Alternative.stories.ts +86 -86
- package/stories/atoms/buttons/Button/Button.tsx +232 -232
- package/stories/atoms/buttons/Button/Danger/Danger.stories.ts +90 -90
- package/stories/atoms/buttons/Button/Primary/Primary.stories.ts +97 -97
- package/stories/atoms/buttons/Button/Secondary/Secondary.stories.ts +93 -93
- package/stories/atoms/buttons/Button/defaultArgs.ts +9 -9
- package/stories/atoms/buttons/Button/index.ts +3 -3
- package/stories/atoms/buttons/Capsule/Alternative/Alternative.stories.ts +27 -27
- package/stories/atoms/buttons/Capsule/Capsule.tsx +88 -88
- package/stories/atoms/buttons/Capsule/Danger/Danger.stories.ts +27 -27
- package/stories/atoms/buttons/Capsule/Primary/Primary.stories.ts +27 -27
- package/stories/atoms/buttons/Capsule/Secondary/Secondary.stories.ts +27 -27
- package/stories/atoms/buttons/Capsule/index.ts +3 -3
- package/stories/atoms/buttons/FloatingActionButton/FloatingActionButton.stories.tsx +15 -15
- package/stories/atoms/buttons/FloatingActionButton/FloatingActionButton.tsx +22 -22
- package/stories/atoms/buttons/FloatingActionButton/index.tsx +3 -3
- package/stories/atoms/buttons/index.ts +4 -4
- package/stories/atoms/crumb/Crumb.stories.tsx +18 -18
- package/stories/atoms/crumb/Crumb.tsx +22 -22
- package/stories/atoms/crumb/index.tsx +3 -3
- package/stories/atoms/icons/DynamicIcon.stories.ts +43 -43
- package/stories/atoms/icons/DynamicIcon.tsx +90 -90
- package/stories/atoms/icons/IconWithShadow.stories.ts +43 -43
- package/stories/atoms/icons/IconWithShadow.tsx +16 -16
- package/stories/atoms/icons/TablerIcon.tsx +22 -22
- package/stories/atoms/icons/index.tsx +14 -14
- package/stories/atoms/icons/tablerIconNames.ts +4336 -4336
- package/stories/atoms/index.ts +46 -46
- package/stories/atoms/loaders/Loader.stories.ts +15 -15
- package/stories/atoms/loaders/Loader.tsx +21 -21
- package/stories/atoms/loaders/NProgress/RadialProgress.stories.tsx +19 -19
- package/stories/atoms/loaders/NProgress/RadialProgress.tsx +74 -74
- package/stories/atoms/loaders/NProgress/index.ts +3 -3
- package/stories/atoms/loaders/index.ts +4 -4
- package/stories/index.ts +136 -136
- package/stories/molecules/index.ts +51 -51
- package/stories/molecules/inputs/InputCounter/InputCounter.stories.tsx +18 -18
- package/stories/molecules/inputs/InputCounter/InputCounter.tsx +24 -24
- package/stories/molecules/inputs/InputCounter/index.tsx +3 -3
- package/stories/molecules/inputs/InputField/InputField.stories.tsx +29 -29
- package/stories/molecules/inputs/InputField/InputField.tsx +96 -96
- package/stories/molecules/inputs/InputField/index.tsx +3 -3
- package/stories/molecules/inputs/InputLabel/InputLabel.stories.tsx +19 -19
- package/stories/molecules/inputs/InputLabel/InputLabel.tsx +45 -45
- package/stories/molecules/inputs/InputLabel/index.tsx +3 -3
- package/stories/molecules/inputs/NestedInputButton/NestedInputButton.stories.tsx +52 -52
- package/stories/molecules/inputs/NestedInputButton/NestedInputButton.tsx +64 -64
- package/stories/molecules/inputs/NestedInputButton/index.tsx +3 -3
- package/stories/molecules/inputs/TextInput/TextInput.stories.tsx +32 -32
- package/stories/molecules/inputs/TextInput/TextInput.tsx +165 -165
- package/stories/molecules/inputs/TextInput/index.tsx +5 -5
- package/stories/molecules/inputs/checkbox/Checkbox.stories.ts +23 -23
- package/stories/molecules/inputs/checkbox/Checkbox.tsx +98 -98
- package/stories/molecules/inputs/checkbox/index.ts +3 -3
- package/stories/molecules/inputs/combobox/ComboBox.stories.ts +41 -41
- package/stories/molecules/inputs/combobox/ComboBox.tsx +185 -185
- package/stories/molecules/inputs/combobox/index.ts +3 -3
- package/stories/molecules/inputs/index.ts +38 -38
- package/stories/molecules/inputs/radio/Radio.stories.ts +27 -27
- package/stories/molecules/inputs/radio/Radio.tsx +92 -92
- package/stories/molecules/inputs/radio/index.ts +3 -3
- package/stories/molecules/inputs/select/Select.stories.ts +23 -23
- package/stories/molecules/inputs/select/Select.tsx +100 -100
- package/stories/molecules/inputs/select/index.ts +3 -3
- package/stories/molecules/inputs/textArea/TextArea.stories.ts +22 -22
- package/stories/molecules/inputs/textArea/TextArea.tsx +158 -158
- package/stories/molecules/inputs/textArea/index.ts +3 -3
- package/stories/molecules/inputs/toggleSwitch/ToggleSwitch.stories.tsx +118 -118
- package/stories/molecules/inputs/toggleSwitch/ToggleSwitch.tsx +81 -81
- package/stories/molecules/inputs/toggleSwitch/index.ts +3 -3
- package/stories/molecules/tabs/Tabs.stories.tsx +18 -18
- package/stories/molecules/tabs/Tabs.tsx +22 -22
- package/stories/molecules/tabs/index.tsx +2 -2
- package/stories/organisms/AnimatedLabelInput/AnimatedLabelInput.stories.tsx +30 -30
- package/stories/organisms/AnimatedLabelInput/AnimatedLabelInput.tsx +66 -66
- package/stories/organisms/AnimatedLabelInput/index.tsx +3 -3
- package/stories/organisms/AnimatedLabelTextArea/AnimatedLabelTextArea.stories.tsx +26 -26
- package/stories/organisms/AnimatedLabelTextArea/AnimatedLabelTextArea.tsx +61 -61
- package/stories/organisms/AnimatedLabelTextArea/index.tsx +3 -3
- package/stories/organisms/ButtonDropdown/ButtonDropdown.stories.tsx +125 -125
- package/stories/organisms/ButtonDropdown/ButtonDropdown.tsx +86 -86
- package/stories/organisms/ButtonDropdown/index.tsx +3 -3
- package/stories/organisms/DropdownComponent/Dropdown.stories.tsx +73 -49
- package/stories/organisms/DropdownComponent/DropdownComponent.tsx +346 -347
- package/stories/organisms/DropdownComponent/dropdownItems.ts +122 -122
- package/stories/organisms/DropdownComponent/index.ts +4 -4
- package/stories/organisms/EmptySectionPlaceholder/EmptySectionPlaceholder.stories.tsx +76 -76
- package/stories/organisms/EmptySectionPlaceholder/EmptySectionPlaceholder.tsx +52 -52
- package/stories/organisms/EmptySectionPlaceholder/index.tsx +4 -4
- package/stories/organisms/FormInputWithAddons/FormInputWithAddons.stories.tsx +29 -29
- package/stories/organisms/FormInputWithAddons/FormInputWithAddons.tsx +145 -145
- package/stories/organisms/FormInputWithAddons/index.tsx +3 -3
- package/stories/organisms/TextInputSelect/InputSelect.tsx +59 -59
- package/stories/organisms/TextInputSelect/TextInputSelect.stories.tsx +33 -33
- package/stories/organisms/TextInputSelect/TextInputSelect.tsx +186 -186
- package/stories/organisms/TextInputSelect/index.tsx +3 -3
- package/stories/organisms/index.ts +27 -27
- package/tailwind.config.js +192 -192
- package/tsconfig.json +29 -29
- package/tsconfig.lib.json +25 -25
- package/utils/types.d.ts +2 -2
- package/utils/types.ts +3 -3
- package/utils/useId.d.ts +1 -1
- package/utils/useId.tsx +16 -16
package/.eslintrc.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
{
|
|
2
|
-
"extends": [
|
|
3
|
-
"next/core-web-vitals",
|
|
4
|
-
"plugin:storybook/recommended"
|
|
5
|
-
]
|
|
6
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"extends": [
|
|
3
|
+
"next/core-web-vitals",
|
|
4
|
+
"plugin:storybook/recommended"
|
|
5
|
+
]
|
|
6
|
+
}
|
package/.prettierrc
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
{
|
|
2
|
-
"singleQuote": false,
|
|
3
|
-
"printWidth": 120,
|
|
4
|
-
"editor.formatOnSave": true,
|
|
5
|
-
"proseWrap": "preserve",
|
|
6
|
-
"tabWidth": 4,
|
|
7
|
-
"requireConfig": false,
|
|
8
|
-
"useTabs": true,
|
|
9
|
-
"trailingComma": "none",
|
|
10
|
-
"bracketSpacing": true,
|
|
11
|
-
"jsxBracketSameLine": false,
|
|
12
|
-
"semi": false
|
|
13
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"singleQuote": false,
|
|
3
|
+
"printWidth": 120,
|
|
4
|
+
"editor.formatOnSave": true,
|
|
5
|
+
"proseWrap": "preserve",
|
|
6
|
+
"tabWidth": 4,
|
|
7
|
+
"requireConfig": false,
|
|
8
|
+
"useTabs": true,
|
|
9
|
+
"trailingComma": "none",
|
|
10
|
+
"bracketSpacing": true,
|
|
11
|
+
"jsxBracketSameLine": false,
|
|
12
|
+
"semi": false
|
|
13
|
+
}
|
package/.storybook/Layout.jsx
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import React from "react"
|
|
2
|
-
import "../lib/tailwind.css"
|
|
3
|
-
|
|
4
|
-
const Layout = ({ children }) => {
|
|
5
|
-
return (
|
|
6
|
-
<div className="p5 min-w-[320px] font-mulish">
|
|
7
|
-
<div className="flex items-center justify-center">{children}</div>
|
|
8
|
-
</div>
|
|
9
|
-
)
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
export default Layout
|
|
1
|
+
import React from "react"
|
|
2
|
+
import "../lib/tailwind.css"
|
|
3
|
+
|
|
4
|
+
const Layout = ({ children }) => {
|
|
5
|
+
return (
|
|
6
|
+
<div className="p5 min-w-[320px] font-mulish">
|
|
7
|
+
<div className="flex items-center justify-center">{children}</div>
|
|
8
|
+
</div>
|
|
9
|
+
)
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
export default Layout
|
package/.storybook/head.tsx
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
;<link
|
|
2
|
-
href="https://fonts.googleapis.com/css2?family=Mulish:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&display=swap"
|
|
3
|
-
rel="stylesheet"
|
|
4
|
-
></link>
|
|
1
|
+
;<link
|
|
2
|
+
href="https://fonts.googleapis.com/css2?family=Mulish:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&display=swap"
|
|
3
|
+
rel="stylesheet"
|
|
4
|
+
></link>
|
package/.storybook/main.ts
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
const path = require("path")
|
|
2
|
-
module.exports = {
|
|
3
|
-
stories: ["../stories/**/*.mdx", "../stories/**/*.stories.@(js|jsx|ts|tsx)"],
|
|
4
|
-
addons: [
|
|
5
|
-
"@storybook/addon-links",
|
|
6
|
-
"@storybook/addon-essentials",
|
|
7
|
-
"@storybook/addon-interactions",
|
|
8
|
-
"@storybook/addon-designs"
|
|
9
|
-
],
|
|
10
|
-
framework: {
|
|
11
|
-
name: "@storybook/nextjs",
|
|
12
|
-
options: {}
|
|
13
|
-
},
|
|
14
|
-
staticDirs: ["../public"],
|
|
15
|
-
docs: {
|
|
16
|
-
autodocs: "tag"
|
|
17
|
-
}
|
|
18
|
-
}
|
|
1
|
+
const path = require("path")
|
|
2
|
+
module.exports = {
|
|
3
|
+
stories: ["../stories/**/*.mdx", "../stories/**/*.stories.@(js|jsx|ts|tsx)"],
|
|
4
|
+
addons: [
|
|
5
|
+
"@storybook/addon-links",
|
|
6
|
+
"@storybook/addon-essentials",
|
|
7
|
+
"@storybook/addon-interactions",
|
|
8
|
+
"@storybook/addon-designs"
|
|
9
|
+
],
|
|
10
|
+
framework: {
|
|
11
|
+
name: "@storybook/nextjs",
|
|
12
|
+
options: {}
|
|
13
|
+
},
|
|
14
|
+
staticDirs: ["../public"],
|
|
15
|
+
docs: {
|
|
16
|
+
autodocs: "tag"
|
|
17
|
+
}
|
|
18
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
<link rel="shortcut icon" href="https://static.agilitycms.com/favicon/purple/128.png">
|
|
1
|
+
<link rel="shortcut icon" href="https://static.agilitycms.com/favicon/purple/128.png">
|
package/.storybook/manager.ts
CHANGED
|
@@ -1,25 +1,25 @@
|
|
|
1
|
-
// .storybook/manager.js
|
|
2
|
-
|
|
3
|
-
import { addons } from "@storybook/manager-api"
|
|
4
|
-
import plenumTheme from "./plenumTheme"
|
|
5
|
-
|
|
6
|
-
addons.setConfig({
|
|
7
|
-
isFullscreen: false,
|
|
8
|
-
showNav: true,
|
|
9
|
-
showPanel: true,
|
|
10
|
-
panelPosition: "bottom",
|
|
11
|
-
enableShortcuts: true,
|
|
12
|
-
showToolbar: true,
|
|
13
|
-
theme: plenumTheme,
|
|
14
|
-
sidebar: {
|
|
15
|
-
showRoots: false,
|
|
16
|
-
collapsedRoots: ["other", "plenum"]
|
|
17
|
-
},
|
|
18
|
-
toolbar: {
|
|
19
|
-
title: { hidden: false },
|
|
20
|
-
zoom: { hidden: false },
|
|
21
|
-
eject: { hidden: false },
|
|
22
|
-
copy: { hidden: false },
|
|
23
|
-
fullscreen: { hidden: false }
|
|
24
|
-
}
|
|
25
|
-
})
|
|
1
|
+
// .storybook/manager.js
|
|
2
|
+
|
|
3
|
+
import { addons } from "@storybook/manager-api"
|
|
4
|
+
import plenumTheme from "./plenumTheme"
|
|
5
|
+
|
|
6
|
+
addons.setConfig({
|
|
7
|
+
isFullscreen: false,
|
|
8
|
+
showNav: true,
|
|
9
|
+
showPanel: true,
|
|
10
|
+
panelPosition: "bottom",
|
|
11
|
+
enableShortcuts: true,
|
|
12
|
+
showToolbar: true,
|
|
13
|
+
theme: plenumTheme,
|
|
14
|
+
sidebar: {
|
|
15
|
+
showRoots: false,
|
|
16
|
+
collapsedRoots: ["other", "plenum"]
|
|
17
|
+
},
|
|
18
|
+
toolbar: {
|
|
19
|
+
title: { hidden: false },
|
|
20
|
+
zoom: { hidden: false },
|
|
21
|
+
eject: { hidden: false },
|
|
22
|
+
copy: { hidden: false },
|
|
23
|
+
fullscreen: { hidden: false }
|
|
24
|
+
}
|
|
25
|
+
})
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { create } from "@storybook/theming"
|
|
2
|
-
|
|
3
|
-
export default create({
|
|
4
|
-
base: "light",
|
|
5
|
-
brandTitle: "Agility Plenum UI",
|
|
6
|
-
brandUrl: "https://plenum-ui.vercel.app/",
|
|
7
|
-
brandImage: "https://cdn.agilitycms.com/content-manager/images/logos/agility-logo-storybook-350.png"
|
|
8
|
-
})
|
|
1
|
+
import { create } from "@storybook/theming"
|
|
2
|
+
|
|
3
|
+
export default create({
|
|
4
|
+
base: "light",
|
|
5
|
+
brandTitle: "Agility Plenum UI",
|
|
6
|
+
brandUrl: "https://plenum-ui.vercel.app/",
|
|
7
|
+
brandImage: "https://cdn.agilitycms.com/content-manager/images/logos/agility-logo-storybook-350.png"
|
|
8
|
+
})
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
<!-- ./storybook/preview-head.html -->
|
|
2
|
-
<link href="/tailwind.css" rel="stylesheet" />
|
|
3
|
-
|
|
1
|
+
<!-- ./storybook/preview-head.html -->
|
|
2
|
+
<link href="/tailwind.css" rel="stylesheet" />
|
|
3
|
+
|
|
4
4
|
|
package/.storybook/preview.tsx
CHANGED
|
@@ -1,28 +1,28 @@
|
|
|
1
|
-
import { Preview } from "@storybook/react"
|
|
2
|
-
import Layout from "./Layout"
|
|
3
|
-
import React from "react"
|
|
4
|
-
|
|
5
|
-
const preview: Preview = {
|
|
6
|
-
parameters: {
|
|
7
|
-
options: {
|
|
8
|
-
storySort: {
|
|
9
|
-
order: ["atoms", "molecules", "organisms"]
|
|
10
|
-
}
|
|
11
|
-
},
|
|
12
|
-
actions: { argTypesRegex: "^on[A-Z].*" },
|
|
13
|
-
controls: {
|
|
14
|
-
matchers: {
|
|
15
|
-
color: /(background|color)$/i,
|
|
16
|
-
date: /Date$/
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
},
|
|
20
|
-
decorators: [
|
|
21
|
-
(Story) => (
|
|
22
|
-
<Layout>
|
|
23
|
-
<Story />
|
|
24
|
-
</Layout>
|
|
25
|
-
)
|
|
26
|
-
]
|
|
27
|
-
}
|
|
28
|
-
export default preview
|
|
1
|
+
import { Preview } from "@storybook/react"
|
|
2
|
+
import Layout from "./Layout"
|
|
3
|
+
import React from "react"
|
|
4
|
+
|
|
5
|
+
const preview: Preview = {
|
|
6
|
+
parameters: {
|
|
7
|
+
options: {
|
|
8
|
+
storySort: {
|
|
9
|
+
order: ["atoms", "molecules", "organisms"]
|
|
10
|
+
}
|
|
11
|
+
},
|
|
12
|
+
actions: { argTypesRegex: "^on[A-Z].*" },
|
|
13
|
+
controls: {
|
|
14
|
+
matchers: {
|
|
15
|
+
color: /(background|color)$/i,
|
|
16
|
+
date: /Date$/
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
},
|
|
20
|
+
decorators: [
|
|
21
|
+
(Story) => (
|
|
22
|
+
<Layout>
|
|
23
|
+
<Story />
|
|
24
|
+
</Layout>
|
|
25
|
+
)
|
|
26
|
+
]
|
|
27
|
+
}
|
|
28
|
+
export default preview
|
package/.vscode/settings.json
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
{
|
|
2
|
-
"typescript.tsdk": "node_modules/typescript/lib",
|
|
3
|
-
"typescript.enablePromptUseWorkspaceTsdk": true
|
|
1
|
+
{
|
|
2
|
+
"typescript.tsdk": "node_modules/typescript/lib",
|
|
3
|
+
"typescript.enablePromptUseWorkspaceTsdk": true
|
|
4
4
|
}
|