@qoretechnologies/reqore 0.55.13 → 0.56.1
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/dist/components/Button/index.d.ts +6 -0
- package/dist/components/Button/index.d.ts.map +1 -1
- package/dist/components/Button/index.js +3 -0
- package/dist/components/Button/index.js.map +1 -1
- package/dist/components/ControlGroup/index.d.ts.map +1 -1
- package/dist/components/ControlGroup/index.js +15 -3
- package/dist/components/ControlGroup/index.js.map +1 -1
- package/dist/components/DatePicker/index.d.ts.map +1 -1
- package/dist/components/DatePicker/index.js +1 -1
- package/dist/components/DatePicker/index.js.map +1 -1
- package/dist/components/Drawer/backdrop.d.ts.map +1 -1
- package/dist/components/Drawer/backdrop.js +1 -1
- package/dist/components/Drawer/backdrop.js.map +1 -1
- package/dist/components/Drawer/index.d.ts.map +1 -1
- package/dist/components/Drawer/index.js +2 -2
- package/dist/components/Drawer/index.js.map +1 -1
- package/dist/components/Dropdown/index.d.ts +1 -1
- package/dist/components/Dropdown/index.d.ts.map +1 -1
- package/dist/components/Dropdown/index.js +2 -2
- package/dist/components/Dropdown/index.js.map +1 -1
- package/dist/components/InternalPopover/index.d.ts +3 -0
- package/dist/components/InternalPopover/index.d.ts.map +1 -1
- package/dist/components/InternalPopover/index.js +33 -8
- package/dist/components/InternalPopover/index.js.map +1 -1
- package/dist/components/Menu/index.d.ts +4 -1
- package/dist/components/Menu/index.d.ts.map +1 -1
- package/dist/components/Panel/index.d.ts +3 -0
- package/dist/components/Panel/index.d.ts.map +1 -1
- package/dist/components/Panel/index.js +18 -3
- package/dist/components/Panel/index.js.map +1 -1
- package/dist/components/Popover/index.d.ts +3 -0
- package/dist/components/Popover/index.d.ts.map +1 -1
- package/dist/components/Popover/index.js +152 -43
- package/dist/components/Popover/index.js.map +1 -1
- package/dist/components/Table/index.d.ts.map +1 -1
- package/dist/components/Table/index.js +101 -81
- package/dist/components/Table/index.js.map +1 -1
- package/dist/components/Textarea/index.d.ts.map +1 -1
- package/dist/components/Textarea/index.js +1 -1
- package/dist/components/Textarea/index.js.map +1 -1
- package/dist/constants/sizes.d.ts +64 -2
- package/dist/constants/sizes.d.ts.map +1 -1
- package/dist/constants/sizes.js +99 -39
- package/dist/constants/sizes.js.map +1 -1
- package/dist/containers/ReqoreProvider.d.ts.map +1 -1
- package/dist/containers/ReqoreProvider.js +35 -21
- package/dist/containers/ReqoreProvider.js.map +1 -1
- package/dist/containers/UIProvider.d.ts +6 -0
- package/dist/containers/UIProvider.d.ts.map +1 -1
- package/dist/containers/UIProvider.js +4 -1
- package/dist/containers/UIProvider.js.map +1 -1
- package/dist/helpers/utils.d.ts.map +1 -1
- package/dist/helpers/utils.js +6 -0
- package/dist/helpers/utils.js.map +1 -1
- package/dist/hooks/useLatestZIndex.d.ts.map +1 -1
- package/dist/hooks/useLatestZIndex.js +1 -1
- package/dist/hooks/useLatestZIndex.js.map +1 -1
- package/dist/hooks/useReqoreContext.d.ts.map +1 -1
- package/dist/hooks/useReqoreContext.js +1 -2
- package/dist/hooks/useReqoreContext.js.map +1 -1
- package/dist/index.d.ts +5 -5
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -2
- package/dist/index.js.map +1 -1
- package/docs/docs/components/button.mdx +391 -0
- package/docs/docs/components/input.mdx +328 -0
- package/docs/docs/components/panel.mdx +442 -0
- package/docs/docs/components/table.mdx +872 -0
- package/docs/docs/guides/effects.mdx +586 -0
- package/docs/docs/guides/getting-started.mdx +164 -0
- package/docs/docs/guides/theming.mdx +252 -0
- package/docs/docs/intro.md +98 -0
- package/docs/sidebars.js +23 -0
- package/package.json +11 -3
- package/tests.json +1 -1
- package/typedoc.json +10 -0
|
@@ -4,7 +4,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
4
4
|
};
|
|
5
5
|
exports.__esModule = true;
|
|
6
6
|
exports.useReqoreProperty = void 0;
|
|
7
|
-
var react_1 = require("react");
|
|
8
7
|
var use_context_selector_1 = require("use-context-selector");
|
|
9
8
|
var ReqoreContext_1 = __importDefault(require("../context/ReqoreContext"));
|
|
10
9
|
var useReqoreProperty = function (property) {
|
|
@@ -14,7 +13,7 @@ var useReqoreProperty = function (property) {
|
|
|
14
13
|
}
|
|
15
14
|
return value[property];
|
|
16
15
|
});
|
|
17
|
-
return
|
|
16
|
+
return contextProperty;
|
|
18
17
|
};
|
|
19
18
|
exports.useReqoreProperty = useReqoreProperty;
|
|
20
19
|
//# sourceMappingURL=useReqoreContext.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useReqoreContext.js","sourceRoot":"","sources":["../../src/hooks/useReqoreContext.ts"],"names":[],"mappings":";;;;;;AAAA
|
|
1
|
+
{"version":3,"file":"useReqoreContext.js","sourceRoot":"","sources":["../../src/hooks/useReqoreContext.ts"],"names":[],"mappings":";;;;;;AAAA,6DAA0D;AAC1D,2EAAyE;AAElE,IAAM,iBAAiB,GAAG,UAC/B,QAAW;IAEX,IAAM,eAAe,GAAG,IAAA,yCAAkB,EAAC,0BAAa,EAAE,UAAC,KAAK;QAC9D,IAAI,CAAC,CAAC,QAAQ,IAAI,KAAK,CAAC,EAAE;YACxB,MAAM,IAAI,KAAK,CAAC,kCAA2B,QAAQ,eAAY,CAAC,CAAC;SAClE;QAED,OAAO,KAAK,CAAC,QAAQ,CAAC,CAAC;IACzB,CAAC,CAAC,CAAC;IAEH,OAAO,eAAe,CAAC;AACzB,CAAC,CAAC;AAZW,QAAA,iBAAiB,qBAY5B"}
|
package/dist/index.d.ts
CHANGED
|
@@ -17,7 +17,7 @@ export { ReqoreDropdownDivider, ReqoreDropdownItem } from './components/Dropdown
|
|
|
17
17
|
export { ReqoreEffect, ReqoreTextEffect } from './components/Effect';
|
|
18
18
|
export { ReqoreErrorBoundary } from './components/ErrorBoundary';
|
|
19
19
|
export { ReqoreModalsWrapper } from './components/GlobalModalsWrapper';
|
|
20
|
-
export {
|
|
20
|
+
export { ReqoreH1, ReqoreH2, ReqoreH3, ReqoreH4, ReqoreH5, ReqoreH6, ReqoreHeading, } from './components/Header';
|
|
21
21
|
export { default as ReqoreIcon } from './components/Icon';
|
|
22
22
|
export { default as ReqoreInput } from './components/Input';
|
|
23
23
|
export { ReqoreKeyValueTable } from './components/KeyValueTable';
|
|
@@ -38,14 +38,14 @@ export { default as ReqoreNotificationsWrapper } from './components/Notification
|
|
|
38
38
|
export { default as ReqoreNotification } from './components/Notifications/notification';
|
|
39
39
|
export { ReqorePagination } from './components/Paging';
|
|
40
40
|
export { ReqorePanel, ReqorePanelSkeleton } from './components/Panel';
|
|
41
|
-
export {
|
|
41
|
+
export { ReqoreP, ReqoreP as ReqoreParagraph } from './components/Paragraph';
|
|
42
42
|
export { ReqorePopover } from './components/Popover';
|
|
43
43
|
export { default as ReqoreRadioGroup } from './components/RadioGroup';
|
|
44
|
-
export {
|
|
44
|
+
export { ReqoreRichTextEditor } from './components/RichTextEditor';
|
|
45
45
|
export { ReqoreSkeleton } from './components/Skeleton';
|
|
46
46
|
export { ReqoreSlider } from './components/Slider';
|
|
47
47
|
export { ReqoreHorizontalSpacer, ReqoreSpacer, ReqoreVerticalSpacer } from './components/Spacer';
|
|
48
|
-
export {
|
|
48
|
+
export { ReqoreSpan } from './components/Span';
|
|
49
49
|
export { ReqoreSpinner } from './components/Spinner';
|
|
50
50
|
export { default as ReqoreTable } from './components/Table';
|
|
51
51
|
export { ReqoreTableBodyCell } from './components/Table/cell';
|
|
@@ -66,7 +66,7 @@ export { Colors as ReqoreColors } from './constants/colors';
|
|
|
66
66
|
export { ReqoreSizes } from './constants/sizes';
|
|
67
67
|
export { ReqoreIntents } from './constants/theme';
|
|
68
68
|
export { ReqorePaginationContainer } from './containers/Paging';
|
|
69
|
-
export {
|
|
69
|
+
export { default as ReqoreNotifications, modalStore } from './containers/ReqoreProvider';
|
|
70
70
|
export { default as ReqoreUIProvider } from './containers/UIProvider';
|
|
71
71
|
export { default as ReqoreContext } from './context/ReqoreContext';
|
|
72
72
|
export { default as ReqoreThemeContext } from './context/ThemeContext';
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,+BAA+B,CAAC;AACjF,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAC3D,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;AAC1E,cAAc,yBAAyB,CAAC;AACxC,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AACnD,OAAO,EAAE,cAAc,EAAE,MAAM,8BAA8B,CAAC;AAC9D,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,EAAE,qBAAqB,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AACvF,OAAO,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACrE,OAAO,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,EAAE,mBAAmB,EAAE,MAAM,kCAAkC,CAAC;AACvE,OAAO,EACL,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"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"}
|
package/dist/index.js
CHANGED
|
@@ -15,7 +15,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
|
15
15
|
};
|
|
16
16
|
exports.__esModule = true;
|
|
17
17
|
exports.ReqoreParagraph = exports.ReqoreP = exports.ReqorePanelSkeleton = exports.ReqorePanel = exports.ReqorePagination = exports.ReqoreNotification = exports.ReqoreNotificationsWrapper = exports.ReqoreNavbarItem = exports.ReqoreNavbarGroup = exports.ReqoreNavbarDivider = exports.ReqoreHeader = exports.ReqoreFooter = exports.ReqoreMultiSelect = exports.ReqoreModal = exports.ReqoreMessage = exports.ReqoreMenuSection = exports.ReqoreMenuItem = exports.ReqoreMenuDivider = exports.ReqoreMenu = exports.ReqoreLayoutContent = exports.ReqoreKeyValueTable = exports.ReqoreInput = exports.ReqoreIcon = exports.ReqoreHeading = exports.ReqoreH6 = exports.ReqoreH5 = exports.ReqoreH4 = exports.ReqoreH3 = exports.ReqoreH2 = exports.ReqoreH1 = exports.ReqoreModalsWrapper = exports.ReqoreErrorBoundary = exports.ReqoreTextEffect = exports.ReqoreEffect = exports.ReqoreDropdownItem = exports.ReqoreDropdownDivider = exports.ReqoreDropdown = exports.ReqoreBackdrop = exports.ReqoreDrawer = exports.ReqoreControlGroup = exports.ReqoreContent = exports.ReqoreCommentFeed = exports.ReqoreComment = exports.ReqoreColumn = exports.ReqoreColumns = exports.ReqoreCollection = exports.ReqoreCheckbox = exports.ReqoreButton = exports.ReqoreBreadcrumbsItem = exports.ReqoreBreadcrumbs = void 0;
|
|
18
|
-
exports.useReqoreTheme = exports.useReqoreProperty = exports.useReqore = exports.useReqorePaging = exports.useLatestZIndex = exports.useCloneThroughFragments = exports.ReqoreThemeContext = exports.ReqoreContext = exports.ReqoreUIProvider = exports.
|
|
18
|
+
exports.useReqoreTheme = exports.useReqoreProperty = exports.useReqore = exports.useReqorePaging = exports.useLatestZIndex = exports.useCloneThroughFragments = exports.ReqoreThemeContext = exports.ReqoreContext = exports.ReqoreUIProvider = exports.modalStore = exports.ReqoreNotifications = exports.ReqorePaginationContainer = exports.ReqoreIntents = exports.ReqoreSizes = exports.ReqoreColors = exports.ReqoreTree = exports.ReqoreTimeAgo = exports.ReqoreTier = exports.ReqoreTextarea = exports.ReqoreTagGroup = exports.ReqoreTag = exports.ReqoreTabsList = exports.ReqoreTabsListItem = exports.ReqoreTabsContent = exports.ReqoreTabs = exports.ReqoreTableValue = exports.ReqoreTableRow = exports.ReqoreTableHeaderCell = exports.ReqoreTableBodyCell = exports.ReqoreTable = exports.ReqoreSpinner = exports.ReqoreSpan = exports.ReqoreVerticalSpacer = exports.ReqoreSpacer = exports.ReqoreHorizontalSpacer = exports.ReqoreSlider = exports.ReqoreSkeleton = exports.ReqoreRichTextEditor = exports.ReqoreRadioGroup = exports.ReqorePopover = void 0;
|
|
19
19
|
var Breadcrumbs_1 = require("./components/Breadcrumbs");
|
|
20
20
|
__createBinding(exports, Breadcrumbs_1, "default", "ReqoreBreadcrumbs");
|
|
21
21
|
var item_1 = require("./components/Breadcrumbs/item");
|
|
@@ -164,8 +164,8 @@ __createBinding(exports, theme_1, "ReqoreIntents");
|
|
|
164
164
|
var Paging_2 = require("./containers/Paging");
|
|
165
165
|
__createBinding(exports, Paging_2, "ReqorePaginationContainer");
|
|
166
166
|
var ReqoreProvider_1 = require("./containers/ReqoreProvider");
|
|
167
|
-
__createBinding(exports, ReqoreProvider_1, "modalStore");
|
|
168
167
|
__createBinding(exports, ReqoreProvider_1, "default", "ReqoreNotifications");
|
|
168
|
+
__createBinding(exports, ReqoreProvider_1, "modalStore");
|
|
169
169
|
var UIProvider_1 = require("./containers/UIProvider");
|
|
170
170
|
__createBinding(exports, UIProvider_1, "default", "ReqoreUIProvider");
|
|
171
171
|
var ReqoreContext_1 = require("./context/ReqoreContext");
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA,wDAAwE;AAA/D,wEAA4B;AACrC,sDAAiF;AAAxE,qEAAgC;AACzC,8CAA8D;AAArD,8DAAuB;AAChC,kDAAkE;AAAzD,kEAAyB;AAClC,sDAA2D;AAAlD,2DAAgB;AACzB,gDAAqD;AAA5C,qDAAa;AACtB,sDAA2D;AAAlD,mDAAY;AACrB,gDAAqD;AAA5C,qDAAa;AACtB,wDAA6D;AAApD,6DAAiB;AAC1B,gDAAgE;AAAvD,gEAAwB;AACjC,0DAA0E;AAAjE,0EAA6B;AACtC,0DAAwC;AACxC,8CAAmD;AAA1C,mDAAY;AACrB,yDAA8D;AAArD,uDAAc;AACvB,kDAAkE;AAAzD,kEAAyB;AAClC,mDAAuF;AAA9E,0DAAqB;AAAE,uDAAkB;AAClD,8CAAqE;AAA5D,mDAAY;AAAE,uDAAgB;AACvC,4DAAiE;AAAxD,iEAAmB;AAC5B,wEAAuE;AAA9D,uEAAmB;AAC5B,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,391 @@
|
|
|
1
|
+
---
|
|
2
|
+
sidebar_position: 1
|
|
3
|
+
---
|
|
4
|
+
|
|
5
|
+
import LiveDemo from '../../src/components/LiveDemo';
|
|
6
|
+
import { ReqoreButton, ReqoreControlGroup } from '../../../src';
|
|
7
|
+
|
|
8
|
+
# Button
|
|
9
|
+
|
|
10
|
+
Buttons allow users to take actions and make choices with a single tap.
|
|
11
|
+
|
|
12
|
+
## Props
|
|
13
|
+
|
|
14
|
+
| Prop | Type | Required | Default | Description |
|
|
15
|
+
| ------------- | -------------------- | -------- | ---------- | --------------------- |
|
|
16
|
+
| `children` | `ReactNode` | - | - | Button content |
|
|
17
|
+
| `onClick` | `function` | - | - | Click handler |
|
|
18
|
+
| `intent` | `TReqoreIntent` | - | - | Semantic color intent |
|
|
19
|
+
| `icon` | `IReqoreIconName` | - | - | Left icon name |
|
|
20
|
+
| `rightIcon` | `IReqoreIconName` | - | - | Right icon name |
|
|
21
|
+
| `size` | `TSizes` | - | `'normal'` | Button size |
|
|
22
|
+
| `flat` | `boolean` | - | `true` | Flat styling |
|
|
23
|
+
| `minimal` | `boolean` | - | `false` | Minimal styling |
|
|
24
|
+
| `disabled` | `boolean` | - | `false` | Disabled state |
|
|
25
|
+
| `loading` | `boolean` | - | `false` | Loading state |
|
|
26
|
+
| `active` | `boolean` | - | `false` | Active state |
|
|
27
|
+
| `fluid` | `boolean` | - | `false` | Full width |
|
|
28
|
+
| `badge` | `number \| object` | - | - | Badge content |
|
|
29
|
+
| `tooltip` | `string \| object` | - | - | Tooltip content |
|
|
30
|
+
| `effect` | `IReqoreEffect` | - | - | Visual effects |
|
|
31
|
+
| `customTheme` | `IReqoreCustomTheme` | - | - | Custom theme |
|
|
32
|
+
| `className` | `string` | - | - | CSS class name |
|
|
33
|
+
|
|
34
|
+
## Basic Usage
|
|
35
|
+
|
|
36
|
+
<LiveDemo>
|
|
37
|
+
<ReqoreButton onClick={() => alert('Clicked!')}>Click Me</ReqoreButton>
|
|
38
|
+
</LiveDemo>
|
|
39
|
+
|
|
40
|
+
```tsx
|
|
41
|
+
import { ReqoreButton } from '@qoretechnologies/reqore';
|
|
42
|
+
|
|
43
|
+
function Example() {
|
|
44
|
+
return <ReqoreButton onClick={() => alert('Clicked!')}>Click Me</ReqoreButton>;
|
|
45
|
+
}
|
|
46
|
+
```
|
|
47
|
+
|
|
48
|
+
## With Intent
|
|
49
|
+
|
|
50
|
+
Use the `intent` prop to convey meaning:
|
|
51
|
+
|
|
52
|
+
<LiveDemo>
|
|
53
|
+
<ReqoreControlGroup>
|
|
54
|
+
<ReqoreButton intent='info'>Info</ReqoreButton>
|
|
55
|
+
<ReqoreButton intent='success'>Success</ReqoreButton>
|
|
56
|
+
<ReqoreButton intent='warning'>Warning</ReqoreButton>
|
|
57
|
+
<ReqoreButton intent='danger'>Danger</ReqoreButton>
|
|
58
|
+
</ReqoreControlGroup>
|
|
59
|
+
</LiveDemo>
|
|
60
|
+
|
|
61
|
+
```tsx
|
|
62
|
+
import { ReqoreButton, ReqoreControlGroup } from '@qoretechnologies/reqore';
|
|
63
|
+
|
|
64
|
+
function IntentExample() {
|
|
65
|
+
return (
|
|
66
|
+
<ReqoreControlGroup>
|
|
67
|
+
<ReqoreButton intent='info'>Info</ReqoreButton>
|
|
68
|
+
<ReqoreButton intent='success'>Success</ReqoreButton>
|
|
69
|
+
<ReqoreButton intent='warning'>Warning</ReqoreButton>
|
|
70
|
+
<ReqoreButton intent='danger'>Danger</ReqoreButton>
|
|
71
|
+
</ReqoreControlGroup>
|
|
72
|
+
);
|
|
73
|
+
}
|
|
74
|
+
```
|
|
75
|
+
|
|
76
|
+
## With Icons
|
|
77
|
+
|
|
78
|
+
Add icons using the `icon` prop (uses Remix Icons):
|
|
79
|
+
|
|
80
|
+
<LiveDemo>
|
|
81
|
+
<ReqoreControlGroup>
|
|
82
|
+
<ReqoreButton icon='CheckLine'>Success</ReqoreButton>
|
|
83
|
+
<ReqoreButton icon='DeleteBinLine' rightIcon='ArrowRightLine'>
|
|
84
|
+
Delete and Next
|
|
85
|
+
</ReqoreButton>
|
|
86
|
+
<ReqoreButton icon='Settings4Line' />
|
|
87
|
+
</ReqoreControlGroup>
|
|
88
|
+
</LiveDemo>
|
|
89
|
+
|
|
90
|
+
```tsx
|
|
91
|
+
<ReqoreButton icon="CheckLine">
|
|
92
|
+
Success
|
|
93
|
+
</ReqoreButton>
|
|
94
|
+
|
|
95
|
+
<ReqoreButton icon="DeleteBinLine" rightIcon="ArrowRightLine">
|
|
96
|
+
Delete and Next
|
|
97
|
+
</ReqoreButton>
|
|
98
|
+
|
|
99
|
+
{/* Icon only button */}
|
|
100
|
+
<ReqoreButton icon="Settings4Line" />
|
|
101
|
+
```
|
|
102
|
+
|
|
103
|
+
## Sizes
|
|
104
|
+
|
|
105
|
+
<LiveDemo center>
|
|
106
|
+
<ReqoreControlGroup>
|
|
107
|
+
<ReqoreButton size='micro'>Micro</ReqoreButton>
|
|
108
|
+
<ReqoreButton size='tiny'>Tiny</ReqoreButton>
|
|
109
|
+
<ReqoreButton size='small'>Small</ReqoreButton>
|
|
110
|
+
<ReqoreButton size='normal'>Normal</ReqoreButton>
|
|
111
|
+
<ReqoreButton size='big'>Big</ReqoreButton>
|
|
112
|
+
<ReqoreButton size='huge'>Huge</ReqoreButton>
|
|
113
|
+
<ReqoreButton size='massive'>Massive</ReqoreButton>
|
|
114
|
+
</ReqoreControlGroup>
|
|
115
|
+
</LiveDemo>
|
|
116
|
+
|
|
117
|
+
```tsx
|
|
118
|
+
<ReqoreControlGroup>
|
|
119
|
+
<ReqoreButton size='micro'>Micro</ReqoreButton>
|
|
120
|
+
<ReqoreButton size='tiny'>Tiny</ReqoreButton>
|
|
121
|
+
<ReqoreButton size='small'>Small</ReqoreButton>
|
|
122
|
+
<ReqoreButton size='normal'>Normal</ReqoreButton>
|
|
123
|
+
<ReqoreButton size='big'>Big</ReqoreButton>
|
|
124
|
+
<ReqoreButton size='huge'>Huge</ReqoreButton>
|
|
125
|
+
<ReqoreButton size='massive'>Massive</ReqoreButton>
|
|
126
|
+
</ReqoreControlGroup>
|
|
127
|
+
```
|
|
128
|
+
|
|
129
|
+
## Variants
|
|
130
|
+
|
|
131
|
+
### Flat Buttons
|
|
132
|
+
|
|
133
|
+
<LiveDemo>
|
|
134
|
+
<ReqoreControlGroup>
|
|
135
|
+
<ReqoreButton flat>Flat Button</ReqoreButton>
|
|
136
|
+
<ReqoreButton flat={false}>Raised Button</ReqoreButton>
|
|
137
|
+
</ReqoreControlGroup>
|
|
138
|
+
</LiveDemo>
|
|
139
|
+
|
|
140
|
+
```tsx
|
|
141
|
+
<ReqoreButton flat>Flat Button</ReqoreButton>
|
|
142
|
+
<ReqoreButton flat={false}>Raised Button</ReqoreButton>
|
|
143
|
+
```
|
|
144
|
+
|
|
145
|
+
### Minimal Buttons
|
|
146
|
+
|
|
147
|
+
<LiveDemo>
|
|
148
|
+
<ReqoreButton minimal>Minimal</ReqoreButton>
|
|
149
|
+
</LiveDemo>
|
|
150
|
+
|
|
151
|
+
```tsx
|
|
152
|
+
<ReqoreButton minimal>Minimal</ReqoreButton>
|
|
153
|
+
```
|
|
154
|
+
|
|
155
|
+
### Badge
|
|
156
|
+
|
|
157
|
+
<LiveDemo>
|
|
158
|
+
<ReqoreControlGroup>
|
|
159
|
+
<ReqoreButton badge={5} icon='NotificationLine'>
|
|
160
|
+
Notifications
|
|
161
|
+
</ReqoreButton>
|
|
162
|
+
<ReqoreButton badge={{ label: 'New', intent: 'success' }}>Messages</ReqoreButton>
|
|
163
|
+
</ReqoreControlGroup>
|
|
164
|
+
</LiveDemo>
|
|
165
|
+
|
|
166
|
+
```tsx
|
|
167
|
+
<ReqoreButton
|
|
168
|
+
badge={5}
|
|
169
|
+
icon="NotificationLine"
|
|
170
|
+
>
|
|
171
|
+
Notifications
|
|
172
|
+
</ReqoreButton>
|
|
173
|
+
|
|
174
|
+
<ReqoreButton
|
|
175
|
+
badge={{ label: 'New', intent: 'success' }}
|
|
176
|
+
>
|
|
177
|
+
Messages
|
|
178
|
+
</ReqoreButton>
|
|
179
|
+
```
|
|
180
|
+
|
|
181
|
+
## States
|
|
182
|
+
|
|
183
|
+
### Loading
|
|
184
|
+
|
|
185
|
+
<LiveDemo>
|
|
186
|
+
<ReqoreButton loading>Loading...</ReqoreButton>
|
|
187
|
+
</LiveDemo>
|
|
188
|
+
|
|
189
|
+
```tsx
|
|
190
|
+
<ReqoreButton loading>Loading...</ReqoreButton>
|
|
191
|
+
```
|
|
192
|
+
|
|
193
|
+
### Disabled
|
|
194
|
+
|
|
195
|
+
<LiveDemo>
|
|
196
|
+
<ReqoreButton disabled>Disabled</ReqoreButton>
|
|
197
|
+
</LiveDemo>
|
|
198
|
+
|
|
199
|
+
```tsx
|
|
200
|
+
<ReqoreButton disabled>Disabled</ReqoreButton>
|
|
201
|
+
```
|
|
202
|
+
|
|
203
|
+
### Active
|
|
204
|
+
|
|
205
|
+
<LiveDemo>
|
|
206
|
+
<ReqoreButton active>Active State</ReqoreButton>
|
|
207
|
+
</LiveDemo>
|
|
208
|
+
|
|
209
|
+
```tsx
|
|
210
|
+
<ReqoreButton active>Active State</ReqoreButton>
|
|
211
|
+
```
|
|
212
|
+
|
|
213
|
+
## Full Width
|
|
214
|
+
|
|
215
|
+
<LiveDemo>
|
|
216
|
+
<ReqoreButton fluid>Full Width Button</ReqoreButton>
|
|
217
|
+
</LiveDemo>
|
|
218
|
+
|
|
219
|
+
```tsx
|
|
220
|
+
<ReqoreButton fluid>Full Width Button</ReqoreButton>
|
|
221
|
+
```
|
|
222
|
+
|
|
223
|
+
## With Tooltip
|
|
224
|
+
|
|
225
|
+
<LiveDemo>
|
|
226
|
+
<ReqoreControlGroup>
|
|
227
|
+
<ReqoreButton tooltip='This is helpful information' icon='QuestionLine'>
|
|
228
|
+
Help
|
|
229
|
+
</ReqoreButton>
|
|
230
|
+
<ReqoreButton
|
|
231
|
+
tooltip={{
|
|
232
|
+
content: 'Advanced tooltip',
|
|
233
|
+
intent: 'info',
|
|
234
|
+
placement: 'top',
|
|
235
|
+
}}
|
|
236
|
+
>
|
|
237
|
+
Hover Me
|
|
238
|
+
</ReqoreButton>
|
|
239
|
+
</ReqoreControlGroup>
|
|
240
|
+
</LiveDemo>
|
|
241
|
+
|
|
242
|
+
```tsx
|
|
243
|
+
<ReqoreButton
|
|
244
|
+
tooltip="This is helpful information"
|
|
245
|
+
icon="QuestionLine"
|
|
246
|
+
>
|
|
247
|
+
Help
|
|
248
|
+
</ReqoreButton>
|
|
249
|
+
|
|
250
|
+
<ReqoreButton
|
|
251
|
+
tooltip={{
|
|
252
|
+
content: 'Advanced tooltip',
|
|
253
|
+
intent: 'info',
|
|
254
|
+
placement: 'top',
|
|
255
|
+
}}
|
|
256
|
+
>
|
|
257
|
+
Hover Me
|
|
258
|
+
</ReqoreButton>
|
|
259
|
+
```
|
|
260
|
+
|
|
261
|
+
## Effects
|
|
262
|
+
|
|
263
|
+
Add visual effects for enhanced appearance:
|
|
264
|
+
|
|
265
|
+
<LiveDemo>
|
|
266
|
+
<ReqoreButton
|
|
267
|
+
effect={{
|
|
268
|
+
gradient: {
|
|
269
|
+
colors: {
|
|
270
|
+
0: '#3b82f6',
|
|
271
|
+
100: '#8b5cf6',
|
|
272
|
+
},
|
|
273
|
+
animate: 'hover',
|
|
274
|
+
},
|
|
275
|
+
uppercase: true,
|
|
276
|
+
weight: 'bold',
|
|
277
|
+
}}
|
|
278
|
+
>
|
|
279
|
+
Gradient Button
|
|
280
|
+
</ReqoreButton>
|
|
281
|
+
</LiveDemo>
|
|
282
|
+
|
|
283
|
+
```tsx
|
|
284
|
+
<ReqoreButton
|
|
285
|
+
effect={{
|
|
286
|
+
gradient: {
|
|
287
|
+
colors: {
|
|
288
|
+
0: '#3b82f6',
|
|
289
|
+
100: '#8b5cf6',
|
|
290
|
+
},
|
|
291
|
+
animate: 'hover',
|
|
292
|
+
},
|
|
293
|
+
uppercase: true,
|
|
294
|
+
weight: 'bold',
|
|
295
|
+
}}
|
|
296
|
+
>
|
|
297
|
+
Gradient Button
|
|
298
|
+
</ReqoreButton>
|
|
299
|
+
```
|
|
300
|
+
|
|
301
|
+
## As Link
|
|
302
|
+
|
|
303
|
+
Render button as a link:
|
|
304
|
+
|
|
305
|
+
```tsx
|
|
306
|
+
<ReqoreButton
|
|
307
|
+
as='a'
|
|
308
|
+
props={{
|
|
309
|
+
href: 'https://example.com',
|
|
310
|
+
target: '_blank',
|
|
311
|
+
}}
|
|
312
|
+
>
|
|
313
|
+
External Link
|
|
314
|
+
</ReqoreButton>
|
|
315
|
+
```
|
|
316
|
+
|
|
317
|
+
## Examples
|
|
318
|
+
|
|
319
|
+
### Action Buttons
|
|
320
|
+
|
|
321
|
+
<LiveDemo>
|
|
322
|
+
<ReqoreControlGroup>
|
|
323
|
+
<ReqoreButton intent='success' icon='CheckLine'>
|
|
324
|
+
Save
|
|
325
|
+
</ReqoreButton>
|
|
326
|
+
<ReqoreButton intent='danger' icon='CloseLine'>
|
|
327
|
+
Cancel
|
|
328
|
+
</ReqoreButton>
|
|
329
|
+
</ReqoreControlGroup>
|
|
330
|
+
</LiveDemo>
|
|
331
|
+
|
|
332
|
+
```tsx
|
|
333
|
+
function ActionButtons() {
|
|
334
|
+
return (
|
|
335
|
+
<ReqoreControlGroup>
|
|
336
|
+
<ReqoreButton intent='success' icon='CheckLine'>
|
|
337
|
+
Save
|
|
338
|
+
</ReqoreButton>
|
|
339
|
+
<ReqoreButton intent='danger' icon='CloseLine'>
|
|
340
|
+
Cancel
|
|
341
|
+
</ReqoreButton>
|
|
342
|
+
</ReqoreControlGroup>
|
|
343
|
+
);
|
|
344
|
+
}
|
|
345
|
+
```
|
|
346
|
+
|
|
347
|
+
### Icon Button Group
|
|
348
|
+
|
|
349
|
+
<LiveDemo>
|
|
350
|
+
<ReqoreControlGroup>
|
|
351
|
+
<ReqoreButton icon='DeleteBinLine' tooltip='Delete' />
|
|
352
|
+
<ReqoreButton icon='EditLine' tooltip='Edit' />
|
|
353
|
+
<ReqoreButton icon='ShareLine' tooltip='Share' />
|
|
354
|
+
</ReqoreControlGroup>
|
|
355
|
+
</LiveDemo>
|
|
356
|
+
|
|
357
|
+
```tsx
|
|
358
|
+
function IconButtons() {
|
|
359
|
+
return (
|
|
360
|
+
<ReqoreControlGroup>
|
|
361
|
+
<ReqoreButton icon='DeleteBinLine' tooltip='Delete' />
|
|
362
|
+
<ReqoreButton icon='EditLine' tooltip='Edit' />
|
|
363
|
+
<ReqoreButton icon='ShareLine' tooltip='Share' />
|
|
364
|
+
</ReqoreControlGroup>
|
|
365
|
+
);
|
|
366
|
+
}
|
|
367
|
+
```
|
|
368
|
+
|
|
369
|
+
### Loading Button
|
|
370
|
+
|
|
371
|
+
<LiveDemo>
|
|
372
|
+
<ReqoreButton loading>Loading...</ReqoreButton>
|
|
373
|
+
</LiveDemo>
|
|
374
|
+
|
|
375
|
+
```tsx
|
|
376
|
+
function LoadingButton() {
|
|
377
|
+
const [loading, setLoading] = useState(false);
|
|
378
|
+
|
|
379
|
+
const handleClick = async () => {
|
|
380
|
+
setLoading(true);
|
|
381
|
+
await someAsyncOperation();
|
|
382
|
+
setLoading(false);
|
|
383
|
+
};
|
|
384
|
+
|
|
385
|
+
return (
|
|
386
|
+
<ReqoreButton loading={loading} onClick={handleClick}>
|
|
387
|
+
Submit
|
|
388
|
+
</ReqoreButton>
|
|
389
|
+
);
|
|
390
|
+
}
|
|
391
|
+
```
|