jattac.libs.web.zest-button 1.2.7 → 1.2.8
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 +4 -0
- package/docs/api.md +21 -0
- package/docs/breaking-changes.md +15 -0
- package/docs/configuration.md +22 -0
- package/docs/development.md +16 -0
- package/docs/examples.md +13 -1
- package/docs/features.md +14 -1
- package/package.json +1 -1
package/README.md
CHANGED
package/docs/api.md
CHANGED
|
@@ -1,9 +1,26 @@
|
|
|
1
|
+
---
|
|
2
|
+
[⬅️ Previous: Features Showcase](./features.md)
|
|
3
|
+
|
|
1
4
|
# API Reference: The Technical Blueprint
|
|
2
5
|
|
|
3
6
|
This document provides an exhaustive reference for all `ZestButton` props and type definitions.
|
|
4
7
|
|
|
5
8
|
---
|
|
6
9
|
|
|
10
|
+
## Table of Contents
|
|
11
|
+
|
|
12
|
+
- [ZestButtonProps](#zestbuttonprops)
|
|
13
|
+
- [Type Definitions](#type-definitions)
|
|
14
|
+
- [ZestCustomProps](#zestcustomprops)
|
|
15
|
+
- [ZestGlobalConfig](#zestglobalconfig)
|
|
16
|
+
- [VisualOptions](#visualoptions)
|
|
17
|
+
- [BusyOptions](#busyoptions)
|
|
18
|
+
- [SuccessOptions](#successoptions)
|
|
19
|
+
- [ConfirmOptions](#confirmoptions)
|
|
20
|
+
- [SemanticType](#semantictype)
|
|
21
|
+
|
|
22
|
+
---
|
|
23
|
+
|
|
7
24
|
### `ZestButtonProps`
|
|
8
25
|
|
|
9
26
|
The `ZestButton` component accepts all standard HTML `<button>` attributes (e.g., `disabled`, `type`, `name`, `className`) in addition to its own custom configuration prop, `zest`.
|
|
@@ -117,3 +134,7 @@ declare module 'jattac.libs.web.zest-button' {
|
|
|
117
134
|
}
|
|
118
135
|
```
|
|
119
136
|
After augmentation, `'archive'` and `'publish'` would be valid `SemanticType` values, available for autocompletion and type-checking.
|
|
137
|
+
|
|
138
|
+
---
|
|
139
|
+
|
|
140
|
+
[⬅️ Previous: Features Showcase](./features.md) | [Next: Configuration Guide ➡️](./configuration.md)
|
package/docs/breaking-changes.md
CHANGED
|
@@ -1,9 +1,20 @@
|
|
|
1
|
+
---
|
|
2
|
+
[⬅️ Previous: Development Guide](./development.md)
|
|
3
|
+
|
|
1
4
|
# Breaking Changes: The Upgrade Path
|
|
2
5
|
|
|
3
6
|
This document lists significant changes between versions that might require modifications to your existing codebase.
|
|
4
7
|
|
|
5
8
|
---
|
|
6
9
|
|
|
10
|
+
## Table of Contents
|
|
11
|
+
|
|
12
|
+
- [Version 1.2.7](#version-127)
|
|
13
|
+
- [Version 1.2.6](#version-126)
|
|
14
|
+
- [Version 1.2.0](#version-120)
|
|
15
|
+
|
|
16
|
+
---
|
|
17
|
+
|
|
7
18
|
## Version 1.2.7
|
|
8
19
|
|
|
9
20
|
### Renamed `ZestProvider` to `ZestButtonConfigProvider`
|
|
@@ -126,3 +137,7 @@ This change allows for better organization of configuration options (e.g., `visu
|
|
|
126
137
|
My Button
|
|
127
138
|
</ZestButton>
|
|
128
139
|
```
|
|
140
|
+
|
|
141
|
+
---
|
|
142
|
+
|
|
143
|
+
[⬅️ Previous: Development Guide](./development.md) | [Next: README ➡️](../README.md)
|
package/docs/configuration.md
CHANGED
|
@@ -1,9 +1,27 @@
|
|
|
1
|
+
---
|
|
2
|
+
[⬅️ Previous: API Reference](./api.md)
|
|
3
|
+
|
|
1
4
|
# Configuration: The Control Panel
|
|
2
5
|
|
|
3
6
|
This document explains how to configure `ZestButton` on a component and global level.
|
|
4
7
|
|
|
5
8
|
---
|
|
6
9
|
|
|
10
|
+
## Table of Contents
|
|
11
|
+
|
|
12
|
+
- [Overview](#overview)
|
|
13
|
+
- [Theme Configuration](#theme-configuration)
|
|
14
|
+
- [Order of Precedence](#order-of-precedence)
|
|
15
|
+
- [Example: Forcing a Theme](#example-forcing-a-theme)
|
|
16
|
+
- [Global Configuration with ZestButtonConfigProvider](#global-configuration-with-zestbuttonconfigprovider)
|
|
17
|
+
- [Usage](#usage)
|
|
18
|
+
- [Precedence with the ZestButtonConfigProvider](#precedence-with-the-zestbuttonconfigprovider)
|
|
19
|
+
- [Advanced: Customizing Semantic Defaults](#advanced-customizing-semantic-defaults)
|
|
20
|
+
- [Example: Defining a Custom 'archive' Type](#example-defining-a-custom-archive-type)
|
|
21
|
+
- [Example: Overriding a Built-in 'delete' Default](#example-overriding-a-built-in-delete-default)
|
|
22
|
+
|
|
23
|
+
---
|
|
24
|
+
|
|
7
25
|
### Overview
|
|
8
26
|
|
|
9
27
|
Currently, `ZestButton` is primarily configured on a per-component basis via the `zest` prop. This provides the most explicit and direct control over each button's behavior and appearance.
|
|
@@ -190,3 +208,7 @@ const App = () => (
|
|
|
190
208
|
</ZestButton>
|
|
191
209
|
```
|
|
192
210
|
|
|
211
|
+
---
|
|
212
|
+
|
|
213
|
+
[⬅️ Previous: API Reference](./api.md) | [Next: Development Guide ➡️](./development.md)
|
|
214
|
+
|
package/docs/development.md
CHANGED
|
@@ -1,9 +1,21 @@
|
|
|
1
|
+
---
|
|
2
|
+
[⬅️ Previous: Configuration Guide](./configuration.md)
|
|
3
|
+
|
|
1
4
|
# Development: The Contributor's Guide
|
|
2
5
|
|
|
3
6
|
This guide provides an overview of the project's internal structure and instructions for setting up your development environment.
|
|
4
7
|
|
|
5
8
|
---
|
|
6
9
|
|
|
10
|
+
## Table of Contents
|
|
11
|
+
|
|
12
|
+
- [Internal Architecture](#internal-architecture)
|
|
13
|
+
- [Setup Instructions](#setup-instructions)
|
|
14
|
+
- [Scripts](#scripts)
|
|
15
|
+
- [Extending Semantic Types](#extending-semantic-types)
|
|
16
|
+
|
|
17
|
+
---
|
|
18
|
+
|
|
7
19
|
### Internal Architecture
|
|
8
20
|
|
|
9
21
|
The `jattac.libs.web.zest-button` project is structured to be a self-contained React component library.
|
|
@@ -75,3 +87,7 @@ declare module 'jattac.libs.web.zest-button' {
|
|
|
75
87
|
Once augmented, these new semantic types (`'archive'`, `'publish'`) will be available for autocompletion and type-checking when using the `semanticType` prop on your `ZestButton` instances.
|
|
76
88
|
|
|
77
89
|
*(Note: Currently, there are no dedicated test scripts defined in `package.json`. Testing is typically done manually in a consuming project during development, or through dedicated test runners that would be added in the future.)*
|
|
90
|
+
|
|
91
|
+
---
|
|
92
|
+
|
|
93
|
+
[⬅️ Previous: Configuration Guide](./configuration.md) | [Next: Breaking Changes ➡️](./breaking-changes.md)
|
package/docs/examples.md
CHANGED
|
@@ -4,6 +4,15 @@ Welcome to the ZestButton Cookbook! This is the core learning path for mastering
|
|
|
4
4
|
|
|
5
5
|
---
|
|
6
6
|
|
|
7
|
+
## Table of Contents
|
|
8
|
+
|
|
9
|
+
- [Recipe 1: Your First Async Button](#recipe-1-your-first-async-button)
|
|
10
|
+
- [Recipe 2: The Safe "Delete" Button](#recipe-2-the-safe-delete-button)
|
|
11
|
+
- [Recipe 3: Standardizing Your Buttons with a Global Config](#recipe-3-standardizing-your-buttons-with-a-global-config)
|
|
12
|
+
- [Recipe 4: Creating a Custom "Archive" Button](#recipe-4-creating-a-custom-archive-button)
|
|
13
|
+
|
|
14
|
+
---
|
|
15
|
+
|
|
7
16
|
### Recipe 1: Your First Async Button
|
|
8
17
|
|
|
9
18
|
**Goal:** Create a button that automatically shows a loading spinner during an operation and gives feedback when it's done.
|
|
@@ -211,5 +220,8 @@ const App = () => (
|
|
|
211
220
|
</ZestButtonConfigProvider>
|
|
212
221
|
);
|
|
213
222
|
```
|
|
214
|
-
This powerful pattern allows you to build a complete, consistent design system for all button actions in your application. For more details on configuration, see the [Configuration Guide](./configuration.md)
|
|
223
|
+
This powerful pattern allows you to build a complete, consistent design system for all button actions in your application. For more details on configuration, see the [Configuration Guide](./configuration.md).*
|
|
224
|
+
|
|
225
|
+
---
|
|
215
226
|
|
|
227
|
+
[⬅️ Previous: README](../README.md) | [Next: Features Showcase ➡️](./features.md)
|
package/docs/features.md
CHANGED
|
@@ -4,6 +4,16 @@ This document provides a high-level showcase of what's possible with `ZestButton
|
|
|
4
4
|
|
|
5
5
|
---
|
|
6
6
|
|
|
7
|
+
## Table of Contents
|
|
8
|
+
|
|
9
|
+
- [Asynchronous Operations & Feedback](#asynchronous-operations--feedback)
|
|
10
|
+
- [Confirmation Flow](#confirmation-flow)
|
|
11
|
+
- [Semantic Types](#semantic-types)
|
|
12
|
+
- [Global Configuration](#global-configuration)
|
|
13
|
+
- [Rich Styling](#rich-styling)
|
|
14
|
+
|
|
15
|
+
---
|
|
16
|
+
|
|
7
17
|
### Asynchronous Operations & Feedback
|
|
8
18
|
|
|
9
19
|
**What it does:** Automatically handles loading states and provides clear success/failure feedback for any action that returns a Promise.
|
|
@@ -100,7 +110,7 @@ const MyComponent = () => (
|
|
|
100
110
|
<ZestButton zest={{ visualOptions: { variant: 'success', size: 'sm' } }}>
|
|
101
111
|
Small Success
|
|
102
112
|
</ZestButton>
|
|
103
|
-
<ZestButton zest={{ buttonStyle: 'outline', size: 'md' }
|
|
113
|
+
<ZestButton zest={{ buttonStyle: 'outline', size: 'md' }}>
|
|
104
114
|
Medium Outline
|
|
105
115
|
</ZestButton>
|
|
106
116
|
<ZestButton zest={{ visualOptions: { variant: 'danger', size: 'lg' } }}>
|
|
@@ -111,3 +121,6 @@ const MyComponent = () => (
|
|
|
111
121
|
```
|
|
112
122
|
*Explore all the recipes in the **[Cookbook](./examples.md)** to see these options in action.*
|
|
113
123
|
|
|
124
|
+
---
|
|
125
|
+
|
|
126
|
+
[⬅️ Previous: The Cookbook (Examples)](./examples.md) | [Next: API Reference ➡️](./api.md)
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "jattac.libs.web.zest-button",
|
|
3
|
-
"version": "1.2.
|
|
3
|
+
"version": "1.2.8",
|
|
4
4
|
"description": "A highly customizable and production-ready React button component featuring robust asynchronous handling, rich visual feedback, and built-in confirmation flows for enhanced user experience",
|
|
5
5
|
"homepage": "https://github.com/nyingimaina/jattac.libs.web.zest-button#readme",
|
|
6
6
|
"repository": {
|