@xsolla/xui-button 0.150.0 → 0.151.0
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 +0 -33
- package/package.json +4 -4
package/README.md
CHANGED
|
@@ -6,8 +6,6 @@ A cross-platform React button component with primary/secondary variants, multipl
|
|
|
6
6
|
|
|
7
7
|
```bash
|
|
8
8
|
npm install @xsolla/xui-button
|
|
9
|
-
# or
|
|
10
|
-
yarn add @xsolla/xui-button
|
|
11
9
|
```
|
|
12
10
|
|
|
13
11
|
## Demo
|
|
@@ -482,37 +480,6 @@ A container for grouping related buttons together.
|
|
|
482
480
|
| sm | 8 | 12 |
|
|
483
481
|
| xs | 4 | 12 |
|
|
484
482
|
|
|
485
|
-
## Theming
|
|
486
|
-
|
|
487
|
-
Button components use the design system theme for colors and sizing:
|
|
488
|
-
|
|
489
|
-
```typescript
|
|
490
|
-
// Colors accessed via theme
|
|
491
|
-
theme.colors.control.[tone].[variant].bg // Background color
|
|
492
|
-
theme.colors.control.[tone].[variant].bgHover // Hover background
|
|
493
|
-
theme.colors.control.[tone].[variant].bgPress // Pressed background
|
|
494
|
-
theme.colors.control.[tone].[variant].bgDisable // Disabled background
|
|
495
|
-
theme.colors.control.[tone].[variant].border // Border color
|
|
496
|
-
theme.colors.control.[tone].[variant].borderHover // Hover border
|
|
497
|
-
theme.colors.control.[tone].[variant].borderPress // Pressed border
|
|
498
|
-
theme.colors.control.[tone].[variant].borderDisable // Disabled border
|
|
499
|
-
|
|
500
|
-
// Text colors are at the tone level, mapped by variant name
|
|
501
|
-
theme.colors.control.[tone].text.primary // Text color for primary variant
|
|
502
|
-
theme.colors.control.[tone].text.secondary // Text color for secondary variant
|
|
503
|
-
theme.colors.control.[tone].text.tertiary // Text color for tertiary variant
|
|
504
|
-
theme.colors.control.[tone].text.disable // Text color for disabled state
|
|
505
|
-
|
|
506
|
-
// Sizing accessed via theme
|
|
507
|
-
theme.sizing.button(size).height
|
|
508
|
-
theme.sizing.button(size).paddingHorizontal
|
|
509
|
-
theme.sizing.button(size).fontSize
|
|
510
|
-
theme.sizing.button(size).iconSize
|
|
511
|
-
|
|
512
|
-
// Border radius
|
|
513
|
-
theme.radius.button
|
|
514
|
-
```
|
|
515
|
-
|
|
516
483
|
## Accessibility
|
|
517
484
|
|
|
518
485
|
- All buttons use semantic `<button>` elements
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xsolla/xui-button",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.151.0",
|
|
4
4
|
"main": "./web/index.js",
|
|
5
5
|
"module": "./web/index.mjs",
|
|
6
6
|
"types": "./web/index.d.ts",
|
|
@@ -13,9 +13,9 @@
|
|
|
13
13
|
"test:coverage": "vitest run --coverage"
|
|
14
14
|
},
|
|
15
15
|
"dependencies": {
|
|
16
|
-
"@xsolla/xui-core": "0.
|
|
17
|
-
"@xsolla/xui-icons": "0.
|
|
18
|
-
"@xsolla/xui-primitives-core": "0.
|
|
16
|
+
"@xsolla/xui-core": "0.151.0",
|
|
17
|
+
"@xsolla/xui-icons": "0.151.0",
|
|
18
|
+
"@xsolla/xui-primitives-core": "0.151.0"
|
|
19
19
|
},
|
|
20
20
|
"peerDependencies": {
|
|
21
21
|
"react": ">=16.8.0",
|