@cmgfi/clear-ds 1.1.8 → 1.2.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/README.md +8 -7
- package/dist/index.cjs +174 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +1 -1
- package/dist/index.d.ts +104 -0
- package/dist/index.mjs +23695 -4130
- package/dist/index.mjs.map +1 -1
- package/package.json +18 -3
package/README.md
CHANGED
|
@@ -6,7 +6,7 @@ The UI foundation for CMG's internal loan origination platform. Built from scrat
|
|
|
6
6
|
|
|
7
7
|
- **npm:** [`@cmgfi/clear-ds`](https://www.npmjs.com/package/@cmgfi/clear-ds)
|
|
8
8
|
- **Storybook:** [clear-pimkxt5rp-cmgprojects.vercel.app](https://clear-pimkxt5rp-cmgprojects.vercel.app)
|
|
9
|
-
- **Version:** 1.1.
|
|
9
|
+
- **Version:** 1.1.8
|
|
10
10
|
- **License:** UNLICENSED (CMG Financial internal)
|
|
11
11
|
|
|
12
12
|
---
|
|
@@ -74,7 +74,7 @@ import { Button, InputText, Modal, DataTable } from '@cmgfi/clear-ds';
|
|
|
74
74
|
|
|
75
75
|
## Component Catalog
|
|
76
76
|
|
|
77
|
-
|
|
77
|
+
44 components across 7 sections. All are fully typed with JSDoc-annotated props, `React.forwardRef`-wrapped, and documented in Storybook.
|
|
78
78
|
|
|
79
79
|
### Buttons
|
|
80
80
|
|
|
@@ -99,18 +99,19 @@ Pass any React node to icon props — PrimeIcons (`<i className="pi pi-*" />`) a
|
|
|
99
99
|
| Component | Props | Description |
|
|
100
100
|
|---|---|---|
|
|
101
101
|
| `Button` | `variant`, `size`, `leadingIcon`, `trailingIcon`, `badge` | Primary action button. Variants: `primary` (default), `secondary`, `ghost`, `danger`, `link`. Sizes: `sm`, `md` (default), `lg`. Optional leading/trailing PrimeIcon slots and a notification badge. |
|
|
102
|
-
| `IconButton` | `icon`, `size`, `variant` | Circular icon-only button. Sizes: `sm` (24×24px), `md` (36×36px, default), `lg` (40×40px). |
|
|
102
|
+
| `IconButton` | `icon`, `size`, `variant` | Circular icon-only button. Sizes: `sm` (24×24px), `md` (36×36px, default), `lg` (40×40px). Tooltip showing `aria-label` rendered automatically on hover. |
|
|
103
103
|
| `DropdownButton` | `label`, `items`, `size`, `variant`, `leadingIcon`, `disabled` | Button that opens a dropdown action menu. Chevron uses `pi pi-chevron-down`. Sizes: `sm`, `md` (default), `lg`. |
|
|
104
|
-
| `SplitButton` | `label`, `items`, `size`, `variant`, `leadingIcon`, `disabled` | Two joined pill buttons: main action (left) + dropdown trigger (right). `primary` — both halves dark teal. `secondary` — both halves light teal. Sizes: `sm`, `md` (default), `lg`. Chevron
|
|
105
|
-
| `LightningButton` | `items`, `size`, `variant`, `disabled` | Icon-only quick-action button with `pi pi-bolt` + `pi pi-chevron-down`. Variants: `basic`, `filled`. Sizes: `sm`, `md` (default), `lg`. |
|
|
106
|
-
| `CloseButton` | `size`, `disabled` | Circular `pi pi-times` dismiss button. Default size is `sm` (24×24px). Sizes: `sm` (default), `md` (36×36px), `lg` (40×40px). |
|
|
104
|
+
| `SplitButton` | `label`, `items`, `size`, `variant`, `leadingIcon`, `disabled` | Two joined pill buttons: main action (left) + dropdown trigger (right). `primary` — both halves dark teal. `secondary` — both halves light teal. Sizes: `sm`, `md` (default), `lg`. Chevron trigger shows a tooltip with `triggerAriaLabel` on hover. |
|
|
105
|
+
| `LightningButton` | `items`, `size`, `variant`, `disabled` | Icon-only quick-action button with `pi pi-bolt` + `pi pi-chevron-down`. Variants: `basic`, `filled`. Sizes: `sm`, `md` (default), `lg`. Tooltip showing `aria-label` rendered automatically on hover. |
|
|
106
|
+
| `CloseButton` | `size`, `disabled` | Circular `pi pi-times` dismiss button. Default size is `sm` (24×24px). Sizes: `sm` (default), `md` (36×36px), `lg` (40×40px). Tooltip showing `aria-label` rendered automatically on hover. |
|
|
107
107
|
|
|
108
108
|
### Form Controls
|
|
109
109
|
|
|
110
110
|
| Component | Description |
|
|
111
111
|
|---|---|
|
|
112
112
|
| `InputText` | Single-line text input with label, helper text, and validation states. |
|
|
113
|
-
| `TextArea` | Multi-line text input. |
|
|
113
|
+
| `TextArea` | Multi-line text input. Props: `showLabel` (boolean), `counterPlacement` (`inside` \| `outside`). |
|
|
114
|
+
| `RichTextEditor` | Tiptap-based rich text editor. Every toolbar button (`showBold`, `showItalic`, `showUnderline`, `showStrike`, `showCode`, `showHighlight`, `showSubscript`, `showSuperscript`, `showHeading`, `showBlockquote`, `showCodeBlock`, `showBulletList`, `showOrderedList`, `showTaskList`, `showHorizontalRule`, `showTextAlign`, `showLink`, `showImage`, `showMention`, `showUndo`, `showRedo`) is an individual boolean prop. `toolbarMode`: `always` (default) \| `on-focus`. `mentionSuggestions` accepts a static array or async function for `@` mention data. |
|
|
114
115
|
| `Checkbox` | Controlled checkbox with label. Supports indeterminate state. |
|
|
115
116
|
| `RadioButton` | Single radio option. Compose multiples in a group. |
|
|
116
117
|
| `Select` | Single-select dropdown. |
|