@spark-ui/button 1.10.0 → 1.11.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/CHANGELOG.md CHANGED
@@ -3,6 +3,17 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [1.11.1](https://github.com/adevinta/spark/compare/@spark-ui/button@1.11.0...@spark-ui/button@1.11.1) (2023-05-05)
7
+
8
+ **Note:** Version bump only for package @spark-ui/button
9
+
10
+ # [1.11.0](https://github.com/adevinta/spark/compare/@spark-ui/button@1.9.3...@spark-ui/button@1.11.0) (2023-05-03)
11
+
12
+ ### Features
13
+
14
+ - **button:** add info intent to all designs ([3111709](https://github.com/adevinta/spark/commit/3111709785924c9259a4aaffbb0df1ce9a3d8900))
15
+ - **button:** ci process ready ([48c9ad9](https://github.com/adevinta/spark/commit/48c9ad9d6f5cca53a2e9fcd09986fa30a3454187))
16
+
6
17
  # [1.10.0](https://github.com/adevinta/spark/compare/@spark-ui/button@1.9.3...@spark-ui/button@1.10.0) (2023-05-03)
7
18
 
8
19
  ### Features
package/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) Adevinta ASA.
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/dist/index.js CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("@spark-ui/slot"),t=require("react"),e=require("@spark-ui/internal-utils"),v=require("class-variance-authority"),f=[{intent:"primary",design:"filled",class:e.tw(["bg-primary","text-on-primary","enabled:hover:bg-primary-hovered","enabled:active:bg-primary-hovered","focus-visible:bg-primary-focused"])},{intent:"secondary",design:"filled",class:e.tw(["bg-secondary","text-on-secondary","enabled:hover:bg-secondary-hovered","enabled:active:bg-secondary-hovered","focus-visible:bg-secondary-focused"])},{intent:"success",design:"filled",class:e.tw(["bg-success","text-on-success","enabled:hover:bg-success-hovered","enabled:active:bg-success-hovered","focus-visible:bg-success-focused"])},{intent:"alert",design:"filled",class:e.tw(["bg-alert","text-on-alert","enabled:hover:bg-alert-hovered","enabled:active:bg-alert-hovered","focus-visible:bg-alert-focused"])},{intent:"danger",design:"filled",class:e.tw(["text-on-error bg-error","enabled:hover:bg-error-hovered enabled:active:bg-error-hovered","focus-visible:bg-error-focused"])},{intent:"info",design:"filled",class:e.tw(["text-on-error bg-info","enabled:hover:bg-info-hovered enabled:active:bg-info-hovered","focus-visible:bg-info-focused"])},{intent:"neutral",design:"filled",class:e.tw(["bg-neutral","text-on-neutral","enabled:hover:bg-neutral-hovered","enabled:active:bg-neutral-hovered","focus-visible:bg-neutral-focused"])},{intent:"surface",design:"filled",class:e.tw(["bg-surface","text-on-surface","enabled:hover:bg-surface-hovered","enabled:active:bg-surface-hovered","focus-visible:bg-surface-focused"])}],h=[{intent:"primary",design:"ghost",class:e.tw(["text-primary","enabled:hover:bg-primary/dim-5","enabled:active:bg-primary/dim-5","focus-visible:bg-primary/dim-5"])},{intent:"secondary",design:"ghost",class:e.tw(["text-secondary","enabled:hover:bg-secondary/dim-5","enabled:active:bg-secondary/dim-5","focus-visible:bg-secondary/dim-5"])},{intent:"success",design:"ghost",class:e.tw(["text-success","enabled:hover:bg-success/dim-5","enabled:active:bg-success/dim-5","focus-visible:bg-success/dim-5"])},{intent:"alert",design:"ghost",class:e.tw(["text-alert","enabled:hover:bg-alert/dim-5","enabled:active:bg-alert/dim-5","focus-visible:bg-alert/dim-5"])},{intent:"danger",design:"ghost",class:e.tw(["text-error","enabled:hover:bg-error/dim-5","enabled:active:bg-error/dim-5","focus-visible:bg-error/dim-5"])},{intent:"info",design:"ghost",class:e.tw(["text-info","enabled:hover:bg-info/dim-5","enabled:active:bg-info/dim-5","focus-visible:bg-info/dim-5"])},{intent:"neutral",design:"ghost",class:e.tw(["text-neutral","enabled:hover:bg-neutral/dim-5","enabled:active:bg-neutral/dim-5","focus-visible:bg-neutral/dim-5"])},{intent:"surface",design:"ghost",class:e.tw(["text-surface","enabled:hover:bg-surface/dim-5","enabled:active:bg-surface/dim-5","focus-visible:bg-surface/dim-5"])}],m=[{intent:"primary",design:"outlined",class:e.tw(["enabled:hover:bg-primary/dim-5","enabled:active:bg-primary/dim-5","focus-visible:bg-primary/dim-5","text-primary"])},{intent:"secondary",design:"outlined",class:e.tw(["enabled:hover:bg-secondary/dim-5","enabled:active:bg-secondary/dim-5","focus-visible:bg-secondary/dim-5","text-secondary"])},{intent:"success",design:"outlined",class:e.tw(["enabled:hover:bg-success/dim-5","enabled:active:bg-success/dim-5","focus-visible:bg-success/dim-5","text-success"])},{intent:"alert",design:"outlined",class:e.tw(["enabled:hover:bg-alert/dim-5","enabled:active:bg-alert/dim-5","focus-visible:bg-alert/dim-5","text-alert"])},{intent:"danger",design:"outlined",class:e.tw(["enabled:hover:bg-error/dim-5","enabled:active:bg-error/dim-5","focus-visible:bg-error/dim-5","text-error"])},{intent:"info",design:"outlined",class:e.tw(["enabled:hover:bg-info/dim-5","enabled:active:bg-info/dim-5","focus-visible:bg-info/dim-5","text-info"])},{intent:"neutral",design:"outlined",class:e.tw(["enabled:hover:bg-neutral/dim-5","enabled:active:bg-neutral/dim-5","focus-visible:bg-neutral/dim-5","text-neutral"])},{intent:"surface",design:"outlined",class:e.tw(["enabled:hover:bg-surface/dim-5","enabled:active:bg-surface/dim-5","focus-visible:bg-surface/dim-5","text-surface"])}],y=[{intent:"primary",design:"tinted",class:e.tw(["bg-primary-container","text-on-primary-container","enabled:hover:bg-primary-container-hovered","enabled:active:bg-primary-container-hovered","focus-visible:bg-primary-container-focused"])},{intent:"secondary",design:"tinted",class:e.tw(["bg-secondary-container","text-on-secondary-container","enabled:hover:bg-secondary-container-hovered","enabled:active:bg-secondary-container-hovered","focus-visible:bg-secondary-container-focused"])},{intent:"success",design:"tinted",class:e.tw(["bg-success-container","text-on-success-container","enabled:hover:bg-success-container-hovered","enabled:active:bg-success-container-hovered","focus-visible:bg-success-container-focused"])},{intent:"alert",design:"tinted",class:e.tw(["bg-alert-container","text-on-alert-container","enabled:hover:bg-alert-container-hovered","enabled:active:bg-alert-container-hovered","focus-visible:bg-alert-container-focused"])},{intent:"danger",design:"tinted",class:e.tw(["bg-error-container","text-on-error-container","enabled:hover:bg-error-container-hovered","enabled:active:bg-error-container-hovered","focus-visible:bg-error-container-focused"])},{intent:"info",design:"tinted",class:e.tw(["bg-info-container","text-on-info-container","enabled:hover:bg-info-container-hovered","enabled:active:bg-info-container-hovered","focus-visible:bg-info-container-focused"])},{intent:"neutral",design:"tinted",class:e.tw(["bg-neutral-container","text-on-neutral-container","enabled:hover:bg-neutral-container-hovered","enabled:active:bg-neutral-container-hovered","focus-visible:bg-neutral-container-focused"])},{intent:"surface",design:"tinted",class:e.tw(["bg-surface","text-on-surface","enabled:hover:bg-surface-hovered","enabled:active:bg-surface-hovered","focus-visible:bg-surface-focused"])}],w=[{intent:"primary",design:"contrast",class:e.tw(["text-primary","enabled:hover:bg-primary-container-hovered","enabled:active:bg-primary-container-hovered","focus-visible:bg-primary-container-focused"])},{intent:"secondary",design:"contrast",class:e.tw(["text-secondary","enabled:hover:bg-secondary-container-hovered","enabled:active:bg-secondary-container-hovered","focus-visible:bg-secondary-container-focused"])},{intent:"success",design:"contrast",class:e.tw(["text-success","enabled:hover:bg-success-container-hovered","enabled:active:bg-success-container-hovered","focus-visible:bg-success-container-focused"])},{intent:"alert",design:"contrast",class:e.tw(["text-alert","enabled:hover:bg-alert-container-hovered","enabled:active:bg-alert-container-hovered","focus-visible:bg-alert-container-focused"])},{intent:"danger",design:"contrast",class:e.tw(["text-error","enabled:hover:bg-error-container-hovered","enabled:active:bg-error-container-hovered","focus-visible:bg-error-container-focused"])},{intent:"info",design:"contrast",class:e.tw(["text-info","enabled:hover:bg-info-container-hovered","enabled:active:bg-info-container-hovered","focus-visible:bg-info-container-focused"])},{intent:"neutral",design:"contrast",class:e.tw(["text-neutral","enabled:hover:bg-neutral-container-hovered","enabled:active:bg-neutral-container-hovered","focus-visible:bg-neutral-container-focused"])},{intent:"surface",design:"contrast",class:e.tw(["text-on-surface","enabled:hover:bg-surface-hovered","enabled:active:bg-surface-hovered","focus-visible:bg-surface-focused"])}],p=v.cva(["u-shadow-border-transition","gap-md box-border inline-flex items-center justify-center whitespace-nowrap","px-lg","text-body-1 font-bold","focus-visible:ring-outline-high ring-inset focus-visible:outline-none focus-visible:ring-2"],{variants:{design:e.makeVariants({filled:[],outlined:["bg-transparent","ring-2","ring-current"],tinted:[],ghost:[],contrast:["bg-surface"]}),intent:e.makeVariants({primary:[],secondary:[],success:[],alert:[],danger:[],info:[],neutral:[],surface:[]}),size:e.makeVariants({sm:["min-w-sz-32","h-sz-32"],md:["min-w-sz-44","h-sz-44"],lg:["min-w-sz-56","h-sz-56"]}),shape:e.makeVariants({rounded:["rounded-lg"],square:["rounded-none"],pill:["rounded-full"]}),disabled:{true:["cursor-not-allowed","opacity-dim-3"]}},compoundVariants:[...f,...m,...y,...h,...w],defaultVariants:{design:"filled",intent:"primary",size:"md",shape:"rounded"}}),r=t.forwardRef(({design:i="filled",disabled:n=!1,intent:s="primary",shape:a="rounded",size:o="md",asChild:d,className:c,...l},b)=>{const g=d?u.Slot:"button";return t.createElement(g,{"data-spark-component":"button",ref:b,className:p({className:c,design:i,disabled:n,intent:s,shape:a,size:o}),disabled:!!n,...l})});r.displayName="Button",exports.Button=r;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("@spark-ui/slot"),s=require("react"),e=require("@spark-ui/internal-utils"),v=require("class-variance-authority"),f=[{intent:"primary",design:"filled",class:e.tw(["bg-primary","text-on-primary","enabled:hover:bg-primary-hovered","enabled:active:bg-primary-pressed","focus-visible:bg-primary-focused"])},{intent:"secondary",design:"filled",class:e.tw(["bg-secondary","text-on-secondary","enabled:hover:bg-secondary-hovered","enabled:active:bg-secondary-pressed","focus-visible:bg-secondary-focused"])},{intent:"success",design:"filled",class:e.tw(["bg-success","text-on-success","enabled:hover:bg-success-hovered","enabled:active:bg-success-pressed","focus-visible:bg-success-focused"])},{intent:"alert",design:"filled",class:e.tw(["bg-alert","text-on-alert","enabled:hover:bg-alert-hovered","enabled:active:bg-alert-pressed","focus-visible:bg-alert-focused"])},{intent:"danger",design:"filled",class:e.tw(["text-on-error bg-error","enabled:hover:bg-error-hovered enabled:active:bg-error-pressed","focus-visible:bg-error-focused"])},{intent:"info",design:"filled",class:e.tw(["text-on-error bg-info","enabled:hover:bg-info-hovered enabled:active:bg-info-pressed","focus-visible:bg-info-focused"])},{intent:"neutral",design:"filled",class:e.tw(["bg-neutral","text-on-neutral","enabled:hover:bg-neutral-hovered","enabled:active:bg-neutral-pressed","focus-visible:bg-neutral-focused"])},{intent:"surface",design:"filled",class:e.tw(["bg-surface","text-on-surface","enabled:hover:bg-surface-hovered","enabled:active:bg-surface-pressed","focus-visible:bg-surface-focused"])}],m=[{intent:"primary",design:"ghost",class:e.tw(["text-primary","enabled:hover:bg-primary/dim-5","enabled:active:bg-primary/dim-5","focus-visible:bg-primary/dim-5"])},{intent:"secondary",design:"ghost",class:e.tw(["text-secondary","enabled:hover:bg-secondary/dim-5","enabled:active:bg-secondary/dim-5","focus-visible:bg-secondary/dim-5"])},{intent:"success",design:"ghost",class:e.tw(["text-success","enabled:hover:bg-success/dim-5","enabled:active:bg-success/dim-5","focus-visible:bg-success/dim-5"])},{intent:"alert",design:"ghost",class:e.tw(["text-alert","enabled:hover:bg-alert/dim-5","enabled:active:bg-alert/dim-5","focus-visible:bg-alert/dim-5"])},{intent:"danger",design:"ghost",class:e.tw(["text-error","enabled:hover:bg-error/dim-5","enabled:active:bg-error/dim-5","focus-visible:bg-error/dim-5"])},{intent:"info",design:"ghost",class:e.tw(["text-info","enabled:hover:bg-info/dim-5","enabled:active:bg-info/dim-5","focus-visible:bg-info/dim-5"])},{intent:"neutral",design:"ghost",class:e.tw(["text-neutral","enabled:hover:bg-neutral/dim-5","enabled:active:bg-neutral/dim-5","focus-visible:bg-neutral/dim-5"])},{intent:"surface",design:"ghost",class:e.tw(["text-surface","enabled:hover:bg-surface/dim-5","enabled:active:bg-surface/dim-5","focus-visible:bg-surface/dim-5"])}],h=[{intent:"primary",design:"outlined",class:e.tw(["enabled:hover:bg-primary/dim-5","enabled:active:bg-primary/dim-5","focus-visible:bg-primary/dim-5","text-primary"])},{intent:"secondary",design:"outlined",class:e.tw(["enabled:hover:bg-secondary/dim-5","enabled:active:bg-secondary/dim-5","focus-visible:bg-secondary/dim-5","text-secondary"])},{intent:"success",design:"outlined",class:e.tw(["enabled:hover:bg-success/dim-5","enabled:active:bg-success/dim-5","focus-visible:bg-success/dim-5","text-success"])},{intent:"alert",design:"outlined",class:e.tw(["enabled:hover:bg-alert/dim-5","enabled:active:bg-alert/dim-5","focus-visible:bg-alert/dim-5","text-alert"])},{intent:"danger",design:"outlined",class:e.tw(["enabled:hover:bg-error/dim-5","enabled:active:bg-error/dim-5","focus-visible:bg-error/dim-5","text-error"])},{intent:"info",design:"outlined",class:e.tw(["enabled:hover:bg-info/dim-5","enabled:active:bg-info/dim-5","focus-visible:bg-info/dim-5","text-info"])},{intent:"neutral",design:"outlined",class:e.tw(["enabled:hover:bg-neutral/dim-5","enabled:active:bg-neutral/dim-5","focus-visible:bg-neutral/dim-5","text-neutral"])},{intent:"surface",design:"outlined",class:e.tw(["enabled:hover:bg-surface/dim-5","enabled:active:bg-surface/dim-5","focus-visible:bg-surface/dim-5","text-surface"])}],p=[{intent:"primary",design:"tinted",class:e.tw(["bg-primary-container","text-on-primary-container","enabled:hover:bg-primary-container-hovered","enabled:active:bg-primary-container-pressed","focus-visible:bg-primary-container-focused"])},{intent:"secondary",design:"tinted",class:e.tw(["bg-secondary-container","text-on-secondary-container","enabled:hover:bg-secondary-container-hovered","enabled:active:bg-secondary-container-pressed","focus-visible:bg-secondary-container-focused"])},{intent:"success",design:"tinted",class:e.tw(["bg-success-container","text-on-success-container","enabled:hover:bg-success-container-hovered","enabled:active:bg-success-container-pressed","focus-visible:bg-success-container-focused"])},{intent:"alert",design:"tinted",class:e.tw(["bg-alert-container","text-on-alert-container","enabled:hover:bg-alert-container-hovered","enabled:active:bg-alert-container-pressed","focus-visible:bg-alert-container-focused"])},{intent:"danger",design:"tinted",class:e.tw(["bg-error-container","text-on-error-container","enabled:hover:bg-error-container-hovered","enabled:active:bg-error-container-pressed","focus-visible:bg-error-container-focused"])},{intent:"info",design:"tinted",class:e.tw(["bg-info-container","text-on-info-container","enabled:hover:bg-info-container-hovered","enabled:active:bg-info-container-pressed","focus-visible:bg-info-container-focused"])},{intent:"neutral",design:"tinted",class:e.tw(["bg-neutral-container","text-on-neutral-container","enabled:hover:bg-neutral-container-hovered","enabled:active:bg-neutral-container-pressed","focus-visible:bg-neutral-container-focused"])},{intent:"surface",design:"tinted",class:e.tw(["bg-surface","text-on-surface","enabled:hover:bg-surface-hovered","enabled:active:bg-surface-pressed","focus-visible:bg-surface-focused"])}],y=[{intent:"primary",design:"contrast",class:e.tw(["text-primary","enabled:hover:bg-primary-container-hovered","enabled:active:bg-primary-container-pressed","focus-visible:bg-primary-container-focused"])},{intent:"secondary",design:"contrast",class:e.tw(["text-secondary","enabled:hover:bg-secondary-container-hovered","enabled:active:bg-secondary-container-pressed","focus-visible:bg-secondary-container-focused"])},{intent:"success",design:"contrast",class:e.tw(["text-success","enabled:hover:bg-success-container-hovered","enabled:active:bg-success-container-pressed","focus-visible:bg-success-container-focused"])},{intent:"alert",design:"contrast",class:e.tw(["text-alert","enabled:hover:bg-alert-container-hovered","enabled:active:bg-alert-container-pressed","focus-visible:bg-alert-container-focused"])},{intent:"danger",design:"contrast",class:e.tw(["text-error","enabled:hover:bg-error-container-hovered","enabled:active:bg-error-container-pressed","focus-visible:bg-error-container-focused"])},{intent:"info",design:"contrast",class:e.tw(["text-info","enabled:hover:bg-info-container-hovered","enabled:active:bg-info-container-pressed","focus-visible:bg-info-container-focused"])},{intent:"neutral",design:"contrast",class:e.tw(["text-neutral","enabled:hover:bg-neutral-container-hovered","enabled:active:bg-neutral-container-pressed","focus-visible:bg-neutral-container-focused"])},{intent:"surface",design:"contrast",class:e.tw(["text-on-surface","enabled:hover:bg-surface-hovered","enabled:active:bg-surface-pressed","focus-visible:bg-surface-focused"])}],w=v.cva(["u-shadow-border-transition","gap-md box-border inline-flex items-center justify-center whitespace-nowrap","px-lg","text-body-1 font-bold","focus-visible:ring-outline-high ring-inset focus-visible:outline-none focus-visible:ring-2"],{variants:{design:e.makeVariants({filled:[],outlined:["bg-transparent","ring-2","ring-current"],tinted:[],ghost:[],contrast:["bg-surface"]}),intent:e.makeVariants({primary:[],secondary:[],success:[],alert:[],danger:[],info:[],neutral:[],surface:[]}),size:e.makeVariants({sm:["min-w-sz-32","h-sz-32"],md:["min-w-sz-44","h-sz-44"],lg:["min-w-sz-56","h-sz-56"]}),shape:e.makeVariants({rounded:["rounded-lg"],square:["rounded-none"],pill:["rounded-full"]}),disabled:{true:["cursor-not-allowed","opacity-dim-3"]}},compoundVariants:[...f,...h,...p,...m,...y],defaultVariants:{design:"filled",intent:"primary",size:"md",shape:"rounded"}}),t=s.forwardRef(({design:r="filled",disabled:n=!1,intent:i="primary",shape:a="rounded",size:o="md",asChild:d,className:c,...l},b)=>{const g=d?u.Slot:"button";return s.createElement(g,{"data-spark-component":"button",ref:b,className:w({className:c,design:r,disabled:n,intent:i,shape:a,size:o}),disabled:!!n,...l})});t.displayName="Button",exports.Button=t;
package/dist/index.mjs CHANGED
@@ -1,10 +1,10 @@
1
1
  import { Slot as u } from "@spark-ui/slot";
2
- import i from "react";
2
+ import r from "react";
3
3
  import { tw as e, makeVariants as n } from "@spark-ui/internal-utils";
4
4
  import { cva as v } from "class-variance-authority";
5
- const f = [{ intent: "primary", design: "filled", class: e(["bg-primary", "text-on-primary", "enabled:hover:bg-primary-hovered", "enabled:active:bg-primary-hovered", "focus-visible:bg-primary-focused"]) }, { intent: "secondary", design: "filled", class: e(["bg-secondary", "text-on-secondary", "enabled:hover:bg-secondary-hovered", "enabled:active:bg-secondary-hovered", "focus-visible:bg-secondary-focused"]) }, { intent: "success", design: "filled", class: e(["bg-success", "text-on-success", "enabled:hover:bg-success-hovered", "enabled:active:bg-success-hovered", "focus-visible:bg-success-focused"]) }, { intent: "alert", design: "filled", class: e(["bg-alert", "text-on-alert", "enabled:hover:bg-alert-hovered", "enabled:active:bg-alert-hovered", "focus-visible:bg-alert-focused"]) }, { intent: "danger", design: "filled", class: e(["text-on-error bg-error", "enabled:hover:bg-error-hovered enabled:active:bg-error-hovered", "focus-visible:bg-error-focused"]) }, { intent: "info", design: "filled", class: e(["text-on-error bg-info", "enabled:hover:bg-info-hovered enabled:active:bg-info-hovered", "focus-visible:bg-info-focused"]) }, { intent: "neutral", design: "filled", class: e(["bg-neutral", "text-on-neutral", "enabled:hover:bg-neutral-hovered", "enabled:active:bg-neutral-hovered", "focus-visible:bg-neutral-focused"]) }, { intent: "surface", design: "filled", class: e(["bg-surface", "text-on-surface", "enabled:hover:bg-surface-hovered", "enabled:active:bg-surface-hovered", "focus-visible:bg-surface-focused"]) }], h = [{ intent: "primary", design: "ghost", class: e(["text-primary", "enabled:hover:bg-primary/dim-5", "enabled:active:bg-primary/dim-5", "focus-visible:bg-primary/dim-5"]) }, { intent: "secondary", design: "ghost", class: e(["text-secondary", "enabled:hover:bg-secondary/dim-5", "enabled:active:bg-secondary/dim-5", "focus-visible:bg-secondary/dim-5"]) }, { intent: "success", design: "ghost", class: e(["text-success", "enabled:hover:bg-success/dim-5", "enabled:active:bg-success/dim-5", "focus-visible:bg-success/dim-5"]) }, { intent: "alert", design: "ghost", class: e(["text-alert", "enabled:hover:bg-alert/dim-5", "enabled:active:bg-alert/dim-5", "focus-visible:bg-alert/dim-5"]) }, { intent: "danger", design: "ghost", class: e(["text-error", "enabled:hover:bg-error/dim-5", "enabled:active:bg-error/dim-5", "focus-visible:bg-error/dim-5"]) }, { intent: "info", design: "ghost", class: e(["text-info", "enabled:hover:bg-info/dim-5", "enabled:active:bg-info/dim-5", "focus-visible:bg-info/dim-5"]) }, { intent: "neutral", design: "ghost", class: e(["text-neutral", "enabled:hover:bg-neutral/dim-5", "enabled:active:bg-neutral/dim-5", "focus-visible:bg-neutral/dim-5"]) }, { intent: "surface", design: "ghost", class: e(["text-surface", "enabled:hover:bg-surface/dim-5", "enabled:active:bg-surface/dim-5", "focus-visible:bg-surface/dim-5"]) }], m = [{ intent: "primary", design: "outlined", class: e(["enabled:hover:bg-primary/dim-5", "enabled:active:bg-primary/dim-5", "focus-visible:bg-primary/dim-5", "text-primary"]) }, { intent: "secondary", design: "outlined", class: e(["enabled:hover:bg-secondary/dim-5", "enabled:active:bg-secondary/dim-5", "focus-visible:bg-secondary/dim-5", "text-secondary"]) }, { intent: "success", design: "outlined", class: e(["enabled:hover:bg-success/dim-5", "enabled:active:bg-success/dim-5", "focus-visible:bg-success/dim-5", "text-success"]) }, { intent: "alert", design: "outlined", class: e(["enabled:hover:bg-alert/dim-5", "enabled:active:bg-alert/dim-5", "focus-visible:bg-alert/dim-5", "text-alert"]) }, { intent: "danger", design: "outlined", class: e(["enabled:hover:bg-error/dim-5", "enabled:active:bg-error/dim-5", "focus-visible:bg-error/dim-5", "text-error"]) }, { intent: "info", design: "outlined", class: e(["enabled:hover:bg-info/dim-5", "enabled:active:bg-info/dim-5", "focus-visible:bg-info/dim-5", "text-info"]) }, { intent: "neutral", design: "outlined", class: e(["enabled:hover:bg-neutral/dim-5", "enabled:active:bg-neutral/dim-5", "focus-visible:bg-neutral/dim-5", "text-neutral"]) }, { intent: "surface", design: "outlined", class: e(["enabled:hover:bg-surface/dim-5", "enabled:active:bg-surface/dim-5", "focus-visible:bg-surface/dim-5", "text-surface"]) }], y = [{ intent: "primary", design: "tinted", class: e(["bg-primary-container", "text-on-primary-container", "enabled:hover:bg-primary-container-hovered", "enabled:active:bg-primary-container-hovered", "focus-visible:bg-primary-container-focused"]) }, { intent: "secondary", design: "tinted", class: e(["bg-secondary-container", "text-on-secondary-container", "enabled:hover:bg-secondary-container-hovered", "enabled:active:bg-secondary-container-hovered", "focus-visible:bg-secondary-container-focused"]) }, { intent: "success", design: "tinted", class: e(["bg-success-container", "text-on-success-container", "enabled:hover:bg-success-container-hovered", "enabled:active:bg-success-container-hovered", "focus-visible:bg-success-container-focused"]) }, { intent: "alert", design: "tinted", class: e(["bg-alert-container", "text-on-alert-container", "enabled:hover:bg-alert-container-hovered", "enabled:active:bg-alert-container-hovered", "focus-visible:bg-alert-container-focused"]) }, { intent: "danger", design: "tinted", class: e(["bg-error-container", "text-on-error-container", "enabled:hover:bg-error-container-hovered", "enabled:active:bg-error-container-hovered", "focus-visible:bg-error-container-focused"]) }, { intent: "info", design: "tinted", class: e(["bg-info-container", "text-on-info-container", "enabled:hover:bg-info-container-hovered", "enabled:active:bg-info-container-hovered", "focus-visible:bg-info-container-focused"]) }, { intent: "neutral", design: "tinted", class: e(["bg-neutral-container", "text-on-neutral-container", "enabled:hover:bg-neutral-container-hovered", "enabled:active:bg-neutral-container-hovered", "focus-visible:bg-neutral-container-focused"]) }, { intent: "surface", design: "tinted", class: e(["bg-surface", "text-on-surface", "enabled:hover:bg-surface-hovered", "enabled:active:bg-surface-hovered", "focus-visible:bg-surface-focused"]) }], p = [{ intent: "primary", design: "contrast", class: e(["text-primary", "enabled:hover:bg-primary-container-hovered", "enabled:active:bg-primary-container-hovered", "focus-visible:bg-primary-container-focused"]) }, { intent: "secondary", design: "contrast", class: e(["text-secondary", "enabled:hover:bg-secondary-container-hovered", "enabled:active:bg-secondary-container-hovered", "focus-visible:bg-secondary-container-focused"]) }, { intent: "success", design: "contrast", class: e(["text-success", "enabled:hover:bg-success-container-hovered", "enabled:active:bg-success-container-hovered", "focus-visible:bg-success-container-focused"]) }, { intent: "alert", design: "contrast", class: e(["text-alert", "enabled:hover:bg-alert-container-hovered", "enabled:active:bg-alert-container-hovered", "focus-visible:bg-alert-container-focused"]) }, { intent: "danger", design: "contrast", class: e(["text-error", "enabled:hover:bg-error-container-hovered", "enabled:active:bg-error-container-hovered", "focus-visible:bg-error-container-focused"]) }, { intent: "info", design: "contrast", class: e(["text-info", "enabled:hover:bg-info-container-hovered", "enabled:active:bg-info-container-hovered", "focus-visible:bg-info-container-focused"]) }, { intent: "neutral", design: "contrast", class: e(["text-neutral", "enabled:hover:bg-neutral-container-hovered", "enabled:active:bg-neutral-container-hovered", "focus-visible:bg-neutral-container-focused"]) }, { intent: "surface", design: "contrast", class: e(["text-on-surface", "enabled:hover:bg-surface-hovered", "enabled:active:bg-surface-hovered", "focus-visible:bg-surface-focused"]) }], x = v(["u-shadow-border-transition", "gap-md box-border inline-flex items-center justify-center whitespace-nowrap", "px-lg", "text-body-1 font-bold", "focus-visible:ring-outline-high ring-inset focus-visible:outline-none focus-visible:ring-2"], { variants: { design: n({ filled: [], outlined: ["bg-transparent", "ring-2", "ring-current"], tinted: [], ghost: [], contrast: ["bg-surface"] }), intent: n({ primary: [], secondary: [], success: [], alert: [], danger: [], info: [], neutral: [], surface: [] }), size: n({ sm: ["min-w-sz-32", "h-sz-32"], md: ["min-w-sz-44", "h-sz-44"], lg: ["min-w-sz-56", "h-sz-56"] }), shape: n({ rounded: ["rounded-lg"], square: ["rounded-none"], pill: ["rounded-full"] }), disabled: { true: ["cursor-not-allowed", "opacity-dim-3"] } }, compoundVariants: [...f, ...m, ...y, ...h, ...p], defaultVariants: { design: "filled", intent: "primary", size: "md", shape: "rounded" } }), z = i.forwardRef(({ design: s = "filled", disabled: r = !1, intent: a = "primary", shape: t = "rounded", size: o = "md", asChild: d, className: c, ...l }, b) => {
5
+ const f = [{ intent: "primary", design: "filled", class: e(["bg-primary", "text-on-primary", "enabled:hover:bg-primary-hovered", "enabled:active:bg-primary-pressed", "focus-visible:bg-primary-focused"]) }, { intent: "secondary", design: "filled", class: e(["bg-secondary", "text-on-secondary", "enabled:hover:bg-secondary-hovered", "enabled:active:bg-secondary-pressed", "focus-visible:bg-secondary-focused"]) }, { intent: "success", design: "filled", class: e(["bg-success", "text-on-success", "enabled:hover:bg-success-hovered", "enabled:active:bg-success-pressed", "focus-visible:bg-success-focused"]) }, { intent: "alert", design: "filled", class: e(["bg-alert", "text-on-alert", "enabled:hover:bg-alert-hovered", "enabled:active:bg-alert-pressed", "focus-visible:bg-alert-focused"]) }, { intent: "danger", design: "filled", class: e(["text-on-error bg-error", "enabled:hover:bg-error-hovered enabled:active:bg-error-pressed", "focus-visible:bg-error-focused"]) }, { intent: "info", design: "filled", class: e(["text-on-error bg-info", "enabled:hover:bg-info-hovered enabled:active:bg-info-pressed", "focus-visible:bg-info-focused"]) }, { intent: "neutral", design: "filled", class: e(["bg-neutral", "text-on-neutral", "enabled:hover:bg-neutral-hovered", "enabled:active:bg-neutral-pressed", "focus-visible:bg-neutral-focused"]) }, { intent: "surface", design: "filled", class: e(["bg-surface", "text-on-surface", "enabled:hover:bg-surface-hovered", "enabled:active:bg-surface-pressed", "focus-visible:bg-surface-focused"]) }], m = [{ intent: "primary", design: "ghost", class: e(["text-primary", "enabled:hover:bg-primary/dim-5", "enabled:active:bg-primary/dim-5", "focus-visible:bg-primary/dim-5"]) }, { intent: "secondary", design: "ghost", class: e(["text-secondary", "enabled:hover:bg-secondary/dim-5", "enabled:active:bg-secondary/dim-5", "focus-visible:bg-secondary/dim-5"]) }, { intent: "success", design: "ghost", class: e(["text-success", "enabled:hover:bg-success/dim-5", "enabled:active:bg-success/dim-5", "focus-visible:bg-success/dim-5"]) }, { intent: "alert", design: "ghost", class: e(["text-alert", "enabled:hover:bg-alert/dim-5", "enabled:active:bg-alert/dim-5", "focus-visible:bg-alert/dim-5"]) }, { intent: "danger", design: "ghost", class: e(["text-error", "enabled:hover:bg-error/dim-5", "enabled:active:bg-error/dim-5", "focus-visible:bg-error/dim-5"]) }, { intent: "info", design: "ghost", class: e(["text-info", "enabled:hover:bg-info/dim-5", "enabled:active:bg-info/dim-5", "focus-visible:bg-info/dim-5"]) }, { intent: "neutral", design: "ghost", class: e(["text-neutral", "enabled:hover:bg-neutral/dim-5", "enabled:active:bg-neutral/dim-5", "focus-visible:bg-neutral/dim-5"]) }, { intent: "surface", design: "ghost", class: e(["text-surface", "enabled:hover:bg-surface/dim-5", "enabled:active:bg-surface/dim-5", "focus-visible:bg-surface/dim-5"]) }], h = [{ intent: "primary", design: "outlined", class: e(["enabled:hover:bg-primary/dim-5", "enabled:active:bg-primary/dim-5", "focus-visible:bg-primary/dim-5", "text-primary"]) }, { intent: "secondary", design: "outlined", class: e(["enabled:hover:bg-secondary/dim-5", "enabled:active:bg-secondary/dim-5", "focus-visible:bg-secondary/dim-5", "text-secondary"]) }, { intent: "success", design: "outlined", class: e(["enabled:hover:bg-success/dim-5", "enabled:active:bg-success/dim-5", "focus-visible:bg-success/dim-5", "text-success"]) }, { intent: "alert", design: "outlined", class: e(["enabled:hover:bg-alert/dim-5", "enabled:active:bg-alert/dim-5", "focus-visible:bg-alert/dim-5", "text-alert"]) }, { intent: "danger", design: "outlined", class: e(["enabled:hover:bg-error/dim-5", "enabled:active:bg-error/dim-5", "focus-visible:bg-error/dim-5", "text-error"]) }, { intent: "info", design: "outlined", class: e(["enabled:hover:bg-info/dim-5", "enabled:active:bg-info/dim-5", "focus-visible:bg-info/dim-5", "text-info"]) }, { intent: "neutral", design: "outlined", class: e(["enabled:hover:bg-neutral/dim-5", "enabled:active:bg-neutral/dim-5", "focus-visible:bg-neutral/dim-5", "text-neutral"]) }, { intent: "surface", design: "outlined", class: e(["enabled:hover:bg-surface/dim-5", "enabled:active:bg-surface/dim-5", "focus-visible:bg-surface/dim-5", "text-surface"]) }], p = [{ intent: "primary", design: "tinted", class: e(["bg-primary-container", "text-on-primary-container", "enabled:hover:bg-primary-container-hovered", "enabled:active:bg-primary-container-pressed", "focus-visible:bg-primary-container-focused"]) }, { intent: "secondary", design: "tinted", class: e(["bg-secondary-container", "text-on-secondary-container", "enabled:hover:bg-secondary-container-hovered", "enabled:active:bg-secondary-container-pressed", "focus-visible:bg-secondary-container-focused"]) }, { intent: "success", design: "tinted", class: e(["bg-success-container", "text-on-success-container", "enabled:hover:bg-success-container-hovered", "enabled:active:bg-success-container-pressed", "focus-visible:bg-success-container-focused"]) }, { intent: "alert", design: "tinted", class: e(["bg-alert-container", "text-on-alert-container", "enabled:hover:bg-alert-container-hovered", "enabled:active:bg-alert-container-pressed", "focus-visible:bg-alert-container-focused"]) }, { intent: "danger", design: "tinted", class: e(["bg-error-container", "text-on-error-container", "enabled:hover:bg-error-container-hovered", "enabled:active:bg-error-container-pressed", "focus-visible:bg-error-container-focused"]) }, { intent: "info", design: "tinted", class: e(["bg-info-container", "text-on-info-container", "enabled:hover:bg-info-container-hovered", "enabled:active:bg-info-container-pressed", "focus-visible:bg-info-container-focused"]) }, { intent: "neutral", design: "tinted", class: e(["bg-neutral-container", "text-on-neutral-container", "enabled:hover:bg-neutral-container-hovered", "enabled:active:bg-neutral-container-pressed", "focus-visible:bg-neutral-container-focused"]) }, { intent: "surface", design: "tinted", class: e(["bg-surface", "text-on-surface", "enabled:hover:bg-surface-hovered", "enabled:active:bg-surface-pressed", "focus-visible:bg-surface-focused"]) }], y = [{ intent: "primary", design: "contrast", class: e(["text-primary", "enabled:hover:bg-primary-container-hovered", "enabled:active:bg-primary-container-pressed", "focus-visible:bg-primary-container-focused"]) }, { intent: "secondary", design: "contrast", class: e(["text-secondary", "enabled:hover:bg-secondary-container-hovered", "enabled:active:bg-secondary-container-pressed", "focus-visible:bg-secondary-container-focused"]) }, { intent: "success", design: "contrast", class: e(["text-success", "enabled:hover:bg-success-container-hovered", "enabled:active:bg-success-container-pressed", "focus-visible:bg-success-container-focused"]) }, { intent: "alert", design: "contrast", class: e(["text-alert", "enabled:hover:bg-alert-container-hovered", "enabled:active:bg-alert-container-pressed", "focus-visible:bg-alert-container-focused"]) }, { intent: "danger", design: "contrast", class: e(["text-error", "enabled:hover:bg-error-container-hovered", "enabled:active:bg-error-container-pressed", "focus-visible:bg-error-container-focused"]) }, { intent: "info", design: "contrast", class: e(["text-info", "enabled:hover:bg-info-container-hovered", "enabled:active:bg-info-container-pressed", "focus-visible:bg-info-container-focused"]) }, { intent: "neutral", design: "contrast", class: e(["text-neutral", "enabled:hover:bg-neutral-container-hovered", "enabled:active:bg-neutral-container-pressed", "focus-visible:bg-neutral-container-focused"]) }, { intent: "surface", design: "contrast", class: e(["text-on-surface", "enabled:hover:bg-surface-hovered", "enabled:active:bg-surface-pressed", "focus-visible:bg-surface-focused"]) }], x = v(["u-shadow-border-transition", "gap-md box-border inline-flex items-center justify-center whitespace-nowrap", "px-lg", "text-body-1 font-bold", "focus-visible:ring-outline-high ring-inset focus-visible:outline-none focus-visible:ring-2"], { variants: { design: n({ filled: [], outlined: ["bg-transparent", "ring-2", "ring-current"], tinted: [], ghost: [], contrast: ["bg-surface"] }), intent: n({ primary: [], secondary: [], success: [], alert: [], danger: [], info: [], neutral: [], surface: [] }), size: n({ sm: ["min-w-sz-32", "h-sz-32"], md: ["min-w-sz-44", "h-sz-44"], lg: ["min-w-sz-56", "h-sz-56"] }), shape: n({ rounded: ["rounded-lg"], square: ["rounded-none"], pill: ["rounded-full"] }), disabled: { true: ["cursor-not-allowed", "opacity-dim-3"] } }, compoundVariants: [...f, ...h, ...p, ...m, ...y], defaultVariants: { design: "filled", intent: "primary", size: "md", shape: "rounded" } }), z = r.forwardRef(({ design: i = "filled", disabled: s = !1, intent: a = "primary", shape: t = "rounded", size: o = "md", asChild: d, className: c, ...l }, b) => {
6
6
  const g = d ? u : "button";
7
- return i.createElement(g, { "data-spark-component": "button", ref: b, className: x({ className: c, design: s, disabled: r, intent: a, shape: t, size: o }), disabled: !!r, ...l });
7
+ return r.createElement(g, { "data-spark-component": "button", ref: b, className: x({ className: c, design: i, disabled: s, intent: a, shape: t, size: o }), disabled: !!s, ...l });
8
8
  });
9
9
  z.displayName = "Button";
10
10
  export {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spark-ui/button",
3
- "version": "1.10.0",
3
+ "version": "1.11.1",
4
4
  "description": "Button component is used to trigger an action or event, such as submitting a form, opening a Dialog, canceling an action, or performing a delete operation.",
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -17,7 +17,7 @@
17
17
  "class-variance-authority": "0.5.2"
18
18
  },
19
19
  "devDependencies": {
20
- "@spark-ui/icons": "^1.10.0"
20
+ "@spark-ui/icons": "^1.10.2"
21
21
  },
22
22
  "peerDependencies": {
23
23
  "react": "16.8 || ^17.0 || ^18.0",
@@ -33,5 +33,6 @@
33
33
  "url": "https://github.com/adevinta/spark/issues"
34
34
  },
35
35
  "homepage": "https://sparkui.vercel.app",
36
- "license": "MIT"
36
+ "license": "MIT",
37
+ "gitHead": "f337f456853f839bf9665041e39c9b0fedcb6c76"
37
38
  }