npm - @telegraph/button - Versions diffs - 0.2.7 → 0.3.0 - Mend

@telegraph/button 0.2.7 → 0.3.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.

Files changed (8) hide show

package/CHANGELOG.md +11 -0
package/dist/cjs/index.js +1 -1
package/dist/cjs/index.js.map +1 -1
package/dist/css/default.css +1 -1
package/dist/esm/index.mjs +68 -68
package/dist/esm/index.mjs.map +1 -1
package/dist/types/Button/Button.d.ts.map +1 -1
package/package.json +2 -2

package/CHANGELOG.md CHANGED Viewed

@@ -1,5 +1,16 @@
 # @telegraph/button
+## 0.3.0
+### Minor Changes
+- [#615](https://github.com/knocklabs/telegraph/pull/615) [`8d9f23c`](https://github.com/knocklabs/telegraph/commit/8d9f23cdc43701b6a281cd4ac0c6a1d5fdfe107a) Thanks [@kylemcd](https://github.com/kylemcd)! - feat: add spinner component and utilize within the button component
+### Patch Changes
+- Updated dependencies [[`8d9f23c`](https://github.com/knocklabs/telegraph/commit/8d9f23cdc43701b6a281cd4ac0c6a1d5fdfe107a)]:
+  - @telegraph/icon@0.3.0
 ## 0.2.7
 ### Patch Changes

package/dist/cjs/index.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),V=require("@telegraph/helpers"),j=require("@telegraph/icon"),E=require("@telegraph/layout"),O=require("@telegraph/style-engine"),P=require("@telegraph/typography"),R=require("clsx"),B=require("lucide-react"),b=require("react"),L={default_buttonShadowColor:{cssVar:"--box-shadow",value:"inset 0 0 0 1px var(--tgph-VARIABLE)"},hover_buttonShadowColor:{cssVar:"--tgph-button-hover-shadow",value:"inset 0 0 0 1px var(--tgph-VARIABLE)"},focus_buttonShadowColor:{cssVar:"--tgph-button-focus-shadow",value:"inset 0 0 0 1px var(--tgph-VARIABLE)"},active_buttonShadowColor:{cssVar:"--tgph-button-active-shadow",value:"inset 0 0 0 1px var(--tgph-VARIABLE)"},hover_textColor:{cssVar:"--tgph-button-hover-text-color",value:"var(--tgph-VARIABLE)"}},M={solid:{default:{backgroundColor:"gray-12",hover_backgroundColor:"gray-11",focus_backgroundColor:"gray-10",active_backgroundColor:"gray-10",hover_textColor:"white"},accent:{backgroundColor:"accent-9",hover_backgroundColor:"accent-10",focus_backgroundColor:"accent-11",active_backgroundColor:"accent-11",hover_textColor:"white"},red:{backgroundColor:"red-9",hover_backgroundColor:"red-10",focus_backgroundColor:"red-11",active_backgroundColor:"red-11",hover_textColor:"white"},gray:{backgroundColor:"gray-9",hover_backgroundColor:"gray-10",focus_backgroundColor:"gray-11",active_backgroundColor:"gray-11",hover_textColor:"white"},green:{backgroundColor:"green-9",hover_backgroundColor:"green-10",focus_backgroundColor:"green-11",active_backgroundColor:"green-11",hover_textColor:"white"},blue:{backgroundColor:"blue-9",hover_backgroundColor:"blue-10",focus_backgroundColor:"blue-11",active_backgroundColor:"blue-11",hover_textColor:"white"},yellow:{backgroundColor:"yellow-9",hover_backgroundColor:"yellow-10",focus_backgroundColor:"yellow-11",active_backgroundColor:"yellow-11",hover_textColor:"white"},purple:{backgroundColor:"purple-9",hover_backgroundColor:"purple-10",focus_backgroundColor:"purple-11",active_backgroundColor:"purple-11",hover_textColor:"white"}},soft:{default:{backgroundColor:"gray-3",hover_backgroundColor:"gray-4",focus_backgroundColor:"gray-5",active_backgroundColor:"gray-5",hover_textColor:"gray-12"},gray:{backgroundColor:"gray-3",hover_backgroundColor:"gray-4",focus_backgroundColor:"gray-5",active_backgroundColor:"gray-5",hover_textColor:"gray-12"},red:{backgroundColor:"red-3",hover_backgroundColor:"red-4",focus_backgroundColor:"red-5",active_backgroundColor:"red-5",hover_textColor:"red-11"},accent:{backgroundColor:"accent-3",hover_backgroundColor:"accent-4",focus_backgroundColor:"accent-5",active_backgroundColor:"accent-5",hover_textColor:"accent-11"},green:{backgroundColor:"green-3",hover_backgroundColor:"green-4",focus_backgroundColor:"green-5",active_backgroundColor:"green-5",hover_textColor:"green-11"},blue:{backgroundColor:"blue-3",hover_backgroundColor:"blue-4",focus_backgroundColor:"blue-5",active_backgroundColor:"blue-5",hover_textColor:"blue-11"},yellow:{backgroundColor:"yellow-3",hover_backgroundColor:"yellow-4",focus_backgroundColor:"yellow-5",active_backgroundColor:"yellow-5",hover_textColor:"yellow-11"},purple:{backgroundColor:"purple-3",hover_backgroundColor:"purple-4",focus_backgroundColor:"purple-5",active_backgroundColor:"purple-5",hover_textColor:"purple-11"}},outline:{default:{backgroundColor:"surface-1",hover_backgroundColor:"gray-2",default_buttonShadowColor:"gray-6",hover_buttonShadowColor:"gray-7",focus_buttonShadowColor:"gray-8",active_buttonShadowColor:"gray-8",hover_textColor:"gray-12"},gray:{backgroundColor:"surface-1",hover_backgroundColor:"gray-2",default_buttonShadowColor:"gray-6",hover_buttonShadowColor:"gray-7",focus_buttonShadowColor:"gray-8",active_buttonShadowColor:"gray-8",hover_textColor:"gray-12"},red:{backgroundColor:"surface-1",hover_backgroundColor:"red-2",default_buttonShadowColor:"red-6",hover_buttonShadowColor:"red-7",focus_buttonShadowColor:"red-8",active_buttonShadowColor:"red-8",hover_textColor:"red-11"},accent:{backgroundColor:"surface-1",hover_backgroundColor:"accent-2",default_buttonShadowColor:"accent-6",hover_buttonShadowColor:"accent-7",focus_buttonShadowColor:"accent-8",active_buttonShadowColor:"accent-8",hover_textColor:"accent-11"},green:{backgroundColor:"surface-1",hover_backgroundColor:"green-2",default_buttonShadowColor:"green-6",hover_buttonShadowColor:"green-7",focus_buttonShadowColor:"green-8",active_buttonShadowColor:"green-8",hover_textColor:"green-11"},blue:{backgroundColor:"surface-1",hover_backgroundColor:"blue-2",default_buttonShadowColor:"blue-6",hover_buttonShadowColor:"blue-7",focus_buttonShadowColor:"blue-8",active_buttonShadowColor:"blue-8",hover_textColor:"blue-11"},yellow:{backgroundColor:"surface-1",hover_backgroundColor:"yellow-2",default_buttonShadowColor:"yellow-6",hover_buttonShadowColor:"yellow-7",focus_buttonShadowColor:"yellow-8",active_buttonShadowColor:"yellow-8",hover_textColor:"yellow-11"},purple:{backgroundColor:"surface-1",hover_backgroundColor:"purple-2",default_buttonShadowColor:"purple-6",hover_buttonShadowColor:"purple-7",focus_buttonShadowColor:"purple-8",active_buttonShadowColor:"purple-8",hover_textColor:"purple-11"}},ghost:{default:{backgroundColor:"transparent",hover_backgroundColor:"gray-3",focus_backgroundColor:"gray-4",active_backgroundColor:"gray-4",hover_textColor:"gray-12"},gray:{backgroundColor:"transparent",hover_backgroundColor:"gray-3",focus_backgroundColor:"gray-4",active_backgroundColor:"gray-4",hover_textColor:"gray-12"},red:{backgroundColor:"transparent",hover_backgroundColor:"red-3",focus_backgroundColor:"red-4",active_backgroundColor:"red-4",hover_textColor:"red-11"},accent:{backgroundColor:"transparent",hover_backgroundColor:"accent-3",focus_backgroundColor:"accent-4",active_backgroundColor:"accent-4",hover_textColor:"accent-11"},green:{backgroundColor:"transparent",hover_backgroundColor:"green-3",focus_backgroundColor:"green-4",active_backgroundColor:"green-4",hover_textColor:"green-11"},blue:{backgroundColor:"transparent",hover_backgroundColor:"blue-3",focus_backgroundColor:"blue-4",active_backgroundColor:"blue-4",hover_textColor:"blue-11"},yellow:{backgroundColor:"transparent",hover_backgroundColor:"yellow-3",focus_backgroundColor:"yellow-4",active_backgroundColor:"yellow-4",hover_textColor:"yellow-11"},purple:{backgroundColor:"transparent",hover_backgroundColor:"purple-3",focus_backgroundColor:"purple-4",active_backgroundColor:"purple-4",hover_textColor:"purple-11"}}},m={default:{0:{w:"auto",h:"5",gap:"0_5",px:"1",rounded:"2"},1:{w:"auto",h:"6",gap:"1",px:"1_5",rounded:"2"},2:{w:"auto",h:"8",gap:"1_5",px:"2",rounded:"2"},3:{w:"auto",h:"10",gap:"2",px:"3",rounded:"3"}},"icon-only":{0:{w:"5",h:"5",gap:"0",px:"0",rounded:"2"},1:{w:"6",h:"6",gap:"0",px:"0",rounded:"2"},2:{w:"8",h:"8",gap:"0",px:"0",rounded:"2"},3:{w:"10",h:"10",gap:"0",px:"0",rounded:"3"}}},q={0:"0",1:"1",2:"2",3:"3"},N={solid:{default:"white",gray:"white",red:"white",accent:"white",green:"white",blue:"white",yellow:"white",purple:"white",disabled:"disabled"},soft:{default:"default",gray:"gray",red:"red",accent:"accent",green:"green",blue:"blue",yellow:"yellow",purple:"purple",disabled:"disabled"},outline:{default:"default",gray:"gray",red:"red",accent:"accent",green:"green",blue:"blue",yellow:"yellow",purple:"purple",disabled:"disabled"},ghost:{default:"default",gray:"gray",red:"red",accent:"accent",green:"green",blue:"blue",yellow:"yellow",purple:"purple",disabled:"disabled"}},z={0:"0",1:"1",2:"2",3:"3"},D={solid:{default:"white",gray:"white",red:"white",accent:"white",green:"white",blue:"white",yellow:"white",purple:"white",disabled:"disabled"},soft:{default:"default",accent:"accent",gray:"gray",red:"red",green:"green",blue:"blue",yellow:"yellow",purple:"purple",disabled:"disabled"},outline:{default:"default",accent:"accent",gray:"gray",red:"red",green:"green",blue:"blue",yellow:"yellow",purple:"purple",disabled:"disabled"},ghost:{default:"gray",accent:"accent",gray:"gray",red:"red",green:"green",blue:"blue",yellow:"yellow",purple:"purple",disabled:"disabled"}},Z={default:"secondary","icon-only":"primary"},v=b.createContext({variant:"solid",size:"2",color:"default",state:"default",layout:"default",active:!1}),U=o=>o.disabled?"disabled":o.state==="loading"?"loading":o.active?"active":o.state,w=({as:o,variant:r="solid",size:l="2",color:e="default",state:n="default",active:t=!1,type:u="button",disabled:d,className:c,children:g,style:h,...S})=>{const A=U({state:n,disabled:d,active:t}),s=V.useDeterminateState({value:A,determinateValue:"loading",minDurationMs:1200}),{styleProp:I,otherProps:T}=O.useStyleEngine({props:{...M[r][e],style:h},cssVars:L}),y=d||!o?"button":o,_=b.useMemo(()=>{var k;const C=b.Children.toArray(g);if((C==null?void 0:C.length)===1&&b.isValidElement(C[0])){const p=C[0];if((k=p==null?void 0:p.props)!=null&&k.icon)return"icon-only"}return"default"},[g]);return a.jsx(v.Provider,{value:{variant:r,size:l,color:e,state:s,layout:_,active:t},children:a.jsxs(E.Stack,{as:y,className:R("tgph-button",c),display:"inline-flex",align:"center",justify:"center",...m[_][l],style:I,"data-tgph-button":!0,"data-tgph-button-layout":_,"data-tgph-button-state":s,"data-tgph-button-variant":r,"data-tgph-button-color":e,disabled:s==="disabled"||s==="loading",...y==="button"&&{type:u},...T,...S,children:[s==="loading"&&a.jsx(i,{icon:B.LoaderCircle,"aria-hidden":!0,"data-tgph-button-loading-icon":!0}),g]})})},i=({size:o,color:r,variant:l,icon:e,alt:n,"aria-hidden":t,internal_iconType:u,...d})=>{const c=b.useContext(v),g={size:o??z[c.size],color:r??D[c.variant][c.state==="disabled"?"disabled":c.color],variant:l??Z[c.layout]},h=n?{alt:n}:{"aria-hidden":t};return c.state==="loading"&&u==="leading"?null:a.jsx(j.Icon,{icon:e,"data-button-icon":!0,"data-button-icon-color":g.color,...h,...g,...d})},f=({as:o,color:r,size:l,weight:e="medium",style:n,...t})=>{const u=b.useContext(v),d=r??N[u.variant][u.state==="disabled"?"disabled":u.color];return a.jsx(P.Text,{as:o||"span",color:d,size:l??q[u.size],weight:e,internal_optionalAs:!0,"data-button-text":!0,"data-button-text-color":d,style:{textDecoration:"none",whiteSpace:"nowrap",...n},...t})},x=({leadingIcon:o,trailingIcon:r,icon:l,children:e,...n})=>{const t=o||l;return a.jsxs(w,{...n,children:[t&&a.jsx(i,{...t,internal_iconType:"leading"}),e&&a.jsx(f,{children:e}),r&&a.jsx(i,{...r,internal_iconType:"trailing"})]})};Object.assign(x,{Root:w,Icon:i,Text:f});const X=x;exports.Button=X;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react/jsx-runtime"),P=require("@telegraph/helpers"),w=require("@telegraph/icon"),R=require("@telegraph/layout"),B=require("@telegraph/style-engine"),M=require("@telegraph/typography"),m=require("clsx"),b=require("react"),L={default_buttonShadowColor:{cssVar:"--box-shadow",value:"inset 0 0 0 1px var(--tgph-VARIABLE)"},hover_buttonShadowColor:{cssVar:"--tgph-button-hover-shadow",value:"inset 0 0 0 1px var(--tgph-VARIABLE)"},focus_buttonShadowColor:{cssVar:"--tgph-button-focus-shadow",value:"inset 0 0 0 1px var(--tgph-VARIABLE)"},active_buttonShadowColor:{cssVar:"--tgph-button-active-shadow",value:"inset 0 0 0 1px var(--tgph-VARIABLE)"},hover_textColor:{cssVar:"--tgph-button-hover-text-color",value:"var(--tgph-VARIABLE)"}},q={solid:{default:{backgroundColor:"gray-12",hover_backgroundColor:"gray-11",focus_backgroundColor:"gray-10",active_backgroundColor:"gray-10",hover_textColor:"white"},accent:{backgroundColor:"accent-9",hover_backgroundColor:"accent-10",focus_backgroundColor:"accent-11",active_backgroundColor:"accent-11",hover_textColor:"white"},red:{backgroundColor:"red-9",hover_backgroundColor:"red-10",focus_backgroundColor:"red-11",active_backgroundColor:"red-11",hover_textColor:"white"},gray:{backgroundColor:"gray-9",hover_backgroundColor:"gray-10",focus_backgroundColor:"gray-11",active_backgroundColor:"gray-11",hover_textColor:"white"},green:{backgroundColor:"green-9",hover_backgroundColor:"green-10",focus_backgroundColor:"green-11",active_backgroundColor:"green-11",hover_textColor:"white"},blue:{backgroundColor:"blue-9",hover_backgroundColor:"blue-10",focus_backgroundColor:"blue-11",active_backgroundColor:"blue-11",hover_textColor:"white"},yellow:{backgroundColor:"yellow-9",hover_backgroundColor:"yellow-10",focus_backgroundColor:"yellow-11",active_backgroundColor:"yellow-11",hover_textColor:"white"},purple:{backgroundColor:"purple-9",hover_backgroundColor:"purple-10",focus_backgroundColor:"purple-11",active_backgroundColor:"purple-11",hover_textColor:"white"}},soft:{default:{backgroundColor:"gray-3",hover_backgroundColor:"gray-4",focus_backgroundColor:"gray-5",active_backgroundColor:"gray-5",hover_textColor:"gray-12"},gray:{backgroundColor:"gray-3",hover_backgroundColor:"gray-4",focus_backgroundColor:"gray-5",active_backgroundColor:"gray-5",hover_textColor:"gray-12"},red:{backgroundColor:"red-3",hover_backgroundColor:"red-4",focus_backgroundColor:"red-5",active_backgroundColor:"red-5",hover_textColor:"red-11"},accent:{backgroundColor:"accent-3",hover_backgroundColor:"accent-4",focus_backgroundColor:"accent-5",active_backgroundColor:"accent-5",hover_textColor:"accent-11"},green:{backgroundColor:"green-3",hover_backgroundColor:"green-4",focus_backgroundColor:"green-5",active_backgroundColor:"green-5",hover_textColor:"green-11"},blue:{backgroundColor:"blue-3",hover_backgroundColor:"blue-4",focus_backgroundColor:"blue-5",active_backgroundColor:"blue-5",hover_textColor:"blue-11"},yellow:{backgroundColor:"yellow-3",hover_backgroundColor:"yellow-4",focus_backgroundColor:"yellow-5",active_backgroundColor:"yellow-5",hover_textColor:"yellow-11"},purple:{backgroundColor:"purple-3",hover_backgroundColor:"purple-4",focus_backgroundColor:"purple-5",active_backgroundColor:"purple-5",hover_textColor:"purple-11"}},outline:{default:{backgroundColor:"surface-1",hover_backgroundColor:"gray-2",default_buttonShadowColor:"gray-6",hover_buttonShadowColor:"gray-7",focus_buttonShadowColor:"gray-8",active_buttonShadowColor:"gray-8",hover_textColor:"gray-12"},gray:{backgroundColor:"surface-1",hover_backgroundColor:"gray-2",default_buttonShadowColor:"gray-6",hover_buttonShadowColor:"gray-7",focus_buttonShadowColor:"gray-8",active_buttonShadowColor:"gray-8",hover_textColor:"gray-12"},red:{backgroundColor:"surface-1",hover_backgroundColor:"red-2",default_buttonShadowColor:"red-6",hover_buttonShadowColor:"red-7",focus_buttonShadowColor:"red-8",active_buttonShadowColor:"red-8",hover_textColor:"red-11"},accent:{backgroundColor:"surface-1",hover_backgroundColor:"accent-2",default_buttonShadowColor:"accent-6",hover_buttonShadowColor:"accent-7",focus_buttonShadowColor:"accent-8",active_buttonShadowColor:"accent-8",hover_textColor:"accent-11"},green:{backgroundColor:"surface-1",hover_backgroundColor:"green-2",default_buttonShadowColor:"green-6",hover_buttonShadowColor:"green-7",focus_buttonShadowColor:"green-8",active_buttonShadowColor:"green-8",hover_textColor:"green-11"},blue:{backgroundColor:"surface-1",hover_backgroundColor:"blue-2",default_buttonShadowColor:"blue-6",hover_buttonShadowColor:"blue-7",focus_buttonShadowColor:"blue-8",active_buttonShadowColor:"blue-8",hover_textColor:"blue-11"},yellow:{backgroundColor:"surface-1",hover_backgroundColor:"yellow-2",default_buttonShadowColor:"yellow-6",hover_buttonShadowColor:"yellow-7",focus_buttonShadowColor:"yellow-8",active_buttonShadowColor:"yellow-8",hover_textColor:"yellow-11"},purple:{backgroundColor:"surface-1",hover_backgroundColor:"purple-2",default_buttonShadowColor:"purple-6",hover_buttonShadowColor:"purple-7",focus_buttonShadowColor:"purple-8",active_buttonShadowColor:"purple-8",hover_textColor:"purple-11"}},ghost:{default:{backgroundColor:"transparent",hover_backgroundColor:"gray-3",focus_backgroundColor:"gray-4",active_backgroundColor:"gray-4",hover_textColor:"gray-12"},gray:{backgroundColor:"transparent",hover_backgroundColor:"gray-3",focus_backgroundColor:"gray-4",active_backgroundColor:"gray-4",hover_textColor:"gray-12"},red:{backgroundColor:"transparent",hover_backgroundColor:"red-3",focus_backgroundColor:"red-4",active_backgroundColor:"red-4",hover_textColor:"red-11"},accent:{backgroundColor:"transparent",hover_backgroundColor:"accent-3",focus_backgroundColor:"accent-4",active_backgroundColor:"accent-4",hover_textColor:"accent-11"},green:{backgroundColor:"transparent",hover_backgroundColor:"green-3",focus_backgroundColor:"green-4",active_backgroundColor:"green-4",hover_textColor:"green-11"},blue:{backgroundColor:"transparent",hover_backgroundColor:"blue-3",focus_backgroundColor:"blue-4",active_backgroundColor:"blue-4",hover_textColor:"blue-11"},yellow:{backgroundColor:"transparent",hover_backgroundColor:"yellow-3",focus_backgroundColor:"yellow-4",active_backgroundColor:"yellow-4",hover_textColor:"yellow-11"},purple:{backgroundColor:"transparent",hover_backgroundColor:"purple-3",focus_backgroundColor:"purple-4",active_backgroundColor:"purple-4",hover_textColor:"purple-11"}}},N={default:{0:{w:"auto",h:"5",gap:"0_5",px:"1",rounded:"2"},1:{w:"auto",h:"6",gap:"1",px:"1_5",rounded:"2"},2:{w:"auto",h:"8",gap:"1_5",px:"2",rounded:"2"},3:{w:"auto",h:"10",gap:"2",px:"3",rounded:"3"}},"icon-only":{0:{w:"5",h:"5",gap:"0",px:"0",rounded:"2"},1:{w:"6",h:"6",gap:"0",px:"0",rounded:"2"},2:{w:"8",h:"8",gap:"0",px:"0",rounded:"2"},3:{w:"10",h:"10",gap:"0",px:"0",rounded:"3"}}},z={0:"0",1:"1",2:"2",3:"3"},D={solid:{default:"white",gray:"white",red:"white",accent:"white",green:"white",blue:"white",yellow:"white",purple:"white",disabled:"disabled"},soft:{default:"default",gray:"gray",red:"red",accent:"accent",green:"green",blue:"blue",yellow:"yellow",purple:"purple",disabled:"disabled"},outline:{default:"default",gray:"gray",red:"red",accent:"accent",green:"green",blue:"blue",yellow:"yellow",purple:"purple",disabled:"disabled"},ghost:{default:"default",gray:"gray",red:"red",accent:"accent",green:"green",blue:"blue",yellow:"yellow",purple:"purple",disabled:"disabled"}},f={0:"0",1:"1",2:"2",3:"3"},x={solid:{default:"white",gray:"white",red:"white",accent:"white",green:"white",blue:"white",yellow:"white",purple:"white",disabled:"disabled"},soft:{default:"default",accent:"accent",gray:"gray",red:"red",green:"green",blue:"blue",yellow:"yellow",purple:"purple",disabled:"disabled"},outline:{default:"default",accent:"accent",gray:"gray",red:"red",green:"green",blue:"blue",yellow:"yellow",purple:"purple",disabled:"disabled"},ghost:{default:"gray",accent:"accent",gray:"gray",red:"red",green:"green",blue:"blue",yellow:"yellow",purple:"purple",disabled:"disabled"}},S={default:"secondary","icon-only":"primary"},v=b.createContext({variant:"solid",size:"2",color:"default",state:"default",layout:"default",active:!1}),Z=o=>o.disabled?"disabled":o.state==="loading"?"loading":o.active?"active":o.state,A=({as:o,variant:r="solid",size:t="2",color:e="default",state:n="default",active:a=!1,type:u="button",disabled:d,className:c,children:g,style:h,...V})=>{const j=Z({state:n,disabled:d,active:a}),s=P.useDeterminateState({value:j,determinateValue:"loading",minDurationMs:1200}),{styleProp:E,otherProps:O}=B.useStyleEngine({props:{...q[r][e],style:h},cssVars:L}),y=d||!o?"button":o,i=b.useMemo(()=>{var k;const C=b.Children.toArray(g);if((C==null?void 0:C.length)===1&&b.isValidElement(C[0])){const _=C[0];if((k=_==null?void 0:_.props)!=null&&k.icon)return"icon-only"}return"default"},[g]);return l.jsx(v.Provider,{value:{variant:r,size:t,color:e,state:s,layout:i,active:a},children:l.jsxs(R.Stack,{as:y,className:m("tgph-button",c),display:"inline-flex",align:"center",justify:"center",...N[i][t],style:E,"data-tgph-button":!0,"data-tgph-button-layout":i,"data-tgph-button-state":s,"data-tgph-button-variant":r,"data-tgph-button-color":e,disabled:s==="disabled"||s==="loading",...y==="button"&&{type:u},...O,...V,children:[s==="loading"&&l.jsx(w.Spinner,{size:f[t],color:x[r][e],variant:S[i],"data-tgph-button-loading-icon":!0}),g]})})},p=({size:o,color:r,variant:t,icon:e,alt:n,"aria-hidden":a,internal_iconType:u,...d})=>{const c=b.useContext(v),g={size:o??f[c.size],color:r??x[c.variant][c.state==="disabled"?"disabled":c.color],variant:t??S[c.layout]},h=n?{alt:n}:{"aria-hidden":a};return c.state==="loading"&&u==="leading"?null:l.jsx(w.Icon,{icon:e,"data-button-icon":!0,"data-button-icon-color":g.color,...h,...g,...d})},I=({as:o,color:r,size:t,weight:e="medium",style:n,...a})=>{const u=b.useContext(v),d=r??D[u.variant][u.state==="disabled"?"disabled":u.color];return l.jsx(M.Text,{as:o||"span",color:d,size:t??z[u.size],weight:e,internal_optionalAs:!0,"data-button-text":!0,"data-button-text-color":d,style:{textDecoration:"none",whiteSpace:"nowrap",...n},...a})},T=({leadingIcon:o,trailingIcon:r,icon:t,children:e,...n})=>{const a=o||t;return l.jsxs(A,{...n,children:[a&&l.jsx(p,{...a,internal_iconType:"leading"}),e&&l.jsx(I,{children:e}),r&&l.jsx(p,{...r,internal_iconType:"trailing"})]})};Object.assign(T,{Root:A,Icon:p,Text:I});const U=T;exports.Button=U;
 //# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":["../../src/Button/Button.constants.ts","../../src/Button/Button.tsx"],"sourcesContent":["import type { tokens } from \"@telegraph/style-engine\";\nimport type { CssVarProp } from \"@telegraph/style-engine\";\n\n// Styles for controlling the \"border\" on the outline variant\n// of the button. We use a shadow so we don't need apply a border\n// to all other buttons to make them the same height.\nexport type BaseStyleProps = {\n default_buttonShadowColor: keyof typeof tokens.color;\n hover_buttonShadowColor: keyof typeof tokens.color;\n focus_buttonShadowColor: keyof typeof tokens.color;\n active_buttonShadowColor: keyof typeof tokens.color;\n hover_textColor?: keyof typeof tokens.color;\n};\n\nexport const cssVars: Record<keyof BaseStyleProps, CssVarProp> = {\n default_buttonShadowColor: {\n cssVar: \"--box-shadow\",\n value: \"inset 0 0 0 1px var(--tgph-VARIABLE)\",\n },\n hover_buttonShadowColor: {\n cssVar: \"--tgph-button-hover-shadow\",\n value: \"inset 0 0 0 1px var(--tgph-VARIABLE)\",\n },\n focus_buttonShadowColor: {\n cssVar: \"--tgph-button-focus-shadow\",\n value: \"inset 0 0 0 1px var(--tgph-VARIABLE)\",\n },\n active_buttonShadowColor: {\n cssVar: \"--tgph-button-active-shadow\",\n value: \"inset 0 0 0 1px var(--tgph-VARIABLE)\",\n },\n hover_textColor: {\n cssVar: \"--tgph-button-hover-text-color\",\n value: \"var(--tgph-VARIABLE)\",\n },\n} as const;\n\nexport const BUTTON_COLOR_MAP = {\n solid: {\n default: {\n backgroundColor: \"gray-12\",\n hover_backgroundColor: \"gray-11\",\n focus_backgroundColor: \"gray-10\",\n active_backgroundColor: \"gray-10\",\n hover_textColor: \"white\",\n },\n accent: {\n backgroundColor: \"accent-9\",\n hover_backgroundColor: \"accent-10\",\n focus_backgroundColor: \"accent-11\",\n active_backgroundColor: \"accent-11\",\n hover_textColor: \"white\",\n },\n red: {\n backgroundColor: \"red-9\",\n hover_backgroundColor: \"red-10\",\n focus_backgroundColor: \"red-11\",\n active_backgroundColor: \"red-11\",\n hover_textColor: \"white\",\n },\n gray: {\n backgroundColor: \"gray-9\",\n hover_backgroundColor: \"gray-10\",\n focus_backgroundColor: \"gray-11\",\n active_backgroundColor: \"gray-11\",\n hover_textColor: \"white\",\n },\n green: {\n backgroundColor: \"green-9\",\n hover_backgroundColor: \"green-10\",\n focus_backgroundColor: \"green-11\",\n active_backgroundColor: \"green-11\",\n hover_textColor: \"white\",\n },\n blue: {\n backgroundColor: \"blue-9\",\n hover_backgroundColor: \"blue-10\",\n focus_backgroundColor: \"blue-11\",\n active_backgroundColor: \"blue-11\",\n hover_textColor: \"white\",\n },\n yellow: {\n backgroundColor: \"yellow-9\",\n hover_backgroundColor: \"yellow-10\",\n focus_backgroundColor: \"yellow-11\",\n active_backgroundColor: \"yellow-11\",\n hover_textColor: \"white\",\n },\n purple: {\n backgroundColor: \"purple-9\",\n hover_backgroundColor: \"purple-10\",\n focus_backgroundColor: \"purple-11\",\n active_backgroundColor: \"purple-11\",\n hover_textColor: \"white\",\n },\n },\n soft: {\n default: {\n backgroundColor: \"gray-3\",\n hover_backgroundColor: \"gray-4\",\n focus_backgroundColor: \"gray-5\",\n active_backgroundColor: \"gray-5\",\n hover_textColor: \"gray-12\",\n },\n gray: {\n backgroundColor: \"gray-3\",\n hover_backgroundColor: \"gray-4\",\n focus_backgroundColor: \"gray-5\",\n active_backgroundColor: \"gray-5\",\n hover_textColor: \"gray-12\",\n },\n red: {\n backgroundColor: \"red-3\",\n hover_backgroundColor: \"red-4\",\n focus_backgroundColor: \"red-5\",\n active_backgroundColor: \"red-5\",\n hover_textColor: \"red-11\",\n },\n accent: {\n backgroundColor: \"accent-3\",\n hover_backgroundColor: \"accent-4\",\n focus_backgroundColor: \"accent-5\",\n active_backgroundColor: \"accent-5\",\n hover_textColor: \"accent-11\",\n },\n green: {\n backgroundColor: \"green-3\",\n hover_backgroundColor: \"green-4\",\n focus_backgroundColor: \"green-5\",\n active_backgroundColor: \"green-5\",\n hover_textColor: \"green-11\",\n },\n blue: {\n backgroundColor: \"blue-3\",\n hover_backgroundColor: \"blue-4\",\n focus_backgroundColor: \"blue-5\",\n active_backgroundColor: \"blue-5\",\n hover_textColor: \"blue-11\",\n },\n yellow: {\n backgroundColor: \"yellow-3\",\n hover_backgroundColor: \"yellow-4\",\n focus_backgroundColor: \"yellow-5\",\n active_backgroundColor: \"yellow-5\",\n hover_textColor: \"yellow-11\",\n },\n purple: {\n backgroundColor: \"purple-3\",\n hover_backgroundColor: \"purple-4\",\n focus_backgroundColor: \"purple-5\",\n active_backgroundColor: \"purple-5\",\n hover_textColor: \"purple-11\",\n },\n },\n outline: {\n default: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"gray-2\",\n default_buttonShadowColor: \"gray-6\",\n hover_buttonShadowColor: \"gray-7\",\n focus_buttonShadowColor: \"gray-8\",\n active_buttonShadowColor: \"gray-8\",\n hover_textColor: \"gray-12\",\n },\n gray: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"gray-2\",\n default_buttonShadowColor: \"gray-6\",\n hover_buttonShadowColor: \"gray-7\",\n focus_buttonShadowColor: \"gray-8\",\n active_buttonShadowColor: \"gray-8\",\n hover_textColor: \"gray-12\",\n },\n red: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"red-2\",\n default_buttonShadowColor: \"red-6\",\n hover_buttonShadowColor: \"red-7\",\n focus_buttonShadowColor: \"red-8\",\n active_buttonShadowColor: \"red-8\",\n hover_textColor: \"red-11\",\n },\n accent: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"accent-2\",\n default_buttonShadowColor: \"accent-6\",\n hover_buttonShadowColor: \"accent-7\",\n focus_buttonShadowColor: \"accent-8\",\n active_buttonShadowColor: \"accent-8\",\n hover_textColor: \"accent-11\",\n },\n green: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"green-2\",\n default_buttonShadowColor: \"green-6\",\n hover_buttonShadowColor: \"green-7\",\n focus_buttonShadowColor: \"green-8\",\n active_buttonShadowColor: \"green-8\",\n hover_textColor: \"green-11\",\n },\n blue: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"blue-2\",\n default_buttonShadowColor: \"blue-6\",\n hover_buttonShadowColor: \"blue-7\",\n focus_buttonShadowColor: \"blue-8\",\n active_buttonShadowColor: \"blue-8\",\n hover_textColor: \"blue-11\",\n },\n yellow: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"yellow-2\",\n default_buttonShadowColor: \"yellow-6\",\n hover_buttonShadowColor: \"yellow-7\",\n focus_buttonShadowColor: \"yellow-8\",\n active_buttonShadowColor: \"yellow-8\",\n hover_textColor: \"yellow-11\",\n },\n purple: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"purple-2\",\n default_buttonShadowColor: \"purple-6\",\n hover_buttonShadowColor: \"purple-7\",\n focus_buttonShadowColor: \"purple-8\",\n active_buttonShadowColor: \"purple-8\",\n hover_textColor: \"purple-11\",\n },\n },\n ghost: {\n default: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"gray-3\",\n focus_backgroundColor: \"gray-4\",\n active_backgroundColor: \"gray-4\",\n hover_textColor: \"gray-12\",\n },\n gray: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"gray-3\",\n focus_backgroundColor: \"gray-4\",\n active_backgroundColor: \"gray-4\",\n hover_textColor: \"gray-12\",\n },\n red: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"red-3\",\n focus_backgroundColor: \"red-4\",\n active_backgroundColor: \"red-4\",\n hover_textColor: \"red-11\",\n },\n accent: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"accent-3\",\n focus_backgroundColor: \"accent-4\",\n active_backgroundColor: \"accent-4\",\n hover_textColor: \"accent-11\",\n },\n green: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"green-3\",\n focus_backgroundColor: \"green-4\",\n active_backgroundColor: \"green-4\",\n hover_textColor: \"green-11\",\n },\n blue: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"blue-3\",\n focus_backgroundColor: \"blue-4\",\n active_backgroundColor: \"blue-4\",\n hover_textColor: \"blue-11\",\n },\n yellow: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"yellow-3\",\n focus_backgroundColor: \"yellow-4\",\n active_backgroundColor: \"yellow-4\",\n hover_textColor: \"yellow-11\",\n },\n purple: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"purple-3\",\n focus_backgroundColor: \"purple-4\",\n active_backgroundColor: \"purple-4\",\n hover_textColor: \"purple-11\",\n },\n },\n} as const;\n\nexport const BUTTON_SIZE_MAP = {\n default: {\n \"0\": {\n w: \"auto\",\n h: \"5\",\n gap: \"0_5\",\n px: \"1\",\n rounded: \"2\",\n },\n \"1\": {\n w: \"auto\",\n h: \"6\",\n gap: \"1\",\n px: \"1_5\",\n rounded: \"2\",\n },\n \"2\": {\n w: \"auto\",\n h: \"8\",\n gap: \"1_5\",\n px: \"2\",\n rounded: \"2\",\n },\n \"3\": {\n w: \"auto\",\n h: \"10\",\n gap: \"2\",\n px: \"3\",\n rounded: \"3\",\n },\n },\n \"icon-only\": {\n \"0\": {\n w: \"5\",\n h: \"5\",\n gap: \"0\",\n px: \"0\",\n rounded: \"2\",\n },\n \"1\": {\n w: \"6\",\n h: \"6\",\n gap: \"0\",\n px: \"0\",\n rounded: \"2\",\n },\n \"2\": {\n w: \"8\",\n h: \"8\",\n gap: \"0\",\n px: \"0\",\n rounded: \"2\",\n },\n \"3\": {\n w: \"10\",\n h: \"10\",\n gap: \"0\",\n px: \"0\",\n rounded: \"3\",\n },\n },\n} as const;\n\nexport const TEXT_SIZE_MAP = {\n \"0\": \"0\",\n \"1\": \"1\",\n \"2\": \"2\",\n \"3\": \"3\",\n} as const;\n\nexport const TEXT_COLOR_MAP = {\n solid: {\n default: \"white\",\n gray: \"white\",\n red: \"white\",\n accent: \"white\",\n green: \"white\",\n blue: \"white\",\n yellow: \"white\",\n purple: \"white\",\n disabled: \"disabled\",\n },\n soft: {\n default: \"default\",\n gray: \"gray\",\n red: \"red\",\n accent: \"accent\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n outline: {\n default: \"default\",\n gray: \"gray\",\n red: \"red\",\n accent: \"accent\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n ghost: {\n default: \"default\",\n gray: \"gray\",\n red: \"red\",\n accent: \"accent\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n} as const;\n\nexport const ICON_SIZE_MAP = {\n \"0\": \"0\",\n \"1\": \"1\",\n \"2\": \"2\",\n \"3\": \"3\",\n} as const;\n\nexport const ICON_COLOR_MAP = {\n solid: {\n default: \"white\",\n gray: \"white\",\n red: \"white\",\n accent: \"white\",\n green: \"white\",\n blue: \"white\",\n yellow: \"white\",\n purple: \"white\",\n disabled: \"disabled\",\n },\n soft: {\n default: \"default\",\n accent: \"accent\",\n gray: \"gray\",\n red: \"red\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n outline: {\n default: \"default\",\n accent: \"accent\",\n gray: \"gray\",\n red: \"red\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n ghost: {\n default: \"gray\",\n accent: \"accent\",\n gray: \"gray\",\n red: \"red\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n} as const;\n\nexport const ICON_VARIANT_MAP = {\n default: \"secondary\",\n \"icon-only\": \"primary\",\n} as const;\n\nexport type ButtonVariant = keyof typeof BUTTON_COLOR_MAP;\nexport type ButtonColor = keyof (typeof BUTTON_COLOR_MAP)[ButtonVariant];\nexport type ButtonSize = keyof (typeof BUTTON_SIZE_MAP)[\"default\"];\n","import {\n type PolymorphicProps,\n type PolymorphicPropsWithTgphRef,\n RemappedOmit,\n type Required,\n type TgphComponentProps,\n type TgphElement,\n useDeterminateState,\n} from \"@telegraph/helpers\";\nimport { Icon as TelegraphIcon } from \"@telegraph/icon\";\nimport { Stack } from \"@telegraph/layout\";\nimport { useStyleEngine } from \"@telegraph/style-engine\";\nimport { Text as TelegraphText } from \"@telegraph/typography\";\nimport clsx from \"clsx\";\nimport { LoaderCircle } from \"lucide-react\";\nimport React from \"react\";\n\nimport {\n BUTTON_COLOR_MAP,\n BUTTON_SIZE_MAP,\n type ButtonColor,\n type ButtonSize,\n type ButtonVariant,\n ICON_COLOR_MAP,\n ICON_SIZE_MAP,\n ICON_VARIANT_MAP,\n TEXT_COLOR_MAP,\n TEXT_SIZE_MAP,\n cssVars,\n} from \"./Button.constants\";\n\ntype RootBaseProps = {\n variant?: ButtonVariant;\n color?: ButtonColor;\n size?: ButtonSize;\n state?: \"default\" \| \"loading\";\n active?: boolean;\n};\n\ntype InternalProps = {\n layout: \"default\" \| \"icon-only\";\n color: Required<RootBaseProps>[\"color\"];\n state: Required<RootBaseProps>[\"state\"] \| \"disabled\" \| \"active\";\n};\n\ntype RootProps<T extends TgphElement> = Omit<\n TgphComponentProps<typeof Stack>,\n \"tgphRef\"\n> &\n PolymorphicPropsWithTgphRef<T, HTMLButtonElement> &\n RootBaseProps;\n\nconst ButtonContext = React.createContext<\n Required<Omit<RootBaseProps, \"color\" \| \"as\" \| \"state\"> & InternalProps>\n>({\n variant: \"solid\",\n size: \"2\",\n color: \"default\",\n state: \"default\",\n layout: \"default\",\n active: false,\n});\n\ntype DeriveStateParams = {\n state: Required<RootBaseProps>[\"state\"];\n disabled?: boolean;\n active?: boolean;\n};\n\n// Derive the state of the button based on the html button props in\nconst deriveState = (params: DeriveStateParams): InternalProps[\"state\"] => {\n if (params.disabled) return \"disabled\";\n if (params.state === \"loading\") return \"loading\";\n if (params.active) return \"active\";\n return params.state;\n};\n\nconst Root = <T extends TgphElement>({\n as,\n variant = \"solid\",\n size = \"2\",\n color = \"default\",\n state: stateProp = \"default\",\n active = false,\n type = \"button\",\n disabled,\n className,\n children,\n style,\n ...props\n}: RootProps<T>) => {\n const derivedState = deriveState({ state: stateProp, disabled, active });\n const state = useDeterminateState<DefaultProps<T>[\"state\"]>({\n value: derivedState,\n determinateValue: \"loading\",\n minDurationMs: 1200,\n });\n\n const { styleProp, otherProps } = useStyleEngine({\n props: {\n ...BUTTON_COLOR_MAP[variant][color],\n style,\n },\n cssVars,\n });\n\n // If the button is in a disabled state, we don't want any clicks to fire.\n // To do this reliably, we convert the element back to a button if it is\n // disabled. We do this so we can use the native button element's disabled\n // state to prevent clicks.\n // We also want to trivially pass in \"button\" if no \"as\" prop is provided\n const derivedAs = disabled \|\| !as ? \"button\" : as;\n\n const layout = React.useMemo<InternalProps[\"layout\"]>(() => {\n const childrenArray = React.Children.toArray(children);\n if (childrenArray?.length === 1 && React.isValidElement(childrenArray[0])) {\n const child = childrenArray[0] as\n \| React.ReactComponentElement<typeof Icon>\n \| {\n props: {\n icon: undefined;\n };\n };\n if (child?.props?.icon) {\n return \"icon-only\";\n }\n }\n return \"default\";\n }, [children]);\n\n return (\n <ButtonContext.Provider\n value={{ variant, size, color, state, layout, active }}\n >\n <Stack\n as={derivedAs}\n className={clsx(\"tgph-button\", className)}\n display=\"inline-flex\"\n align=\"center\"\n justify=\"center\"\n {...BUTTON_SIZE_MAP[layout][size]}\n style={styleProp}\n data-tgph-button\n data-tgph-button-layout={layout}\n data-tgph-button-state={state}\n data-tgph-button-variant={variant}\n data-tgph-button-color={color}\n disabled={state === \"disabled\" \|\| state === \"loading\"}\n {...(derivedAs === \"button\" && { type })} // Only pass in type if we are a button\n {...otherProps}\n {...props}\n >\n {state === \"loading\" && (\n <Icon\n icon={LoaderCircle}\n aria-hidden={true}\n data-tgph-button-loading-icon\n />\n )}\n {children}\n </Stack>\n </ButtonContext.Provider>\n );\n};\n\ntype IconProps<T extends TgphElement> = TgphComponentProps<\n typeof TelegraphIcon<T>\n> & {\n internal_iconType?: \"leading\" \| \"trailing\";\n};\n\nconst Icon = <T extends TgphElement>({\n size,\n color,\n variant,\n icon,\n alt,\n \"aria-hidden\": ariaHidden,\n internal_iconType,\n ...props\n}: IconProps<T>) => {\n const context = React.useContext(ButtonContext);\n\n const iconProps = {\n size: size ?? ICON_SIZE_MAP[context.size],\n color:\n color ??\n ICON_COLOR_MAP[context.variant][\n context.state === \"disabled\" ? \"disabled\" : context.color\n ],\n variant: variant ?? ICON_VARIANT_MAP[context.layout],\n };\n\n const a11yProps = !alt ? { \"aria-hidden\": ariaHidden } : { alt };\n\n // If the button is set to loading and this icon is identified as leading,\n // we don't want to render this icon and instead the loading icon which\n // is managed in the root component. We choose to render the loading icon\n // in the root component so that it displays when there is no icon already\n // inside of the button.\n if (context.state === \"loading\" && internal_iconType === \"leading\") {\n return null;\n }\n\n return (\n <TelegraphIcon\n icon={icon}\n data-button-icon\n data-button-icon-color={iconProps.color}\n {...a11yProps}\n {...iconProps}\n {...props}\n />\n );\n};\n\ntype TextProps<T extends TgphElement> = RemappedOmit<\n TgphComponentProps<typeof TelegraphText<T>>,\n \"as\"\n> & {\n as?: T;\n};\n\nconst Text = <T extends TgphElement>({\n as,\n color,\n size,\n weight = \"medium\",\n style,\n ...props\n}: TextProps<T>) => {\n const context = React.useContext(ButtonContext);\n const derivedColor =\n color ??\n TEXT_COLOR_MAP[context.variant][\n context.state === \"disabled\" ? \"disabled\" : context.color\n ];\n return (\n <TelegraphText\n as={(as \|\| \"span\") as T}\n color={derivedColor}\n size={size ?? TEXT_SIZE_MAP[context.size]}\n weight={weight}\n internal_optionalAs={true}\n data-button-text\n data-button-text-color={derivedColor}\n style={{\n textDecoration: \"none\",\n whiteSpace: \"nowrap\",\n ...style,\n }}\n {...props}\n />\n );\n};\n\ntype DefaultIconProps = React.ComponentProps<typeof Icon>;\n\ntype BaseDefaultProps =\n \| {\n leadingIcon?: DefaultIconProps;\n trailingIcon?: DefaultIconProps;\n icon?: never;\n }\n \| {\n icon?: DefaultIconProps;\n leadingIcon?: never;\n trailingIcon?: never;\n };\ntype DefaultProps<T extends TgphElement> = PolymorphicProps<T> &\n TgphComponentProps<typeof Root> &\n BaseDefaultProps;\n\nconst Default = <T extends TgphElement>({\n leadingIcon,\n trailingIcon,\n icon,\n children,\n ...props\n}: DefaultProps<T>) => {\n const combinedLeadingIcon = leadingIcon \|\| icon;\n return (\n <Root {...props}>\n {combinedLeadingIcon && (\n <Icon {...combinedLeadingIcon} internal_iconType=\"leading\" />\n )}\n {children && <Text>{children}</Text>}\n {trailingIcon && <Icon {...trailingIcon} internal_iconType=\"trailing\" />}\n </Root>\n );\n};\n\nObject.assign(Default, {\n Root,\n Icon,\n Text,\n});\n\nconst Button = Default as typeof Default & {\n Root: typeof Root;\n Icon: typeof Icon;\n Text: typeof Text;\n};\n\nexport { Button };\n"],"names":["cssVars","BUTTON_COLOR_MAP","BUTTON_SIZE_MAP","TEXT_SIZE_MAP","TEXT_COLOR_MAP","ICON_SIZE_MAP","ICON_COLOR_MAP","ICON_VARIANT_MAP","ButtonContext","React","deriveState","params","Root","as","variant","size","color","stateProp","active","type","disabled","className","children","style","props","derivedState","state","useDeterminateState","styleProp","otherProps","useStyleEngine","derivedAs","layout","childrenArray","child","_a","jsx","jsxs","Stack","clsx","Icon","LoaderCircle","icon","alt","ariaHidden","internal_iconType","context","iconProps","a11yProps","TelegraphIcon","Text","weight","derivedColor","TelegraphText","Default","leadingIcon","trailingIcon","combinedLeadingIcon","Button"],"mappings":"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"}
1	+ {"version":3,"file":"index.js","sources":["../../src/Button/Button.constants.ts","../../src/Button/Button.tsx"],"sourcesContent":["import type { tokens } from \"@telegraph/style-engine\";\nimport type { CssVarProp } from \"@telegraph/style-engine\";\n\n// Styles for controlling the \"border\" on the outline variant\n// of the button. We use a shadow so we don't need apply a border\n// to all other buttons to make them the same height.\nexport type BaseStyleProps = {\n default_buttonShadowColor: keyof typeof tokens.color;\n hover_buttonShadowColor: keyof typeof tokens.color;\n focus_buttonShadowColor: keyof typeof tokens.color;\n active_buttonShadowColor: keyof typeof tokens.color;\n hover_textColor?: keyof typeof tokens.color;\n};\n\nexport const cssVars: Record<keyof BaseStyleProps, CssVarProp> = {\n default_buttonShadowColor: {\n cssVar: \"--box-shadow\",\n value: \"inset 0 0 0 1px var(--tgph-VARIABLE)\",\n },\n hover_buttonShadowColor: {\n cssVar: \"--tgph-button-hover-shadow\",\n value: \"inset 0 0 0 1px var(--tgph-VARIABLE)\",\n },\n focus_buttonShadowColor: {\n cssVar: \"--tgph-button-focus-shadow\",\n value: \"inset 0 0 0 1px var(--tgph-VARIABLE)\",\n },\n active_buttonShadowColor: {\n cssVar: \"--tgph-button-active-shadow\",\n value: \"inset 0 0 0 1px var(--tgph-VARIABLE)\",\n },\n hover_textColor: {\n cssVar: \"--tgph-button-hover-text-color\",\n value: \"var(--tgph-VARIABLE)\",\n },\n} as const;\n\nexport const BUTTON_COLOR_MAP = {\n solid: {\n default: {\n backgroundColor: \"gray-12\",\n hover_backgroundColor: \"gray-11\",\n focus_backgroundColor: \"gray-10\",\n active_backgroundColor: \"gray-10\",\n hover_textColor: \"white\",\n },\n accent: {\n backgroundColor: \"accent-9\",\n hover_backgroundColor: \"accent-10\",\n focus_backgroundColor: \"accent-11\",\n active_backgroundColor: \"accent-11\",\n hover_textColor: \"white\",\n },\n red: {\n backgroundColor: \"red-9\",\n hover_backgroundColor: \"red-10\",\n focus_backgroundColor: \"red-11\",\n active_backgroundColor: \"red-11\",\n hover_textColor: \"white\",\n },\n gray: {\n backgroundColor: \"gray-9\",\n hover_backgroundColor: \"gray-10\",\n focus_backgroundColor: \"gray-11\",\n active_backgroundColor: \"gray-11\",\n hover_textColor: \"white\",\n },\n green: {\n backgroundColor: \"green-9\",\n hover_backgroundColor: \"green-10\",\n focus_backgroundColor: \"green-11\",\n active_backgroundColor: \"green-11\",\n hover_textColor: \"white\",\n },\n blue: {\n backgroundColor: \"blue-9\",\n hover_backgroundColor: \"blue-10\",\n focus_backgroundColor: \"blue-11\",\n active_backgroundColor: \"blue-11\",\n hover_textColor: \"white\",\n },\n yellow: {\n backgroundColor: \"yellow-9\",\n hover_backgroundColor: \"yellow-10\",\n focus_backgroundColor: \"yellow-11\",\n active_backgroundColor: \"yellow-11\",\n hover_textColor: \"white\",\n },\n purple: {\n backgroundColor: \"purple-9\",\n hover_backgroundColor: \"purple-10\",\n focus_backgroundColor: \"purple-11\",\n active_backgroundColor: \"purple-11\",\n hover_textColor: \"white\",\n },\n },\n soft: {\n default: {\n backgroundColor: \"gray-3\",\n hover_backgroundColor: \"gray-4\",\n focus_backgroundColor: \"gray-5\",\n active_backgroundColor: \"gray-5\",\n hover_textColor: \"gray-12\",\n },\n gray: {\n backgroundColor: \"gray-3\",\n hover_backgroundColor: \"gray-4\",\n focus_backgroundColor: \"gray-5\",\n active_backgroundColor: \"gray-5\",\n hover_textColor: \"gray-12\",\n },\n red: {\n backgroundColor: \"red-3\",\n hover_backgroundColor: \"red-4\",\n focus_backgroundColor: \"red-5\",\n active_backgroundColor: \"red-5\",\n hover_textColor: \"red-11\",\n },\n accent: {\n backgroundColor: \"accent-3\",\n hover_backgroundColor: \"accent-4\",\n focus_backgroundColor: \"accent-5\",\n active_backgroundColor: \"accent-5\",\n hover_textColor: \"accent-11\",\n },\n green: {\n backgroundColor: \"green-3\",\n hover_backgroundColor: \"green-4\",\n focus_backgroundColor: \"green-5\",\n active_backgroundColor: \"green-5\",\n hover_textColor: \"green-11\",\n },\n blue: {\n backgroundColor: \"blue-3\",\n hover_backgroundColor: \"blue-4\",\n focus_backgroundColor: \"blue-5\",\n active_backgroundColor: \"blue-5\",\n hover_textColor: \"blue-11\",\n },\n yellow: {\n backgroundColor: \"yellow-3\",\n hover_backgroundColor: \"yellow-4\",\n focus_backgroundColor: \"yellow-5\",\n active_backgroundColor: \"yellow-5\",\n hover_textColor: \"yellow-11\",\n },\n purple: {\n backgroundColor: \"purple-3\",\n hover_backgroundColor: \"purple-4\",\n focus_backgroundColor: \"purple-5\",\n active_backgroundColor: \"purple-5\",\n hover_textColor: \"purple-11\",\n },\n },\n outline: {\n default: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"gray-2\",\n default_buttonShadowColor: \"gray-6\",\n hover_buttonShadowColor: \"gray-7\",\n focus_buttonShadowColor: \"gray-8\",\n active_buttonShadowColor: \"gray-8\",\n hover_textColor: \"gray-12\",\n },\n gray: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"gray-2\",\n default_buttonShadowColor: \"gray-6\",\n hover_buttonShadowColor: \"gray-7\",\n focus_buttonShadowColor: \"gray-8\",\n active_buttonShadowColor: \"gray-8\",\n hover_textColor: \"gray-12\",\n },\n red: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"red-2\",\n default_buttonShadowColor: \"red-6\",\n hover_buttonShadowColor: \"red-7\",\n focus_buttonShadowColor: \"red-8\",\n active_buttonShadowColor: \"red-8\",\n hover_textColor: \"red-11\",\n },\n accent: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"accent-2\",\n default_buttonShadowColor: \"accent-6\",\n hover_buttonShadowColor: \"accent-7\",\n focus_buttonShadowColor: \"accent-8\",\n active_buttonShadowColor: \"accent-8\",\n hover_textColor: \"accent-11\",\n },\n green: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"green-2\",\n default_buttonShadowColor: \"green-6\",\n hover_buttonShadowColor: \"green-7\",\n focus_buttonShadowColor: \"green-8\",\n active_buttonShadowColor: \"green-8\",\n hover_textColor: \"green-11\",\n },\n blue: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"blue-2\",\n default_buttonShadowColor: \"blue-6\",\n hover_buttonShadowColor: \"blue-7\",\n focus_buttonShadowColor: \"blue-8\",\n active_buttonShadowColor: \"blue-8\",\n hover_textColor: \"blue-11\",\n },\n yellow: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"yellow-2\",\n default_buttonShadowColor: \"yellow-6\",\n hover_buttonShadowColor: \"yellow-7\",\n focus_buttonShadowColor: \"yellow-8\",\n active_buttonShadowColor: \"yellow-8\",\n hover_textColor: \"yellow-11\",\n },\n purple: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"purple-2\",\n default_buttonShadowColor: \"purple-6\",\n hover_buttonShadowColor: \"purple-7\",\n focus_buttonShadowColor: \"purple-8\",\n active_buttonShadowColor: \"purple-8\",\n hover_textColor: \"purple-11\",\n },\n },\n ghost: {\n default: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"gray-3\",\n focus_backgroundColor: \"gray-4\",\n active_backgroundColor: \"gray-4\",\n hover_textColor: \"gray-12\",\n },\n gray: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"gray-3\",\n focus_backgroundColor: \"gray-4\",\n active_backgroundColor: \"gray-4\",\n hover_textColor: \"gray-12\",\n },\n red: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"red-3\",\n focus_backgroundColor: \"red-4\",\n active_backgroundColor: \"red-4\",\n hover_textColor: \"red-11\",\n },\n accent: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"accent-3\",\n focus_backgroundColor: \"accent-4\",\n active_backgroundColor: \"accent-4\",\n hover_textColor: \"accent-11\",\n },\n green: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"green-3\",\n focus_backgroundColor: \"green-4\",\n active_backgroundColor: \"green-4\",\n hover_textColor: \"green-11\",\n },\n blue: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"blue-3\",\n focus_backgroundColor: \"blue-4\",\n active_backgroundColor: \"blue-4\",\n hover_textColor: \"blue-11\",\n },\n yellow: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"yellow-3\",\n focus_backgroundColor: \"yellow-4\",\n active_backgroundColor: \"yellow-4\",\n hover_textColor: \"yellow-11\",\n },\n purple: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"purple-3\",\n focus_backgroundColor: \"purple-4\",\n active_backgroundColor: \"purple-4\",\n hover_textColor: \"purple-11\",\n },\n },\n} as const;\n\nexport const BUTTON_SIZE_MAP = {\n default: {\n \"0\": {\n w: \"auto\",\n h: \"5\",\n gap: \"0_5\",\n px: \"1\",\n rounded: \"2\",\n },\n \"1\": {\n w: \"auto\",\n h: \"6\",\n gap: \"1\",\n px: \"1_5\",\n rounded: \"2\",\n },\n \"2\": {\n w: \"auto\",\n h: \"8\",\n gap: \"1_5\",\n px: \"2\",\n rounded: \"2\",\n },\n \"3\": {\n w: \"auto\",\n h: \"10\",\n gap: \"2\",\n px: \"3\",\n rounded: \"3\",\n },\n },\n \"icon-only\": {\n \"0\": {\n w: \"5\",\n h: \"5\",\n gap: \"0\",\n px: \"0\",\n rounded: \"2\",\n },\n \"1\": {\n w: \"6\",\n h: \"6\",\n gap: \"0\",\n px: \"0\",\n rounded: \"2\",\n },\n \"2\": {\n w: \"8\",\n h: \"8\",\n gap: \"0\",\n px: \"0\",\n rounded: \"2\",\n },\n \"3\": {\n w: \"10\",\n h: \"10\",\n gap: \"0\",\n px: \"0\",\n rounded: \"3\",\n },\n },\n} as const;\n\nexport const TEXT_SIZE_MAP = {\n \"0\": \"0\",\n \"1\": \"1\",\n \"2\": \"2\",\n \"3\": \"3\",\n} as const;\n\nexport const TEXT_COLOR_MAP = {\n solid: {\n default: \"white\",\n gray: \"white\",\n red: \"white\",\n accent: \"white\",\n green: \"white\",\n blue: \"white\",\n yellow: \"white\",\n purple: \"white\",\n disabled: \"disabled\",\n },\n soft: {\n default: \"default\",\n gray: \"gray\",\n red: \"red\",\n accent: \"accent\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n outline: {\n default: \"default\",\n gray: \"gray\",\n red: \"red\",\n accent: \"accent\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n ghost: {\n default: \"default\",\n gray: \"gray\",\n red: \"red\",\n accent: \"accent\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n} as const;\n\nexport const ICON_SIZE_MAP = {\n \"0\": \"0\",\n \"1\": \"1\",\n \"2\": \"2\",\n \"3\": \"3\",\n} as const;\n\nexport const ICON_COLOR_MAP = {\n solid: {\n default: \"white\",\n gray: \"white\",\n red: \"white\",\n accent: \"white\",\n green: \"white\",\n blue: \"white\",\n yellow: \"white\",\n purple: \"white\",\n disabled: \"disabled\",\n },\n soft: {\n default: \"default\",\n accent: \"accent\",\n gray: \"gray\",\n red: \"red\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n outline: {\n default: \"default\",\n accent: \"accent\",\n gray: \"gray\",\n red: \"red\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n ghost: {\n default: \"gray\",\n accent: \"accent\",\n gray: \"gray\",\n red: \"red\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n} as const;\n\nexport const ICON_VARIANT_MAP = {\n default: \"secondary\",\n \"icon-only\": \"primary\",\n} as const;\n\nexport type ButtonVariant = keyof typeof BUTTON_COLOR_MAP;\nexport type ButtonColor = keyof (typeof BUTTON_COLOR_MAP)[ButtonVariant];\nexport type ButtonSize = keyof (typeof BUTTON_SIZE_MAP)[\"default\"];\n","import {\n type PolymorphicProps,\n type PolymorphicPropsWithTgphRef,\n RemappedOmit,\n type Required,\n type TgphComponentProps,\n type TgphElement,\n useDeterminateState,\n} from \"@telegraph/helpers\";\nimport { Spinner, Icon as TelegraphIcon } from \"@telegraph/icon\";\nimport { Stack } from \"@telegraph/layout\";\nimport { useStyleEngine } from \"@telegraph/style-engine\";\nimport { Text as TelegraphText } from \"@telegraph/typography\";\nimport clsx from \"clsx\";\nimport React from \"react\";\n\nimport {\n BUTTON_COLOR_MAP,\n BUTTON_SIZE_MAP,\n type ButtonColor,\n type ButtonSize,\n type ButtonVariant,\n ICON_COLOR_MAP,\n ICON_SIZE_MAP,\n ICON_VARIANT_MAP,\n TEXT_COLOR_MAP,\n TEXT_SIZE_MAP,\n cssVars,\n} from \"./Button.constants\";\n\ntype RootBaseProps = {\n variant?: ButtonVariant;\n color?: ButtonColor;\n size?: ButtonSize;\n state?: \"default\" \| \"loading\";\n active?: boolean;\n};\n\ntype InternalProps = {\n layout: \"default\" \| \"icon-only\";\n color: Required<RootBaseProps>[\"color\"];\n state: Required<RootBaseProps>[\"state\"] \| \"disabled\" \| \"active\";\n};\n\ntype RootProps<T extends TgphElement> = Omit<\n TgphComponentProps<typeof Stack>,\n \"tgphRef\"\n> &\n PolymorphicPropsWithTgphRef<T, HTMLButtonElement> &\n RootBaseProps;\n\nconst ButtonContext = React.createContext<\n Required<Omit<RootBaseProps, \"color\" \| \"as\" \| \"state\"> & InternalProps>\n>({\n variant: \"solid\",\n size: \"2\",\n color: \"default\",\n state: \"default\",\n layout: \"default\",\n active: false,\n});\n\ntype DeriveStateParams = {\n state: Required<RootBaseProps>[\"state\"];\n disabled?: boolean;\n active?: boolean;\n};\n\n// Derive the state of the button based on the html button props in\nconst deriveState = (params: DeriveStateParams): InternalProps[\"state\"] => {\n if (params.disabled) return \"disabled\";\n if (params.state === \"loading\") return \"loading\";\n if (params.active) return \"active\";\n return params.state;\n};\n\nconst Root = <T extends TgphElement>({\n as,\n variant = \"solid\",\n size = \"2\",\n color = \"default\",\n state: stateProp = \"default\",\n active = false,\n type = \"button\",\n disabled,\n className,\n children,\n style,\n ...props\n}: RootProps<T>) => {\n const derivedState = deriveState({ state: stateProp, disabled, active });\n const state = useDeterminateState<DefaultProps<T>[\"state\"]>({\n value: derivedState,\n determinateValue: \"loading\",\n minDurationMs: 1200,\n });\n\n const { styleProp, otherProps } = useStyleEngine({\n props: {\n ...BUTTON_COLOR_MAP[variant][color],\n style,\n },\n cssVars,\n });\n\n // If the button is in a disabled state, we don't want any clicks to fire.\n // To do this reliably, we convert the element back to a button if it is\n // disabled. We do this so we can use the native button element's disabled\n // state to prevent clicks.\n // We also want to trivially pass in \"button\" if no \"as\" prop is provided\n const derivedAs = disabled \|\| !as ? \"button\" : as;\n\n const layout = React.useMemo<InternalProps[\"layout\"]>(() => {\n const childrenArray = React.Children.toArray(children);\n if (childrenArray?.length === 1 && React.isValidElement(childrenArray[0])) {\n const child = childrenArray[0] as\n \| React.ReactComponentElement<typeof Icon>\n \| {\n props: {\n icon: undefined;\n };\n };\n if (child?.props?.icon) {\n return \"icon-only\";\n }\n }\n return \"default\";\n }, [children]);\n\n return (\n <ButtonContext.Provider\n value={{ variant, size, color, state, layout, active }}\n >\n <Stack\n as={derivedAs}\n className={clsx(\"tgph-button\", className)}\n display=\"inline-flex\"\n align=\"center\"\n justify=\"center\"\n {...BUTTON_SIZE_MAP[layout][size]}\n style={styleProp}\n data-tgph-button\n data-tgph-button-layout={layout}\n data-tgph-button-state={state}\n data-tgph-button-variant={variant}\n data-tgph-button-color={color}\n disabled={state === \"disabled\" \|\| state === \"loading\"}\n {...(derivedAs === \"button\" && { type })} // Only pass in type if we are a button\n {...otherProps}\n {...props}\n >\n {state === \"loading\" && (\n <Spinner\n size={ICON_SIZE_MAP[size]}\n color={ICON_COLOR_MAP[variant][color]}\n variant={ICON_VARIANT_MAP[layout]}\n data-tgph-button-loading-icon\n />\n )}\n {children}\n </Stack>\n </ButtonContext.Provider>\n );\n};\n\ntype IconProps<T extends TgphElement> = TgphComponentProps<\n typeof TelegraphIcon<T>\n> & {\n internal_iconType?: \"leading\" \| \"trailing\";\n};\n\nconst Icon = <T extends TgphElement>({\n size,\n color,\n variant,\n icon,\n alt,\n \"aria-hidden\": ariaHidden,\n internal_iconType,\n ...props\n}: IconProps<T>) => {\n const context = React.useContext(ButtonContext);\n\n const iconProps = {\n size: size ?? ICON_SIZE_MAP[context.size],\n color:\n color ??\n ICON_COLOR_MAP[context.variant][\n context.state === \"disabled\" ? \"disabled\" : context.color\n ],\n variant: variant ?? ICON_VARIANT_MAP[context.layout],\n };\n\n const a11yProps = !alt ? { \"aria-hidden\": ariaHidden } : { alt };\n\n // If the button is set to loading and this icon is identified as leading,\n // we don't want to render this icon and instead the loading icon which\n // is managed in the root component. We choose to render the loading icon\n // in the root component so that it displays when there is no icon already\n // inside of the button.\n if (context.state === \"loading\" && internal_iconType === \"leading\") {\n return null;\n }\n\n return (\n <TelegraphIcon\n icon={icon}\n data-button-icon\n data-button-icon-color={iconProps.color}\n {...a11yProps}\n {...iconProps}\n {...props}\n />\n );\n};\n\ntype TextProps<T extends TgphElement> = RemappedOmit<\n TgphComponentProps<typeof TelegraphText<T>>,\n \"as\"\n> & {\n as?: T;\n};\n\nconst Text = <T extends TgphElement>({\n as,\n color,\n size,\n weight = \"medium\",\n style,\n ...props\n}: TextProps<T>) => {\n const context = React.useContext(ButtonContext);\n const derivedColor =\n color ??\n TEXT_COLOR_MAP[context.variant][\n context.state === \"disabled\" ? \"disabled\" : context.color\n ];\n return (\n <TelegraphText\n as={(as \|\| \"span\") as T}\n color={derivedColor}\n size={size ?? TEXT_SIZE_MAP[context.size]}\n weight={weight}\n internal_optionalAs={true}\n data-button-text\n data-button-text-color={derivedColor}\n style={{\n textDecoration: \"none\",\n whiteSpace: \"nowrap\",\n ...style,\n }}\n {...props}\n />\n );\n};\n\ntype DefaultIconProps = React.ComponentProps<typeof Icon>;\n\ntype BaseDefaultProps =\n \| {\n leadingIcon?: DefaultIconProps;\n trailingIcon?: DefaultIconProps;\n icon?: never;\n }\n \| {\n icon?: DefaultIconProps;\n leadingIcon?: never;\n trailingIcon?: never;\n };\ntype DefaultProps<T extends TgphElement> = PolymorphicProps<T> &\n TgphComponentProps<typeof Root> &\n BaseDefaultProps;\n\nconst Default = <T extends TgphElement>({\n leadingIcon,\n trailingIcon,\n icon,\n children,\n ...props\n}: DefaultProps<T>) => {\n const combinedLeadingIcon = leadingIcon \|\| icon;\n return (\n <Root {...props}>\n {combinedLeadingIcon && (\n <Icon {...combinedLeadingIcon} internal_iconType=\"leading\" />\n )}\n {children && <Text>{children}</Text>}\n {trailingIcon && <Icon {...trailingIcon} internal_iconType=\"trailing\" />}\n </Root>\n );\n};\n\nObject.assign(Default, {\n Root,\n Icon,\n Text,\n});\n\nconst Button = Default as typeof Default & {\n Root: typeof Root;\n Icon: typeof Icon;\n Text: typeof Text;\n};\n\nexport { Button };\n"],"names":["cssVars","BUTTON_COLOR_MAP","BUTTON_SIZE_MAP","TEXT_SIZE_MAP","TEXT_COLOR_MAP","ICON_SIZE_MAP","ICON_COLOR_MAP","ICON_VARIANT_MAP","ButtonContext","React","deriveState","params","Root","as","variant","size","color","stateProp","active","type","disabled","className","children","style","props","derivedState","state","useDeterminateState","styleProp","otherProps","useStyleEngine","derivedAs","layout","childrenArray","child","_a","jsx","jsxs","Stack","clsx","Spinner","Icon","icon","alt","ariaHidden","internal_iconType","context","iconProps","a11yProps","TelegraphIcon","Text","weight","derivedColor","TelegraphText","Default","leadingIcon","trailingIcon","combinedLeadingIcon","Button"],"mappings":"8TAcaA,EAAoD,CAC/D,0BAA2B,CACzB,OAAQ,eACR,MAAO,sCAAA,EAET,wBAAyB,CACvB,OAAQ,6BACR,MAAO,sCAAA,EAET,wBAAyB,CACvB,OAAQ,6BACR,MAAO,sCAAA,EAET,yBAA0B,CACxB,OAAQ,8BACR,MAAO,sCAAA,EAET,gBAAiB,CACf,OAAQ,iCACR,MAAO,sBAAA,CAEX,EAEaC,EAAmB,CAC9B,MAAO,CACL,QAAS,CACP,gBAAiB,UACjB,sBAAuB,UACvB,sBAAuB,UACvB,uBAAwB,UACxB,gBAAiB,OAAA,EAEnB,OAAQ,CACN,gBAAiB,WACjB,sBAAuB,YACvB,sBAAuB,YACvB,uBAAwB,YACxB,gBAAiB,OAAA,EAEnB,IAAK,CACH,gBAAiB,QACjB,sBAAuB,SACvB,sBAAuB,SACvB,uBAAwB,SACxB,gBAAiB,OAAA,EAEnB,KAAM,CACJ,gBAAiB,SACjB,sBAAuB,UACvB,sBAAuB,UACvB,uBAAwB,UACxB,gBAAiB,OAAA,EAEnB,MAAO,CACL,gBAAiB,UACjB,sBAAuB,WACvB,sBAAuB,WACvB,uBAAwB,WACxB,gBAAiB,OAAA,EAEnB,KAAM,CACJ,gBAAiB,SACjB,sBAAuB,UACvB,sBAAuB,UACvB,uBAAwB,UACxB,gBAAiB,OAAA,EAEnB,OAAQ,CACN,gBAAiB,WACjB,sBAAuB,YACvB,sBAAuB,YACvB,uBAAwB,YACxB,gBAAiB,OAAA,EAEnB,OAAQ,CACN,gBAAiB,WACjB,sBAAuB,YACvB,sBAAuB,YACvB,uBAAwB,YACxB,gBAAiB,OAAA,CACnB,EAEF,KAAM,CACJ,QAAS,CACP,gBAAiB,SACjB,sBAAuB,SACvB,sBAAuB,SACvB,uBAAwB,SACxB,gBAAiB,SAAA,EAEnB,KAAM,CACJ,gBAAiB,SACjB,sBAAuB,SACvB,sBAAuB,SACvB,uBAAwB,SACxB,gBAAiB,SAAA,EAEnB,IAAK,CACH,gBAAiB,QACjB,sBAAuB,QACvB,sBAAuB,QACvB,uBAAwB,QACxB,gBAAiB,QAAA,EAEnB,OAAQ,CACN,gBAAiB,WACjB,sBAAuB,WACvB,sBAAuB,WACvB,uBAAwB,WACxB,gBAAiB,WAAA,EAEnB,MAAO,CACL,gBAAiB,UACjB,sBAAuB,UACvB,sBAAuB,UACvB,uBAAwB,UACxB,gBAAiB,UAAA,EAEnB,KAAM,CACJ,gBAAiB,SACjB,sBAAuB,SACvB,sBAAuB,SACvB,uBAAwB,SACxB,gBAAiB,SAAA,EAEnB,OAAQ,CACN,gBAAiB,WACjB,sBAAuB,WACvB,sBAAuB,WACvB,uBAAwB,WACxB,gBAAiB,WAAA,EAEnB,OAAQ,CACN,gBAAiB,WACjB,sBAAuB,WACvB,sBAAuB,WACvB,uBAAwB,WACxB,gBAAiB,WAAA,CACnB,EAEF,QAAS,CACP,QAAS,CACP,gBAAiB,YACjB,sBAAuB,SACvB,0BAA2B,SAC3B,wBAAyB,SACzB,wBAAyB,SACzB,yBAA0B,SAC1B,gBAAiB,SAAA,EAEnB,KAAM,CACJ,gBAAiB,YACjB,sBAAuB,SACvB,0BAA2B,SAC3B,wBAAyB,SACzB,wBAAyB,SACzB,yBAA0B,SAC1B,gBAAiB,SAAA,EAEnB,IAAK,CACH,gBAAiB,YACjB,sBAAuB,QACvB,0BAA2B,QAC3B,wBAAyB,QACzB,wBAAyB,QACzB,yBAA0B,QAC1B,gBAAiB,QAAA,EAEnB,OAAQ,CACN,gBAAiB,YACjB,sBAAuB,WACvB,0BAA2B,WAC3B,wBAAyB,WACzB,wBAAyB,WACzB,yBAA0B,WAC1B,gBAAiB,WAAA,EAEnB,MAAO,CACL,gBAAiB,YACjB,sBAAuB,UACvB,0BAA2B,UAC3B,wBAAyB,UACzB,wBAAyB,UACzB,yBAA0B,UAC1B,gBAAiB,UAAA,EAEnB,KAAM,CACJ,gBAAiB,YACjB,sBAAuB,SACvB,0BAA2B,SAC3B,wBAAyB,SACzB,wBAAyB,SACzB,yBAA0B,SAC1B,gBAAiB,SAAA,EAEnB,OAAQ,CACN,gBAAiB,YACjB,sBAAuB,WACvB,0BAA2B,WAC3B,wBAAyB,WACzB,wBAAyB,WACzB,yBAA0B,WAC1B,gBAAiB,WAAA,EAEnB,OAAQ,CACN,gBAAiB,YACjB,sBAAuB,WACvB,0BAA2B,WAC3B,wBAAyB,WACzB,wBAAyB,WACzB,yBAA0B,WAC1B,gBAAiB,WAAA,CACnB,EAEF,MAAO,CACL,QAAS,CACP,gBAAiB,cACjB,sBAAuB,SACvB,sBAAuB,SACvB,uBAAwB,SACxB,gBAAiB,SAAA,EAEnB,KAAM,CACJ,gBAAiB,cACjB,sBAAuB,SACvB,sBAAuB,SACvB,uBAAwB,SACxB,gBAAiB,SAAA,EAEnB,IAAK,CACH,gBAAiB,cACjB,sBAAuB,QACvB,sBAAuB,QACvB,uBAAwB,QACxB,gBAAiB,QAAA,EAEnB,OAAQ,CACN,gBAAiB,cACjB,sBAAuB,WACvB,sBAAuB,WACvB,uBAAwB,WACxB,gBAAiB,WAAA,EAEnB,MAAO,CACL,gBAAiB,cACjB,sBAAuB,UACvB,sBAAuB,UACvB,uBAAwB,UACxB,gBAAiB,UAAA,EAEnB,KAAM,CACJ,gBAAiB,cACjB,sBAAuB,SACvB,sBAAuB,SACvB,uBAAwB,SACxB,gBAAiB,SAAA,EAEnB,OAAQ,CACN,gBAAiB,cACjB,sBAAuB,WACvB,sBAAuB,WACvB,uBAAwB,WACxB,gBAAiB,WAAA,EAEnB,OAAQ,CACN,gBAAiB,cACjB,sBAAuB,WACvB,sBAAuB,WACvB,uBAAwB,WACxB,gBAAiB,WAAA,CACnB,CAEJ,EAEaC,EAAkB,CAC7B,QAAS,CACP,EAAK,CACH,EAAG,OACH,EAAG,IACH,IAAK,MACL,GAAI,IACJ,QAAS,GAAA,EAEX,EAAK,CACH,EAAG,OACH,EAAG,IACH,IAAK,IACL,GAAI,MACJ,QAAS,GAAA,EAEX,EAAK,CACH,EAAG,OACH,EAAG,IACH,IAAK,MACL,GAAI,IACJ,QAAS,GAAA,EAEX,EAAK,CACH,EAAG,OACH,EAAG,KACH,IAAK,IACL,GAAI,IACJ,QAAS,GAAA,CACX,EAEF,YAAa,CACX,EAAK,CACH,EAAG,IACH,EAAG,IACH,IAAK,IACL,GAAI,IACJ,QAAS,GAAA,EAEX,EAAK,CACH,EAAG,IACH,EAAG,IACH,IAAK,IACL,GAAI,IACJ,QAAS,GAAA,EAEX,EAAK,CACH,EAAG,IACH,EAAG,IACH,IAAK,IACL,GAAI,IACJ,QAAS,GAAA,EAEX,EAAK,CACH,EAAG,KACH,EAAG,KACH,IAAK,IACL,GAAI,IACJ,QAAS,GAAA,CACX,CAEJ,EAEaC,EAAgB,CAC3B,EAAK,IACL,EAAK,IACL,EAAK,IACL,EAAK,GACP,EAEaC,EAAiB,CAC5B,MAAO,CACL,QAAS,QACT,KAAM,QACN,IAAK,QACL,OAAQ,QACR,MAAO,QACP,KAAM,QACN,OAAQ,QACR,OAAQ,QACR,SAAU,UAAA,EAEZ,KAAM,CACJ,QAAS,UACT,KAAM,OACN,IAAK,MACL,OAAQ,SACR,MAAO,QACP,KAAM,OACN,OAAQ,SACR,OAAQ,SACR,SAAU,UAAA,EAEZ,QAAS,CACP,QAAS,UACT,KAAM,OACN,IAAK,MACL,OAAQ,SACR,MAAO,QACP,KAAM,OACN,OAAQ,SACR,OAAQ,SACR,SAAU,UAAA,EAEZ,MAAO,CACL,QAAS,UACT,KAAM,OACN,IAAK,MACL,OAAQ,SACR,MAAO,QACP,KAAM,OACN,OAAQ,SACR,OAAQ,SACR,SAAU,UAAA,CAEd,EAEaC,EAAgB,CAC3B,EAAK,IACL,EAAK,IACL,EAAK,IACL,EAAK,GACP,EAEaC,EAAiB,CAC5B,MAAO,CACL,QAAS,QACT,KAAM,QACN,IAAK,QACL,OAAQ,QACR,MAAO,QACP,KAAM,QACN,OAAQ,QACR,OAAQ,QACR,SAAU,UAAA,EAEZ,KAAM,CACJ,QAAS,UACT,OAAQ,SACR,KAAM,OACN,IAAK,MACL,MAAO,QACP,KAAM,OACN,OAAQ,SACR,OAAQ,SACR,SAAU,UAAA,EAEZ,QAAS,CACP,QAAS,UACT,OAAQ,SACR,KAAM,OACN,IAAK,MACL,MAAO,QACP,KAAM,OACN,OAAQ,SACR,OAAQ,SACR,SAAU,UAAA,EAEZ,MAAO,CACL,QAAS,OACT,OAAQ,SACR,KAAM,OACN,IAAK,MACL,MAAO,QACP,KAAM,OACN,OAAQ,SACR,OAAQ,SACR,SAAU,UAAA,CAEd,EAEaC,EAAmB,CAC9B,QAAS,YACT,YAAa,SACf,EC3ZMC,EAAgBC,EAAM,cAE1B,CACA,QAAS,QACT,KAAM,IACN,MAAO,UACP,MAAO,UACP,OAAQ,UACR,OAAQ,EACV,CAAC,EASKC,EAAeC,GACfA,EAAO,SAAiB,WACxBA,EAAO,QAAU,UAAkB,UACnCA,EAAO,OAAe,SACnBA,EAAO,MAGVC,EAAO,CAAwB,CACnC,GAAAC,EACA,QAAAC,EAAU,QACV,KAAAC,EAAO,IACP,MAAAC,EAAQ,UACR,MAAOC,EAAY,UACnB,OAAAC,EAAS,GACT,KAAAC,EAAO,SACP,SAAAC,EACA,UAAAC,EACA,SAAAC,EACA,MAAAC,EACA,GAAGC,CACL,IAAoB,CAClB,MAAMC,EAAef,EAAY,CAAE,MAAOO,EAAW,SAAAG,EAAU,OAAAF,EAAQ,EACjEQ,EAAQC,EAAAA,oBAA8C,CAC1D,MAAOF,EACP,iBAAkB,UAClB,cAAe,IAAA,CAChB,EAEK,CAAE,UAAAG,EAAW,WAAAC,CAAA,EAAeC,iBAAe,CAC/C,MAAO,CACL,GAAG7B,EAAiBa,CAAO,EAAEE,CAAK,EAClC,MAAAO,CAAA,EAEF,QAAAvB,CAAA,CACD,EAOK+B,EAAYX,GAAY,CAACP,EAAK,SAAWA,EAEzCmB,EAASvB,EAAM,QAAiC,IAAM,OAC1D,MAAMwB,EAAgBxB,EAAM,SAAS,QAAQa,CAAQ,EACrD,IAAIW,GAAA,YAAAA,EAAe,UAAW,GAAKxB,EAAM,eAAewB,EAAc,CAAC,CAAC,EAAG,CACzE,MAAMC,EAAQD,EAAc,CAAC,EAO7B,IAAIE,EAAAD,GAAA,YAAAA,EAAO,QAAP,MAAAC,EAAc,KAChB,MAAO,WAEX,CACA,MAAO,SACT,EAAG,CAACb,CAAQ,CAAC,EAEb,OACEc,EAAAA,IAAC5B,EAAc,SAAd,CACC,MAAO,CAAE,QAAAM,EAAS,KAAAC,EAAM,MAAAC,EAAO,MAAAU,EAAA,OAAOM,EAAQ,OAAAd,CAAA,EAE9C,SAAAmB,EAAAA,KAACC,EAAAA,MAAA,CACC,GAAIP,EACJ,UAAWQ,EAAK,cAAelB,CAAS,EACxC,QAAQ,cACR,MAAM,SACN,QAAQ,SACP,GAAGnB,EAAgB8B,CAAM,EAAEjB,CAAI,EAChC,MAAOa,EACP,mBAAgB,GAChB,0BAAyBI,EACzB,yBAAwBN,EACxB,2BAA0BZ,EAC1B,yBAAwBE,EACxB,SAAUU,IAAU,YAAcA,IAAU,UAC3C,GAAIK,IAAc,UAAY,CAAE,KAAAZ,CAAA,EAChC,GAAGU,EACH,GAAGL,EAEH,SAAA,CAAAE,IAAU,WACTU,EAAAA,IAACI,EAAAA,QAAA,CACC,KAAMnC,EAAcU,CAAI,EACxB,MAAOT,EAAeQ,CAAO,EAAEE,CAAK,EACpC,QAAST,EAAiByB,CAAM,EAChC,gCAA6B,EAAA,CAAA,EAGhCV,CAAA,CAAA,CAAA,CACH,CAAA,CAGN,EAQMmB,EAAO,CAAwB,CACnC,KAAA1B,EACA,MAAAC,EACA,QAAAF,EAAA,KACA4B,EACA,IAAAC,EACA,cAAeC,EACf,kBAAAC,EACA,GAAGrB,CACL,IAAoB,CAClB,MAAMsB,EAAUrC,EAAM,WAAWD,CAAa,EAExCuC,EAAY,CAChB,KAAMhC,GAAQV,EAAcyC,EAAQ,IAAI,EACxC,MACE9B,GACAV,EAAewC,EAAQ,OAAO,EAC5BA,EAAQ,QAAU,WAAa,WAAaA,EAAQ,KACtD,EACF,QAAShC,GAAWP,EAAiBuC,EAAQ,MAAM,CAAA,EAG/CE,EAAaL,EAAsC,CAAE,IAAAA,CAAA,EAAlC,CAAE,cAAeC,CAAA,EAO1C,OAAIE,EAAQ,QAAU,WAAaD,IAAsB,UAChD,KAIPT,EAAAA,IAACa,EAAAA,KAAA,CAAA,KACCP,EACA,mBAAgB,GAChB,yBAAwBK,EAAU,MACjC,GAAGC,EACH,GAAGD,EACH,GAAGvB,CAAA,CAAA,CAGV,EASM0B,EAAO,CAAwB,CACnC,GAAArC,EACA,MAAAG,EACA,KAAAD,EACA,OAAAoC,EAAS,SACT,MAAA5B,EACA,GAAGC,CACL,IAAoB,CAClB,MAAMsB,EAAUrC,EAAM,WAAWD,CAAa,EACxC4C,EACJpC,GACAZ,EAAe0C,EAAQ,OAAO,EAC5BA,EAAQ,QAAU,WAAa,WAAaA,EAAQ,KACtD,EACF,OACEV,EAAAA,IAACiB,EAAAA,KAAA,CACC,GAAKxC,GAAM,OACX,MAAOuC,EACP,KAAMrC,GAAQZ,EAAc2C,EAAQ,IAAI,EACxC,OAAAK,EACA,oBAAqB,GACrB,mBAAgB,GAChB,yBAAwBC,EACxB,MAAO,CACL,eAAgB,OAChB,WAAY,SACZ,GAAG7B,CAAA,EAEJ,GAAGC,CAAA,CAAA,CAGV,EAmBM8B,EAAU,CAAwB,CACtC,YAAAC,EACA,aAAAC,EACA,KAAAd,EACA,SAAApB,EACA,GAAGE,CACL,IAAuB,CACrB,MAAMiC,EAAsBF,GAAeb,EAC3C,OACEL,EAAAA,KAACzB,EAAA,CAAM,GAAGY,EACP,SAAA,CAAAiC,GACCrB,EAAAA,IAACK,EAAA,CAAM,GAAGgB,EAAqB,kBAAkB,UAAU,EAE5DnC,GAAYc,EAAAA,IAACc,EAAA,CAAM,SAAA5B,CAAA,CAAS,EAC5BkC,GAAgBpB,EAAAA,IAACK,EAAA,CAAM,GAAGe,EAAc,kBAAkB,UAAA,CAAW,CAAA,EACxE,CAEJ,EAEA,OAAO,OAAOF,EAAS,CACrB,KAAA1C,EACA,KAAA6B,EACA,KAAAS,CACF,CAAC,EAED,MAAMQ,EAASJ"}

package/dist/css/default.css CHANGED Viewed

	@@ -1 +1 @@
1	- .tgph-button{--tgph-button-hover-shadow: none;--tgph-button-focus-shadow: none;--tgph-button-active-shadow: none;--tgph-button-hover-text-color: none;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;box-sizing:border-box;font-family:inherit;transition:background-color .2s ease-in-out,color .2s ease-in-out,box-shadow .2s ease-in-out;text-decoration:none}.tgph-button [data-button-text],.tgph-button [data-button-icon]{transition:color .2s ease-in-out}.tgph-button:hover{box-shadow:var(--tgph-button-hover-shadow)}.tgph-button:not([data-tgph-button-state=disabled]):hover [data-button-text]{--color: var(--tgph-button-hover-text-color) !important}.tgph-button:not([data-tgph-button-state=disabled]):hover [data-button-icon]{--color: var(--tgph-button-hover-text-color) !important}.tgph-button:focus{box-shadow:var(--tgph-button-focus-shadow)}.tgph-button[data-tgph-button-state=active]{box-shadow:var(--tgph-button-active-shadow);background-color:var(--active_backgroundColor)}.tgph-button[data-tgph-button-state=disabled][data-tgph-button-variant=solid],.tgph-button[data-tgph-button-state=disabled][data-tgph-button-variant=soft],.tgph-button[data-tgph-button-state=disabled][data-tgph-button-variant=outline]{background-color:var(--tgph-gray-3)}.tgph-button[data-tgph-button-state=disabled][data-tgph-button-variant=ghost]{background-color:var(--tgph-transparent)}.tgph-button:disabled{cursor:not-allowed}.tgph-button[data-tgph-button-state=disabled]:hover{background-color:revert}~~[data-tgph-button-loading-icon]{animation:button-loading-icon 1s infinite linear}@keyframes button-loading-icon{0%{transform:rotate(0)}to{transform:rotate(360deg)}}~~
1	+ .tgph-button{--tgph-button-hover-shadow: none;--tgph-button-focus-shadow: none;--tgph-button-active-shadow: none;--tgph-button-hover-text-color: none;-webkit-appearance:none;-moz-appearance:none;appearance:none;cursor:pointer;box-sizing:border-box;font-family:inherit;transition:background-color .2s ease-in-out,color .2s ease-in-out,box-shadow .2s ease-in-out;text-decoration:none}.tgph-button [data-button-text],.tgph-button [data-button-icon]{transition:color .2s ease-in-out}.tgph-button:hover{box-shadow:var(--tgph-button-hover-shadow)}.tgph-button:not([data-tgph-button-state=disabled]):hover [data-button-text]{--color: var(--tgph-button-hover-text-color) !important}.tgph-button:not([data-tgph-button-state=disabled]):hover [data-button-icon]{--color: var(--tgph-button-hover-text-color) !important}.tgph-button:focus{box-shadow:var(--tgph-button-focus-shadow)}.tgph-button[data-tgph-button-state=active]{box-shadow:var(--tgph-button-active-shadow);background-color:var(--active_backgroundColor)}.tgph-button[data-tgph-button-state=disabled][data-tgph-button-variant=solid],.tgph-button[data-tgph-button-state=disabled][data-tgph-button-variant=soft],.tgph-button[data-tgph-button-state=disabled][data-tgph-button-variant=outline]{background-color:var(--tgph-gray-3)}.tgph-button[data-tgph-button-state=disabled][data-tgph-button-variant=ghost]{background-color:var(--tgph-transparent)}.tgph-button:disabled{cursor:not-allowed}.tgph-button[data-tgph-button-state=disabled]:hover{background-color:revert}

package/dist/esm/index.mjs CHANGED Viewed

@@ -1,13 +1,12 @@
 import { jsxs as w, jsx as d } from "react/jsx-runtime";
-import { useDeterminateState as V } from "@telegraph/helpers";
-import { Icon as E } from "@telegraph/icon";
-import { Stack as O } from "@telegraph/layout";
-import { useStyleEngine as P } from "@telegraph/style-engine";
-import { Text as R } from "@telegraph/typography";
-import L from "clsx";
-import { LoaderCircle as B } from "lucide-react";
+import { useDeterminateState as P } from "@telegraph/helpers";
+import { Icon as R, Spinner as B } from "@telegraph/icon";
+import { Stack as L } from "@telegraph/layout";
+import { useStyleEngine as M } from "@telegraph/style-engine";
+import { Text as N } from "@telegraph/typography";
+import j from "clsx";
 import b from "react";
-const M = {
+const z = {
   default_buttonShadowColor: {
     cssVar: "--box-shadow",
     value: "inset 0 0 0 1px var(--tgph-VARIABLE)"
@@ -28,7 +27,7 @@ const M = {
     cssVar: "--tgph-button-hover-text-color",
     value: "var(--tgph-VARIABLE)"
   }
-}, N = {
+}, D = {
   solid: {
     default: {
       backgroundColor: "gray-12",
@@ -277,7 +276,7 @@ const M = {
       hover_textColor: "purple-11"
     }
   }
-}, j = {
+}, Z = {
   default: {
     0: {
       w: "auto",
@@ -338,12 +337,12 @@ const M = {
       rounded: "3"
     }
   }
-}, z = {
+}, U = {
   0: "0",
   1: "1",
   2: "2",
   3: "3"
-}, D = {
+}, X = {
   solid: {
     default: "white",
     gray: "white",
@@ -388,12 +387,12 @@ const M = {
     purple: "purple",
     disabled: "disabled"
   }
-}, Z = {
+}, f = {
   0: "0",
   1: "1",
   2: "2",
   3: "3"
-}, U = {
+}, x = {
   solid: {
     default: "white",
     gray: "white",
@@ -438,7 +437,7 @@ const M = {
     purple: "purple",
     disabled: "disabled"
   }
-}, X = {
+}, S = {
   default: "secondary",
   "icon-only": "primary"
 }, v = b.createContext({
@@ -448,36 +447,36 @@ const M = {
   state: "default",
   layout: "default",
   active: !1
-}), $ = (o) => o.disabled ? "disabled" : o.state === "loading" ? "loading" : o.active ? "active" : o.state, f = ({
+}), $ = (o) => o.disabled ? "disabled" : o.state === "loading" ? "loading" : o.active ? "active" : o.state, m = ({
   as: o,
   variant: r = "solid",
-  size: a = "2",
+  size: t = "2",
   color: e = "default",
   state: l = "default",
-  active: t = !1,
+  active: a = !1,
   type: n = "button",
   disabled: c,
   className: u,
   children: g,
-  style: i,
-  ...m
+  style: _,
+  ...T
 }) => {
-  const A = $({ state: l, disabled: c, active: t }), C = V({
-    value: A,
+  const V = $({ state: l, disabled: c, active: a }), C = P({
+    value: V,
     determinateValue: "loading",
     minDurationMs: 1200
-  }), { styleProp: I, otherProps: T } = P({
+  }), { styleProp: E, otherProps: O } = M({
     props: {
-      ...N[r][e],
-      style: i
+      ...D[r][e],
+      style: _
     },
-    cssVars: M
-  }), k = c || !o ? "button" : o, _ = b.useMemo(() => {
+    cssVars: z
+  }), k = c || !o ? "button" : o, h = b.useMemo(() => {
     var y;
     const s = b.Children.toArray(g);
     if ((s == null ? void 0 : s.length) === 1 && b.isValidElement(s[0])) {
-      const p = s[0];
-      if ((y = p == null ? void 0 : p.props) != null && y.icon)
+      const i = s[0];
+      if ((y = i == null ? void 0 : i.props) != null && y.icon)
         return "icon-only";
     }
     return "default";
@@ -485,32 +484,33 @@ const M = {
   return /* @__PURE__ */ d(
     v.Provider,
     {
-      value: { variant: r, size: a, color: e, state: C, layout: _, active: t },
+      value: { variant: r, size: t, color: e, state: C, layout: h, active: a },
       children: /* @__PURE__ */ w(
-        O,
+        L,
         {
           as: k,
-          className: L("tgph-button", u),
+          className: j("tgph-button", u),
           display: "inline-flex",
           align: "center",
           justify: "center",
-          ...j[_][a],
-          style: I,
+          ...Z[h][t],
+          style: E,
           "data-tgph-button": !0,
-          "data-tgph-button-layout": _,
+          "data-tgph-button-layout": h,
           "data-tgph-button-state": C,
           "data-tgph-button-variant": r,
           "data-tgph-button-color": e,
           disabled: C === "disabled" || C === "loading",
           ...k === "button" && { type: n },
+          ...O,
           ...T,
-          ...m,
           children: [
             C === "loading" && /* @__PURE__ */ d(
-              h,
+              B,
               {
-                icon: B,
-                "aria-hidden": !0,
+                size: f[t],
+                color: x[r][e],
+                variant: S[h],
                 "data-tgph-button-loading-icon": !0
               }
             ),
@@ -520,47 +520,47 @@ const M = {
       )
     }
   );
-}, h = ({
+}, p = ({
   size: o,
   color: r,
-  variant: a,
+  variant: t,
   icon: e,
   alt: l,
-  "aria-hidden": t,
+  "aria-hidden": a,
   internal_iconType: n,
   ...c
 }) => {
   const u = b.useContext(v), g = {
-    size: o ?? Z[u.size],
-    color: r ?? U[u.variant][u.state === "disabled" ? "disabled" : u.color],
-    variant: a ?? X[u.layout]
-  }, i = l ? { alt: l } : { "aria-hidden": t };
+    size: o ?? f[u.size],
+    color: r ?? x[u.variant][u.state === "disabled" ? "disabled" : u.color],
+    variant: t ?? S[u.layout]
+  }, _ = l ? { alt: l } : { "aria-hidden": a };
   return u.state === "loading" && n === "leading" ? null : /* @__PURE__ */ d(
-    E,
+    R,
     {
       icon: e,
       "data-button-icon": !0,
       "data-button-icon-color": g.color,
-      ...i,
+      ..._,
       ...g,
       ...c
     }
   );
-}, x = ({
+}, A = ({
   as: o,
   color: r,
-  size: a,
+  size: t,
   weight: e = "medium",
   style: l,
-  ...t
+  ...a
 }) => {
-  const n = b.useContext(v), c = r ?? D[n.variant][n.state === "disabled" ? "disabled" : n.color];
+  const n = b.useContext(v), c = r ?? X[n.variant][n.state === "disabled" ? "disabled" : n.color];
   return /* @__PURE__ */ d(
-    R,
+    N,
     {
       as: o || "span",
       color: c,
-      size: a ?? z[n.size],
+      size: t ?? U[n.size],
       weight: e,
       internal_optionalAs: !0,
       "data-button-text": !0,
@@ -570,30 +570,30 @@ const M = {
         whiteSpace: "nowrap",
         ...l
       },
-      ...t
+      ...a
     }
   );
-}, S = ({
+}, I = ({
   leadingIcon: o,
   trailingIcon: r,
-  icon: a,
+  icon: t,
   children: e,
   ...l
 }) => {
-  const t = o || a;
-  return /* @__PURE__ */ w(f, { ...l, children: [
-    t && /* @__PURE__ */ d(h, { ...t, internal_iconType: "leading" }),
-    e && /* @__PURE__ */ d(x, { children: e }),
-    r && /* @__PURE__ */ d(h, { ...r, internal_iconType: "trailing" })
+  const a = o || t;
+  return /* @__PURE__ */ w(m, { ...l, children: [
+    a && /* @__PURE__ */ d(p, { ...a, internal_iconType: "leading" }),
+    e && /* @__PURE__ */ d(A, { children: e }),
+    r && /* @__PURE__ */ d(p, { ...r, internal_iconType: "trailing" })
   ] });
 };
-Object.assign(S, {
-  Root: f,
-  Icon: h,
-  Text: x
+Object.assign(I, {
+  Root: m,
+  Icon: p,
+  Text: A
 });
-const oo = S;
+const Y = I;
 export {
-  oo as Button
+  Y as Button
 };
 //# sourceMappingURL=index.mjs.map

package/dist/esm/index.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.mjs","sources":["../../src/Button/Button.constants.ts","../../src/Button/Button.tsx"],"sourcesContent":["import type { tokens } from \"@telegraph/style-engine\";\nimport type { CssVarProp } from \"@telegraph/style-engine\";\n\n// Styles for controlling the \"border\" on the outline variant\n// of the button. We use a shadow so we don't need apply a border\n// to all other buttons to make them the same height.\nexport type BaseStyleProps = {\n default_buttonShadowColor: keyof typeof tokens.color;\n hover_buttonShadowColor: keyof typeof tokens.color;\n focus_buttonShadowColor: keyof typeof tokens.color;\n active_buttonShadowColor: keyof typeof tokens.color;\n hover_textColor?: keyof typeof tokens.color;\n};\n\nexport const cssVars: Record<keyof BaseStyleProps, CssVarProp> = {\n default_buttonShadowColor: {\n cssVar: \"--box-shadow\",\n value: \"inset 0 0 0 1px var(--tgph-VARIABLE)\",\n },\n hover_buttonShadowColor: {\n cssVar: \"--tgph-button-hover-shadow\",\n value: \"inset 0 0 0 1px var(--tgph-VARIABLE)\",\n },\n focus_buttonShadowColor: {\n cssVar: \"--tgph-button-focus-shadow\",\n value: \"inset 0 0 0 1px var(--tgph-VARIABLE)\",\n },\n active_buttonShadowColor: {\n cssVar: \"--tgph-button-active-shadow\",\n value: \"inset 0 0 0 1px var(--tgph-VARIABLE)\",\n },\n hover_textColor: {\n cssVar: \"--tgph-button-hover-text-color\",\n value: \"var(--tgph-VARIABLE)\",\n },\n} as const;\n\nexport const BUTTON_COLOR_MAP = {\n solid: {\n default: {\n backgroundColor: \"gray-12\",\n hover_backgroundColor: \"gray-11\",\n focus_backgroundColor: \"gray-10\",\n active_backgroundColor: \"gray-10\",\n hover_textColor: \"white\",\n },\n accent: {\n backgroundColor: \"accent-9\",\n hover_backgroundColor: \"accent-10\",\n focus_backgroundColor: \"accent-11\",\n active_backgroundColor: \"accent-11\",\n hover_textColor: \"white\",\n },\n red: {\n backgroundColor: \"red-9\",\n hover_backgroundColor: \"red-10\",\n focus_backgroundColor: \"red-11\",\n active_backgroundColor: \"red-11\",\n hover_textColor: \"white\",\n },\n gray: {\n backgroundColor: \"gray-9\",\n hover_backgroundColor: \"gray-10\",\n focus_backgroundColor: \"gray-11\",\n active_backgroundColor: \"gray-11\",\n hover_textColor: \"white\",\n },\n green: {\n backgroundColor: \"green-9\",\n hover_backgroundColor: \"green-10\",\n focus_backgroundColor: \"green-11\",\n active_backgroundColor: \"green-11\",\n hover_textColor: \"white\",\n },\n blue: {\n backgroundColor: \"blue-9\",\n hover_backgroundColor: \"blue-10\",\n focus_backgroundColor: \"blue-11\",\n active_backgroundColor: \"blue-11\",\n hover_textColor: \"white\",\n },\n yellow: {\n backgroundColor: \"yellow-9\",\n hover_backgroundColor: \"yellow-10\",\n focus_backgroundColor: \"yellow-11\",\n active_backgroundColor: \"yellow-11\",\n hover_textColor: \"white\",\n },\n purple: {\n backgroundColor: \"purple-9\",\n hover_backgroundColor: \"purple-10\",\n focus_backgroundColor: \"purple-11\",\n active_backgroundColor: \"purple-11\",\n hover_textColor: \"white\",\n },\n },\n soft: {\n default: {\n backgroundColor: \"gray-3\",\n hover_backgroundColor: \"gray-4\",\n focus_backgroundColor: \"gray-5\",\n active_backgroundColor: \"gray-5\",\n hover_textColor: \"gray-12\",\n },\n gray: {\n backgroundColor: \"gray-3\",\n hover_backgroundColor: \"gray-4\",\n focus_backgroundColor: \"gray-5\",\n active_backgroundColor: \"gray-5\",\n hover_textColor: \"gray-12\",\n },\n red: {\n backgroundColor: \"red-3\",\n hover_backgroundColor: \"red-4\",\n focus_backgroundColor: \"red-5\",\n active_backgroundColor: \"red-5\",\n hover_textColor: \"red-11\",\n },\n accent: {\n backgroundColor: \"accent-3\",\n hover_backgroundColor: \"accent-4\",\n focus_backgroundColor: \"accent-5\",\n active_backgroundColor: \"accent-5\",\n hover_textColor: \"accent-11\",\n },\n green: {\n backgroundColor: \"green-3\",\n hover_backgroundColor: \"green-4\",\n focus_backgroundColor: \"green-5\",\n active_backgroundColor: \"green-5\",\n hover_textColor: \"green-11\",\n },\n blue: {\n backgroundColor: \"blue-3\",\n hover_backgroundColor: \"blue-4\",\n focus_backgroundColor: \"blue-5\",\n active_backgroundColor: \"blue-5\",\n hover_textColor: \"blue-11\",\n },\n yellow: {\n backgroundColor: \"yellow-3\",\n hover_backgroundColor: \"yellow-4\",\n focus_backgroundColor: \"yellow-5\",\n active_backgroundColor: \"yellow-5\",\n hover_textColor: \"yellow-11\",\n },\n purple: {\n backgroundColor: \"purple-3\",\n hover_backgroundColor: \"purple-4\",\n focus_backgroundColor: \"purple-5\",\n active_backgroundColor: \"purple-5\",\n hover_textColor: \"purple-11\",\n },\n },\n outline: {\n default: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"gray-2\",\n default_buttonShadowColor: \"gray-6\",\n hover_buttonShadowColor: \"gray-7\",\n focus_buttonShadowColor: \"gray-8\",\n active_buttonShadowColor: \"gray-8\",\n hover_textColor: \"gray-12\",\n },\n gray: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"gray-2\",\n default_buttonShadowColor: \"gray-6\",\n hover_buttonShadowColor: \"gray-7\",\n focus_buttonShadowColor: \"gray-8\",\n active_buttonShadowColor: \"gray-8\",\n hover_textColor: \"gray-12\",\n },\n red: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"red-2\",\n default_buttonShadowColor: \"red-6\",\n hover_buttonShadowColor: \"red-7\",\n focus_buttonShadowColor: \"red-8\",\n active_buttonShadowColor: \"red-8\",\n hover_textColor: \"red-11\",\n },\n accent: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"accent-2\",\n default_buttonShadowColor: \"accent-6\",\n hover_buttonShadowColor: \"accent-7\",\n focus_buttonShadowColor: \"accent-8\",\n active_buttonShadowColor: \"accent-8\",\n hover_textColor: \"accent-11\",\n },\n green: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"green-2\",\n default_buttonShadowColor: \"green-6\",\n hover_buttonShadowColor: \"green-7\",\n focus_buttonShadowColor: \"green-8\",\n active_buttonShadowColor: \"green-8\",\n hover_textColor: \"green-11\",\n },\n blue: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"blue-2\",\n default_buttonShadowColor: \"blue-6\",\n hover_buttonShadowColor: \"blue-7\",\n focus_buttonShadowColor: \"blue-8\",\n active_buttonShadowColor: \"blue-8\",\n hover_textColor: \"blue-11\",\n },\n yellow: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"yellow-2\",\n default_buttonShadowColor: \"yellow-6\",\n hover_buttonShadowColor: \"yellow-7\",\n focus_buttonShadowColor: \"yellow-8\",\n active_buttonShadowColor: \"yellow-8\",\n hover_textColor: \"yellow-11\",\n },\n purple: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"purple-2\",\n default_buttonShadowColor: \"purple-6\",\n hover_buttonShadowColor: \"purple-7\",\n focus_buttonShadowColor: \"purple-8\",\n active_buttonShadowColor: \"purple-8\",\n hover_textColor: \"purple-11\",\n },\n },\n ghost: {\n default: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"gray-3\",\n focus_backgroundColor: \"gray-4\",\n active_backgroundColor: \"gray-4\",\n hover_textColor: \"gray-12\",\n },\n gray: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"gray-3\",\n focus_backgroundColor: \"gray-4\",\n active_backgroundColor: \"gray-4\",\n hover_textColor: \"gray-12\",\n },\n red: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"red-3\",\n focus_backgroundColor: \"red-4\",\n active_backgroundColor: \"red-4\",\n hover_textColor: \"red-11\",\n },\n accent: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"accent-3\",\n focus_backgroundColor: \"accent-4\",\n active_backgroundColor: \"accent-4\",\n hover_textColor: \"accent-11\",\n },\n green: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"green-3\",\n focus_backgroundColor: \"green-4\",\n active_backgroundColor: \"green-4\",\n hover_textColor: \"green-11\",\n },\n blue: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"blue-3\",\n focus_backgroundColor: \"blue-4\",\n active_backgroundColor: \"blue-4\",\n hover_textColor: \"blue-11\",\n },\n yellow: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"yellow-3\",\n focus_backgroundColor: \"yellow-4\",\n active_backgroundColor: \"yellow-4\",\n hover_textColor: \"yellow-11\",\n },\n purple: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"purple-3\",\n focus_backgroundColor: \"purple-4\",\n active_backgroundColor: \"purple-4\",\n hover_textColor: \"purple-11\",\n },\n },\n} as const;\n\nexport const BUTTON_SIZE_MAP = {\n default: {\n \"0\": {\n w: \"auto\",\n h: \"5\",\n gap: \"0_5\",\n px: \"1\",\n rounded: \"2\",\n },\n \"1\": {\n w: \"auto\",\n h: \"6\",\n gap: \"1\",\n px: \"1_5\",\n rounded: \"2\",\n },\n \"2\": {\n w: \"auto\",\n h: \"8\",\n gap: \"1_5\",\n px: \"2\",\n rounded: \"2\",\n },\n \"3\": {\n w: \"auto\",\n h: \"10\",\n gap: \"2\",\n px: \"3\",\n rounded: \"3\",\n },\n },\n \"icon-only\": {\n \"0\": {\n w: \"5\",\n h: \"5\",\n gap: \"0\",\n px: \"0\",\n rounded: \"2\",\n },\n \"1\": {\n w: \"6\",\n h: \"6\",\n gap: \"0\",\n px: \"0\",\n rounded: \"2\",\n },\n \"2\": {\n w: \"8\",\n h: \"8\",\n gap: \"0\",\n px: \"0\",\n rounded: \"2\",\n },\n \"3\": {\n w: \"10\",\n h: \"10\",\n gap: \"0\",\n px: \"0\",\n rounded: \"3\",\n },\n },\n} as const;\n\nexport const TEXT_SIZE_MAP = {\n \"0\": \"0\",\n \"1\": \"1\",\n \"2\": \"2\",\n \"3\": \"3\",\n} as const;\n\nexport const TEXT_COLOR_MAP = {\n solid: {\n default: \"white\",\n gray: \"white\",\n red: \"white\",\n accent: \"white\",\n green: \"white\",\n blue: \"white\",\n yellow: \"white\",\n purple: \"white\",\n disabled: \"disabled\",\n },\n soft: {\n default: \"default\",\n gray: \"gray\",\n red: \"red\",\n accent: \"accent\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n outline: {\n default: \"default\",\n gray: \"gray\",\n red: \"red\",\n accent: \"accent\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n ghost: {\n default: \"default\",\n gray: \"gray\",\n red: \"red\",\n accent: \"accent\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n} as const;\n\nexport const ICON_SIZE_MAP = {\n \"0\": \"0\",\n \"1\": \"1\",\n \"2\": \"2\",\n \"3\": \"3\",\n} as const;\n\nexport const ICON_COLOR_MAP = {\n solid: {\n default: \"white\",\n gray: \"white\",\n red: \"white\",\n accent: \"white\",\n green: \"white\",\n blue: \"white\",\n yellow: \"white\",\n purple: \"white\",\n disabled: \"disabled\",\n },\n soft: {\n default: \"default\",\n accent: \"accent\",\n gray: \"gray\",\n red: \"red\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n outline: {\n default: \"default\",\n accent: \"accent\",\n gray: \"gray\",\n red: \"red\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n ghost: {\n default: \"gray\",\n accent: \"accent\",\n gray: \"gray\",\n red: \"red\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n} as const;\n\nexport const ICON_VARIANT_MAP = {\n default: \"secondary\",\n \"icon-only\": \"primary\",\n} as const;\n\nexport type ButtonVariant = keyof typeof BUTTON_COLOR_MAP;\nexport type ButtonColor = keyof (typeof BUTTON_COLOR_MAP)[ButtonVariant];\nexport type ButtonSize = keyof (typeof BUTTON_SIZE_MAP)[\"default\"];\n","import {\n type PolymorphicProps,\n type PolymorphicPropsWithTgphRef,\n RemappedOmit,\n type Required,\n type TgphComponentProps,\n type TgphElement,\n useDeterminateState,\n} from \"@telegraph/helpers\";\nimport { Icon as TelegraphIcon } from \"@telegraph/icon\";\nimport { Stack } from \"@telegraph/layout\";\nimport { useStyleEngine } from \"@telegraph/style-engine\";\nimport { Text as TelegraphText } from \"@telegraph/typography\";\nimport clsx from \"clsx\";\nimport { LoaderCircle } from \"lucide-react\";\nimport React from \"react\";\n\nimport {\n BUTTON_COLOR_MAP,\n BUTTON_SIZE_MAP,\n type ButtonColor,\n type ButtonSize,\n type ButtonVariant,\n ICON_COLOR_MAP,\n ICON_SIZE_MAP,\n ICON_VARIANT_MAP,\n TEXT_COLOR_MAP,\n TEXT_SIZE_MAP,\n cssVars,\n} from \"./Button.constants\";\n\ntype RootBaseProps = {\n variant?: ButtonVariant;\n color?: ButtonColor;\n size?: ButtonSize;\n state?: \"default\" \| \"loading\";\n active?: boolean;\n};\n\ntype InternalProps = {\n layout: \"default\" \| \"icon-only\";\n color: Required<RootBaseProps>[\"color\"];\n state: Required<RootBaseProps>[\"state\"] \| \"disabled\" \| \"active\";\n};\n\ntype RootProps<T extends TgphElement> = Omit<\n TgphComponentProps<typeof Stack>,\n \"tgphRef\"\n> &\n PolymorphicPropsWithTgphRef<T, HTMLButtonElement> &\n RootBaseProps;\n\nconst ButtonContext = React.createContext<\n Required<Omit<RootBaseProps, \"color\" \| \"as\" \| \"state\"> & InternalProps>\n>({\n variant: \"solid\",\n size: \"2\",\n color: \"default\",\n state: \"default\",\n layout: \"default\",\n active: false,\n});\n\ntype DeriveStateParams = {\n state: Required<RootBaseProps>[\"state\"];\n disabled?: boolean;\n active?: boolean;\n};\n\n// Derive the state of the button based on the html button props in\nconst deriveState = (params: DeriveStateParams): InternalProps[\"state\"] => {\n if (params.disabled) return \"disabled\";\n if (params.state === \"loading\") return \"loading\";\n if (params.active) return \"active\";\n return params.state;\n};\n\nconst Root = <T extends TgphElement>({\n as,\n variant = \"solid\",\n size = \"2\",\n color = \"default\",\n state: stateProp = \"default\",\n active = false,\n type = \"button\",\n disabled,\n className,\n children,\n style,\n ...props\n}: RootProps<T>) => {\n const derivedState = deriveState({ state: stateProp, disabled, active });\n const state = useDeterminateState<DefaultProps<T>[\"state\"]>({\n value: derivedState,\n determinateValue: \"loading\",\n minDurationMs: 1200,\n });\n\n const { styleProp, otherProps } = useStyleEngine({\n props: {\n ...BUTTON_COLOR_MAP[variant][color],\n style,\n },\n cssVars,\n });\n\n // If the button is in a disabled state, we don't want any clicks to fire.\n // To do this reliably, we convert the element back to a button if it is\n // disabled. We do this so we can use the native button element's disabled\n // state to prevent clicks.\n // We also want to trivially pass in \"button\" if no \"as\" prop is provided\n const derivedAs = disabled \|\| !as ? \"button\" : as;\n\n const layout = React.useMemo<InternalProps[\"layout\"]>(() => {\n const childrenArray = React.Children.toArray(children);\n if (childrenArray?.length === 1 && React.isValidElement(childrenArray[0])) {\n const child = childrenArray[0] as\n \| React.ReactComponentElement<typeof Icon>\n \| {\n props: {\n icon: undefined;\n };\n };\n if (child?.props?.icon) {\n return \"icon-only\";\n }\n }\n return \"default\";\n }, [children]);\n\n return (\n <ButtonContext.Provider\n value={{ variant, size, color, state, layout, active }}\n >\n <Stack\n as={derivedAs}\n className={clsx(\"tgph-button\", className)}\n display=\"inline-flex\"\n align=\"center\"\n justify=\"center\"\n {...BUTTON_SIZE_MAP[layout][size]}\n style={styleProp}\n data-tgph-button\n data-tgph-button-layout={layout}\n data-tgph-button-state={state}\n data-tgph-button-variant={variant}\n data-tgph-button-color={color}\n disabled={state === \"disabled\" \|\| state === \"loading\"}\n {...(derivedAs === \"button\" && { type })} // Only pass in type if we are a button\n {...otherProps}\n {...props}\n >\n {state === \"loading\" && (\n <Icon\n icon={LoaderCircle}\n aria-hidden={true}\n data-tgph-button-loading-icon\n />\n )}\n {children}\n </Stack>\n </ButtonContext.Provider>\n );\n};\n\ntype IconProps<T extends TgphElement> = TgphComponentProps<\n typeof TelegraphIcon<T>\n> & {\n internal_iconType?: \"leading\" \| \"trailing\";\n};\n\nconst Icon = <T extends TgphElement>({\n size,\n color,\n variant,\n icon,\n alt,\n \"aria-hidden\": ariaHidden,\n internal_iconType,\n ...props\n}: IconProps<T>) => {\n const context = React.useContext(ButtonContext);\n\n const iconProps = {\n size: size ?? ICON_SIZE_MAP[context.size],\n color:\n color ??\n ICON_COLOR_MAP[context.variant][\n context.state === \"disabled\" ? \"disabled\" : context.color\n ],\n variant: variant ?? ICON_VARIANT_MAP[context.layout],\n };\n\n const a11yProps = !alt ? { \"aria-hidden\": ariaHidden } : { alt };\n\n // If the button is set to loading and this icon is identified as leading,\n // we don't want to render this icon and instead the loading icon which\n // is managed in the root component. We choose to render the loading icon\n // in the root component so that it displays when there is no icon already\n // inside of the button.\n if (context.state === \"loading\" && internal_iconType === \"leading\") {\n return null;\n }\n\n return (\n <TelegraphIcon\n icon={icon}\n data-button-icon\n data-button-icon-color={iconProps.color}\n {...a11yProps}\n {...iconProps}\n {...props}\n />\n );\n};\n\ntype TextProps<T extends TgphElement> = RemappedOmit<\n TgphComponentProps<typeof TelegraphText<T>>,\n \"as\"\n> & {\n as?: T;\n};\n\nconst Text = <T extends TgphElement>({\n as,\n color,\n size,\n weight = \"medium\",\n style,\n ...props\n}: TextProps<T>) => {\n const context = React.useContext(ButtonContext);\n const derivedColor =\n color ??\n TEXT_COLOR_MAP[context.variant][\n context.state === \"disabled\" ? \"disabled\" : context.color\n ];\n return (\n <TelegraphText\n as={(as \|\| \"span\") as T}\n color={derivedColor}\n size={size ?? TEXT_SIZE_MAP[context.size]}\n weight={weight}\n internal_optionalAs={true}\n data-button-text\n data-button-text-color={derivedColor}\n style={{\n textDecoration: \"none\",\n whiteSpace: \"nowrap\",\n ...style,\n }}\n {...props}\n />\n );\n};\n\ntype DefaultIconProps = React.ComponentProps<typeof Icon>;\n\ntype BaseDefaultProps =\n \| {\n leadingIcon?: DefaultIconProps;\n trailingIcon?: DefaultIconProps;\n icon?: never;\n }\n \| {\n icon?: DefaultIconProps;\n leadingIcon?: never;\n trailingIcon?: never;\n };\ntype DefaultProps<T extends TgphElement> = PolymorphicProps<T> &\n TgphComponentProps<typeof Root> &\n BaseDefaultProps;\n\nconst Default = <T extends TgphElement>({\n leadingIcon,\n trailingIcon,\n icon,\n children,\n ...props\n}: DefaultProps<T>) => {\n const combinedLeadingIcon = leadingIcon \|\| icon;\n return (\n <Root {...props}>\n {combinedLeadingIcon && (\n <Icon {...combinedLeadingIcon} internal_iconType=\"leading\" />\n )}\n {children && <Text>{children}</Text>}\n {trailingIcon && <Icon {...trailingIcon} internal_iconType=\"trailing\" />}\n </Root>\n );\n};\n\nObject.assign(Default, {\n Root,\n Icon,\n Text,\n});\n\nconst Button = Default as typeof Default & {\n Root: typeof Root;\n Icon: typeof Icon;\n Text: typeof Text;\n};\n\nexport { Button };\n"],"names":["cssVars","BUTTON_COLOR_MAP","BUTTON_SIZE_MAP","TEXT_SIZE_MAP","TEXT_COLOR_MAP","ICON_SIZE_MAP","ICON_COLOR_MAP","ICON_VARIANT_MAP","ButtonContext","React","deriveState","params","Root","as","variant","size","color","stateProp","active","type","disabled","className","children","style","props","derivedState","state","useDeterminateState","styleProp","otherProps","useStyleEngine","derivedAs","layout","childrenArray","child","_a","jsx","jsxs","Stack","clsx","Icon","LoaderCircle","icon","alt","ariaHidden","internal_iconType","context","iconProps","a11yProps","TelegraphIcon","Text","weight","derivedColor","TelegraphText","Default","leadingIcon","trailingIcon","combinedLeadingIcon","Button"],"mappings":"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"}
1	+ {"version":3,"file":"index.mjs","sources":["../../src/Button/Button.constants.ts","../../src/Button/Button.tsx"],"sourcesContent":["import type { tokens } from \"@telegraph/style-engine\";\nimport type { CssVarProp } from \"@telegraph/style-engine\";\n\n// Styles for controlling the \"border\" on the outline variant\n// of the button. We use a shadow so we don't need apply a border\n// to all other buttons to make them the same height.\nexport type BaseStyleProps = {\n default_buttonShadowColor: keyof typeof tokens.color;\n hover_buttonShadowColor: keyof typeof tokens.color;\n focus_buttonShadowColor: keyof typeof tokens.color;\n active_buttonShadowColor: keyof typeof tokens.color;\n hover_textColor?: keyof typeof tokens.color;\n};\n\nexport const cssVars: Record<keyof BaseStyleProps, CssVarProp> = {\n default_buttonShadowColor: {\n cssVar: \"--box-shadow\",\n value: \"inset 0 0 0 1px var(--tgph-VARIABLE)\",\n },\n hover_buttonShadowColor: {\n cssVar: \"--tgph-button-hover-shadow\",\n value: \"inset 0 0 0 1px var(--tgph-VARIABLE)\",\n },\n focus_buttonShadowColor: {\n cssVar: \"--tgph-button-focus-shadow\",\n value: \"inset 0 0 0 1px var(--tgph-VARIABLE)\",\n },\n active_buttonShadowColor: {\n cssVar: \"--tgph-button-active-shadow\",\n value: \"inset 0 0 0 1px var(--tgph-VARIABLE)\",\n },\n hover_textColor: {\n cssVar: \"--tgph-button-hover-text-color\",\n value: \"var(--tgph-VARIABLE)\",\n },\n} as const;\n\nexport const BUTTON_COLOR_MAP = {\n solid: {\n default: {\n backgroundColor: \"gray-12\",\n hover_backgroundColor: \"gray-11\",\n focus_backgroundColor: \"gray-10\",\n active_backgroundColor: \"gray-10\",\n hover_textColor: \"white\",\n },\n accent: {\n backgroundColor: \"accent-9\",\n hover_backgroundColor: \"accent-10\",\n focus_backgroundColor: \"accent-11\",\n active_backgroundColor: \"accent-11\",\n hover_textColor: \"white\",\n },\n red: {\n backgroundColor: \"red-9\",\n hover_backgroundColor: \"red-10\",\n focus_backgroundColor: \"red-11\",\n active_backgroundColor: \"red-11\",\n hover_textColor: \"white\",\n },\n gray: {\n backgroundColor: \"gray-9\",\n hover_backgroundColor: \"gray-10\",\n focus_backgroundColor: \"gray-11\",\n active_backgroundColor: \"gray-11\",\n hover_textColor: \"white\",\n },\n green: {\n backgroundColor: \"green-9\",\n hover_backgroundColor: \"green-10\",\n focus_backgroundColor: \"green-11\",\n active_backgroundColor: \"green-11\",\n hover_textColor: \"white\",\n },\n blue: {\n backgroundColor: \"blue-9\",\n hover_backgroundColor: \"blue-10\",\n focus_backgroundColor: \"blue-11\",\n active_backgroundColor: \"blue-11\",\n hover_textColor: \"white\",\n },\n yellow: {\n backgroundColor: \"yellow-9\",\n hover_backgroundColor: \"yellow-10\",\n focus_backgroundColor: \"yellow-11\",\n active_backgroundColor: \"yellow-11\",\n hover_textColor: \"white\",\n },\n purple: {\n backgroundColor: \"purple-9\",\n hover_backgroundColor: \"purple-10\",\n focus_backgroundColor: \"purple-11\",\n active_backgroundColor: \"purple-11\",\n hover_textColor: \"white\",\n },\n },\n soft: {\n default: {\n backgroundColor: \"gray-3\",\n hover_backgroundColor: \"gray-4\",\n focus_backgroundColor: \"gray-5\",\n active_backgroundColor: \"gray-5\",\n hover_textColor: \"gray-12\",\n },\n gray: {\n backgroundColor: \"gray-3\",\n hover_backgroundColor: \"gray-4\",\n focus_backgroundColor: \"gray-5\",\n active_backgroundColor: \"gray-5\",\n hover_textColor: \"gray-12\",\n },\n red: {\n backgroundColor: \"red-3\",\n hover_backgroundColor: \"red-4\",\n focus_backgroundColor: \"red-5\",\n active_backgroundColor: \"red-5\",\n hover_textColor: \"red-11\",\n },\n accent: {\n backgroundColor: \"accent-3\",\n hover_backgroundColor: \"accent-4\",\n focus_backgroundColor: \"accent-5\",\n active_backgroundColor: \"accent-5\",\n hover_textColor: \"accent-11\",\n },\n green: {\n backgroundColor: \"green-3\",\n hover_backgroundColor: \"green-4\",\n focus_backgroundColor: \"green-5\",\n active_backgroundColor: \"green-5\",\n hover_textColor: \"green-11\",\n },\n blue: {\n backgroundColor: \"blue-3\",\n hover_backgroundColor: \"blue-4\",\n focus_backgroundColor: \"blue-5\",\n active_backgroundColor: \"blue-5\",\n hover_textColor: \"blue-11\",\n },\n yellow: {\n backgroundColor: \"yellow-3\",\n hover_backgroundColor: \"yellow-4\",\n focus_backgroundColor: \"yellow-5\",\n active_backgroundColor: \"yellow-5\",\n hover_textColor: \"yellow-11\",\n },\n purple: {\n backgroundColor: \"purple-3\",\n hover_backgroundColor: \"purple-4\",\n focus_backgroundColor: \"purple-5\",\n active_backgroundColor: \"purple-5\",\n hover_textColor: \"purple-11\",\n },\n },\n outline: {\n default: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"gray-2\",\n default_buttonShadowColor: \"gray-6\",\n hover_buttonShadowColor: \"gray-7\",\n focus_buttonShadowColor: \"gray-8\",\n active_buttonShadowColor: \"gray-8\",\n hover_textColor: \"gray-12\",\n },\n gray: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"gray-2\",\n default_buttonShadowColor: \"gray-6\",\n hover_buttonShadowColor: \"gray-7\",\n focus_buttonShadowColor: \"gray-8\",\n active_buttonShadowColor: \"gray-8\",\n hover_textColor: \"gray-12\",\n },\n red: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"red-2\",\n default_buttonShadowColor: \"red-6\",\n hover_buttonShadowColor: \"red-7\",\n focus_buttonShadowColor: \"red-8\",\n active_buttonShadowColor: \"red-8\",\n hover_textColor: \"red-11\",\n },\n accent: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"accent-2\",\n default_buttonShadowColor: \"accent-6\",\n hover_buttonShadowColor: \"accent-7\",\n focus_buttonShadowColor: \"accent-8\",\n active_buttonShadowColor: \"accent-8\",\n hover_textColor: \"accent-11\",\n },\n green: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"green-2\",\n default_buttonShadowColor: \"green-6\",\n hover_buttonShadowColor: \"green-7\",\n focus_buttonShadowColor: \"green-8\",\n active_buttonShadowColor: \"green-8\",\n hover_textColor: \"green-11\",\n },\n blue: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"blue-2\",\n default_buttonShadowColor: \"blue-6\",\n hover_buttonShadowColor: \"blue-7\",\n focus_buttonShadowColor: \"blue-8\",\n active_buttonShadowColor: \"blue-8\",\n hover_textColor: \"blue-11\",\n },\n yellow: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"yellow-2\",\n default_buttonShadowColor: \"yellow-6\",\n hover_buttonShadowColor: \"yellow-7\",\n focus_buttonShadowColor: \"yellow-8\",\n active_buttonShadowColor: \"yellow-8\",\n hover_textColor: \"yellow-11\",\n },\n purple: {\n backgroundColor: \"surface-1\",\n hover_backgroundColor: \"purple-2\",\n default_buttonShadowColor: \"purple-6\",\n hover_buttonShadowColor: \"purple-7\",\n focus_buttonShadowColor: \"purple-8\",\n active_buttonShadowColor: \"purple-8\",\n hover_textColor: \"purple-11\",\n },\n },\n ghost: {\n default: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"gray-3\",\n focus_backgroundColor: \"gray-4\",\n active_backgroundColor: \"gray-4\",\n hover_textColor: \"gray-12\",\n },\n gray: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"gray-3\",\n focus_backgroundColor: \"gray-4\",\n active_backgroundColor: \"gray-4\",\n hover_textColor: \"gray-12\",\n },\n red: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"red-3\",\n focus_backgroundColor: \"red-4\",\n active_backgroundColor: \"red-4\",\n hover_textColor: \"red-11\",\n },\n accent: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"accent-3\",\n focus_backgroundColor: \"accent-4\",\n active_backgroundColor: \"accent-4\",\n hover_textColor: \"accent-11\",\n },\n green: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"green-3\",\n focus_backgroundColor: \"green-4\",\n active_backgroundColor: \"green-4\",\n hover_textColor: \"green-11\",\n },\n blue: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"blue-3\",\n focus_backgroundColor: \"blue-4\",\n active_backgroundColor: \"blue-4\",\n hover_textColor: \"blue-11\",\n },\n yellow: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"yellow-3\",\n focus_backgroundColor: \"yellow-4\",\n active_backgroundColor: \"yellow-4\",\n hover_textColor: \"yellow-11\",\n },\n purple: {\n backgroundColor: \"transparent\",\n hover_backgroundColor: \"purple-3\",\n focus_backgroundColor: \"purple-4\",\n active_backgroundColor: \"purple-4\",\n hover_textColor: \"purple-11\",\n },\n },\n} as const;\n\nexport const BUTTON_SIZE_MAP = {\n default: {\n \"0\": {\n w: \"auto\",\n h: \"5\",\n gap: \"0_5\",\n px: \"1\",\n rounded: \"2\",\n },\n \"1\": {\n w: \"auto\",\n h: \"6\",\n gap: \"1\",\n px: \"1_5\",\n rounded: \"2\",\n },\n \"2\": {\n w: \"auto\",\n h: \"8\",\n gap: \"1_5\",\n px: \"2\",\n rounded: \"2\",\n },\n \"3\": {\n w: \"auto\",\n h: \"10\",\n gap: \"2\",\n px: \"3\",\n rounded: \"3\",\n },\n },\n \"icon-only\": {\n \"0\": {\n w: \"5\",\n h: \"5\",\n gap: \"0\",\n px: \"0\",\n rounded: \"2\",\n },\n \"1\": {\n w: \"6\",\n h: \"6\",\n gap: \"0\",\n px: \"0\",\n rounded: \"2\",\n },\n \"2\": {\n w: \"8\",\n h: \"8\",\n gap: \"0\",\n px: \"0\",\n rounded: \"2\",\n },\n \"3\": {\n w: \"10\",\n h: \"10\",\n gap: \"0\",\n px: \"0\",\n rounded: \"3\",\n },\n },\n} as const;\n\nexport const TEXT_SIZE_MAP = {\n \"0\": \"0\",\n \"1\": \"1\",\n \"2\": \"2\",\n \"3\": \"3\",\n} as const;\n\nexport const TEXT_COLOR_MAP = {\n solid: {\n default: \"white\",\n gray: \"white\",\n red: \"white\",\n accent: \"white\",\n green: \"white\",\n blue: \"white\",\n yellow: \"white\",\n purple: \"white\",\n disabled: \"disabled\",\n },\n soft: {\n default: \"default\",\n gray: \"gray\",\n red: \"red\",\n accent: \"accent\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n outline: {\n default: \"default\",\n gray: \"gray\",\n red: \"red\",\n accent: \"accent\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n ghost: {\n default: \"default\",\n gray: \"gray\",\n red: \"red\",\n accent: \"accent\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n} as const;\n\nexport const ICON_SIZE_MAP = {\n \"0\": \"0\",\n \"1\": \"1\",\n \"2\": \"2\",\n \"3\": \"3\",\n} as const;\n\nexport const ICON_COLOR_MAP = {\n solid: {\n default: \"white\",\n gray: \"white\",\n red: \"white\",\n accent: \"white\",\n green: \"white\",\n blue: \"white\",\n yellow: \"white\",\n purple: \"white\",\n disabled: \"disabled\",\n },\n soft: {\n default: \"default\",\n accent: \"accent\",\n gray: \"gray\",\n red: \"red\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n outline: {\n default: \"default\",\n accent: \"accent\",\n gray: \"gray\",\n red: \"red\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n ghost: {\n default: \"gray\",\n accent: \"accent\",\n gray: \"gray\",\n red: \"red\",\n green: \"green\",\n blue: \"blue\",\n yellow: \"yellow\",\n purple: \"purple\",\n disabled: \"disabled\",\n },\n} as const;\n\nexport const ICON_VARIANT_MAP = {\n default: \"secondary\",\n \"icon-only\": \"primary\",\n} as const;\n\nexport type ButtonVariant = keyof typeof BUTTON_COLOR_MAP;\nexport type ButtonColor = keyof (typeof BUTTON_COLOR_MAP)[ButtonVariant];\nexport type ButtonSize = keyof (typeof BUTTON_SIZE_MAP)[\"default\"];\n","import {\n type PolymorphicProps,\n type PolymorphicPropsWithTgphRef,\n RemappedOmit,\n type Required,\n type TgphComponentProps,\n type TgphElement,\n useDeterminateState,\n} from \"@telegraph/helpers\";\nimport { Spinner, Icon as TelegraphIcon } from \"@telegraph/icon\";\nimport { Stack } from \"@telegraph/layout\";\nimport { useStyleEngine } from \"@telegraph/style-engine\";\nimport { Text as TelegraphText } from \"@telegraph/typography\";\nimport clsx from \"clsx\";\nimport React from \"react\";\n\nimport {\n BUTTON_COLOR_MAP,\n BUTTON_SIZE_MAP,\n type ButtonColor,\n type ButtonSize,\n type ButtonVariant,\n ICON_COLOR_MAP,\n ICON_SIZE_MAP,\n ICON_VARIANT_MAP,\n TEXT_COLOR_MAP,\n TEXT_SIZE_MAP,\n cssVars,\n} from \"./Button.constants\";\n\ntype RootBaseProps = {\n variant?: ButtonVariant;\n color?: ButtonColor;\n size?: ButtonSize;\n state?: \"default\" \| \"loading\";\n active?: boolean;\n};\n\ntype InternalProps = {\n layout: \"default\" \| \"icon-only\";\n color: Required<RootBaseProps>[\"color\"];\n state: Required<RootBaseProps>[\"state\"] \| \"disabled\" \| \"active\";\n};\n\ntype RootProps<T extends TgphElement> = Omit<\n TgphComponentProps<typeof Stack>,\n \"tgphRef\"\n> &\n PolymorphicPropsWithTgphRef<T, HTMLButtonElement> &\n RootBaseProps;\n\nconst ButtonContext = React.createContext<\n Required<Omit<RootBaseProps, \"color\" \| \"as\" \| \"state\"> & InternalProps>\n>({\n variant: \"solid\",\n size: \"2\",\n color: \"default\",\n state: \"default\",\n layout: \"default\",\n active: false,\n});\n\ntype DeriveStateParams = {\n state: Required<RootBaseProps>[\"state\"];\n disabled?: boolean;\n active?: boolean;\n};\n\n// Derive the state of the button based on the html button props in\nconst deriveState = (params: DeriveStateParams): InternalProps[\"state\"] => {\n if (params.disabled) return \"disabled\";\n if (params.state === \"loading\") return \"loading\";\n if (params.active) return \"active\";\n return params.state;\n};\n\nconst Root = <T extends TgphElement>({\n as,\n variant = \"solid\",\n size = \"2\",\n color = \"default\",\n state: stateProp = \"default\",\n active = false,\n type = \"button\",\n disabled,\n className,\n children,\n style,\n ...props\n}: RootProps<T>) => {\n const derivedState = deriveState({ state: stateProp, disabled, active });\n const state = useDeterminateState<DefaultProps<T>[\"state\"]>({\n value: derivedState,\n determinateValue: \"loading\",\n minDurationMs: 1200,\n });\n\n const { styleProp, otherProps } = useStyleEngine({\n props: {\n ...BUTTON_COLOR_MAP[variant][color],\n style,\n },\n cssVars,\n });\n\n // If the button is in a disabled state, we don't want any clicks to fire.\n // To do this reliably, we convert the element back to a button if it is\n // disabled. We do this so we can use the native button element's disabled\n // state to prevent clicks.\n // We also want to trivially pass in \"button\" if no \"as\" prop is provided\n const derivedAs = disabled \|\| !as ? \"button\" : as;\n\n const layout = React.useMemo<InternalProps[\"layout\"]>(() => {\n const childrenArray = React.Children.toArray(children);\n if (childrenArray?.length === 1 && React.isValidElement(childrenArray[0])) {\n const child = childrenArray[0] as\n \| React.ReactComponentElement<typeof Icon>\n \| {\n props: {\n icon: undefined;\n };\n };\n if (child?.props?.icon) {\n return \"icon-only\";\n }\n }\n return \"default\";\n }, [children]);\n\n return (\n <ButtonContext.Provider\n value={{ variant, size, color, state, layout, active }}\n >\n <Stack\n as={derivedAs}\n className={clsx(\"tgph-button\", className)}\n display=\"inline-flex\"\n align=\"center\"\n justify=\"center\"\n {...BUTTON_SIZE_MAP[layout][size]}\n style={styleProp}\n data-tgph-button\n data-tgph-button-layout={layout}\n data-tgph-button-state={state}\n data-tgph-button-variant={variant}\n data-tgph-button-color={color}\n disabled={state === \"disabled\" \|\| state === \"loading\"}\n {...(derivedAs === \"button\" && { type })} // Only pass in type if we are a button\n {...otherProps}\n {...props}\n >\n {state === \"loading\" && (\n <Spinner\n size={ICON_SIZE_MAP[size]}\n color={ICON_COLOR_MAP[variant][color]}\n variant={ICON_VARIANT_MAP[layout]}\n data-tgph-button-loading-icon\n />\n )}\n {children}\n </Stack>\n </ButtonContext.Provider>\n );\n};\n\ntype IconProps<T extends TgphElement> = TgphComponentProps<\n typeof TelegraphIcon<T>\n> & {\n internal_iconType?: \"leading\" \| \"trailing\";\n};\n\nconst Icon = <T extends TgphElement>({\n size,\n color,\n variant,\n icon,\n alt,\n \"aria-hidden\": ariaHidden,\n internal_iconType,\n ...props\n}: IconProps<T>) => {\n const context = React.useContext(ButtonContext);\n\n const iconProps = {\n size: size ?? ICON_SIZE_MAP[context.size],\n color:\n color ??\n ICON_COLOR_MAP[context.variant][\n context.state === \"disabled\" ? \"disabled\" : context.color\n ],\n variant: variant ?? ICON_VARIANT_MAP[context.layout],\n };\n\n const a11yProps = !alt ? { \"aria-hidden\": ariaHidden } : { alt };\n\n // If the button is set to loading and this icon is identified as leading,\n // we don't want to render this icon and instead the loading icon which\n // is managed in the root component. We choose to render the loading icon\n // in the root component so that it displays when there is no icon already\n // inside of the button.\n if (context.state === \"loading\" && internal_iconType === \"leading\") {\n return null;\n }\n\n return (\n <TelegraphIcon\n icon={icon}\n data-button-icon\n data-button-icon-color={iconProps.color}\n {...a11yProps}\n {...iconProps}\n {...props}\n />\n );\n};\n\ntype TextProps<T extends TgphElement> = RemappedOmit<\n TgphComponentProps<typeof TelegraphText<T>>,\n \"as\"\n> & {\n as?: T;\n};\n\nconst Text = <T extends TgphElement>({\n as,\n color,\n size,\n weight = \"medium\",\n style,\n ...props\n}: TextProps<T>) => {\n const context = React.useContext(ButtonContext);\n const derivedColor =\n color ??\n TEXT_COLOR_MAP[context.variant][\n context.state === \"disabled\" ? \"disabled\" : context.color\n ];\n return (\n <TelegraphText\n as={(as \|\| \"span\") as T}\n color={derivedColor}\n size={size ?? TEXT_SIZE_MAP[context.size]}\n weight={weight}\n internal_optionalAs={true}\n data-button-text\n data-button-text-color={derivedColor}\n style={{\n textDecoration: \"none\",\n whiteSpace: \"nowrap\",\n ...style,\n }}\n {...props}\n />\n );\n};\n\ntype DefaultIconProps = React.ComponentProps<typeof Icon>;\n\ntype BaseDefaultProps =\n \| {\n leadingIcon?: DefaultIconProps;\n trailingIcon?: DefaultIconProps;\n icon?: never;\n }\n \| {\n icon?: DefaultIconProps;\n leadingIcon?: never;\n trailingIcon?: never;\n };\ntype DefaultProps<T extends TgphElement> = PolymorphicProps<T> &\n TgphComponentProps<typeof Root> &\n BaseDefaultProps;\n\nconst Default = <T extends TgphElement>({\n leadingIcon,\n trailingIcon,\n icon,\n children,\n ...props\n}: DefaultProps<T>) => {\n const combinedLeadingIcon = leadingIcon \|\| icon;\n return (\n <Root {...props}>\n {combinedLeadingIcon && (\n <Icon {...combinedLeadingIcon} internal_iconType=\"leading\" />\n )}\n {children && <Text>{children}</Text>}\n {trailingIcon && <Icon {...trailingIcon} internal_iconType=\"trailing\" />}\n </Root>\n );\n};\n\nObject.assign(Default, {\n Root,\n Icon,\n Text,\n});\n\nconst Button = Default as typeof Default & {\n Root: typeof Root;\n Icon: typeof Icon;\n Text: typeof Text;\n};\n\nexport { Button };\n"],"names":["cssVars","BUTTON_COLOR_MAP","BUTTON_SIZE_MAP","TEXT_SIZE_MAP","TEXT_COLOR_MAP","ICON_SIZE_MAP","ICON_COLOR_MAP","ICON_VARIANT_MAP","ButtonContext","React","deriveState","params","Root","as","variant","size","color","stateProp","active","type","disabled","className","children","style","props","derivedState","state","useDeterminateState","styleProp","otherProps","useStyleEngine","derivedAs","layout","childrenArray","child","_a","jsx","jsxs","Stack","clsx","Spinner","Icon","icon","alt","ariaHidden","internal_iconType","context","iconProps","a11yProps","TelegraphIcon","Text","weight","derivedColor","TelegraphText","Default","leadingIcon","trailingIcon","combinedLeadingIcon","Button"],"mappings":";;;;;;;;AAcO,MAAMA,IAAoD;AAAA,EAC/D,2BAA2B;AAAA,IACzB,QAAQ;AAAA,IACR,OAAO;AAAA,EAAA;AAAA,EAET,yBAAyB;AAAA,IACvB,QAAQ;AAAA,IACR,OAAO;AAAA,EAAA;AAAA,EAET,yBAAyB;AAAA,IACvB,QAAQ;AAAA,IACR,OAAO;AAAA,EAAA;AAAA,EAET,0BAA0B;AAAA,IACxB,QAAQ;AAAA,IACR,OAAO;AAAA,EAAA;AAAA,EAET,iBAAiB;AAAA,IACf,QAAQ;AAAA,IACR,OAAO;AAAA,EAAA;AAEX,GAEaC,IAAmB;AAAA,EAC9B,OAAO;AAAA,IACL,SAAS;AAAA,MACP,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,QAAQ;AAAA,MACN,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,KAAK;AAAA,MACH,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,MAAM;AAAA,MACJ,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,OAAO;AAAA,MACL,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,MAAM;AAAA,MACJ,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,QAAQ;AAAA,MACN,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,QAAQ;AAAA,MACN,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,EACnB;AAAA,EAEF,MAAM;AAAA,IACJ,SAAS;AAAA,MACP,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,MAAM;AAAA,MACJ,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,KAAK;AAAA,MACH,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,QAAQ;AAAA,MACN,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,OAAO;AAAA,MACL,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,MAAM;AAAA,MACJ,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,QAAQ;AAAA,MACN,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,QAAQ;AAAA,MACN,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,EACnB;AAAA,EAEF,SAAS;AAAA,IACP,SAAS;AAAA,MACP,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,2BAA2B;AAAA,MAC3B,yBAAyB;AAAA,MACzB,yBAAyB;AAAA,MACzB,0BAA0B;AAAA,MAC1B,iBAAiB;AAAA,IAAA;AAAA,IAEnB,MAAM;AAAA,MACJ,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,2BAA2B;AAAA,MAC3B,yBAAyB;AAAA,MACzB,yBAAyB;AAAA,MACzB,0BAA0B;AAAA,MAC1B,iBAAiB;AAAA,IAAA;AAAA,IAEnB,KAAK;AAAA,MACH,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,2BAA2B;AAAA,MAC3B,yBAAyB;AAAA,MACzB,yBAAyB;AAAA,MACzB,0BAA0B;AAAA,MAC1B,iBAAiB;AAAA,IAAA;AAAA,IAEnB,QAAQ;AAAA,MACN,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,2BAA2B;AAAA,MAC3B,yBAAyB;AAAA,MACzB,yBAAyB;AAAA,MACzB,0BAA0B;AAAA,MAC1B,iBAAiB;AAAA,IAAA;AAAA,IAEnB,OAAO;AAAA,MACL,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,2BAA2B;AAAA,MAC3B,yBAAyB;AAAA,MACzB,yBAAyB;AAAA,MACzB,0BAA0B;AAAA,MAC1B,iBAAiB;AAAA,IAAA;AAAA,IAEnB,MAAM;AAAA,MACJ,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,2BAA2B;AAAA,MAC3B,yBAAyB;AAAA,MACzB,yBAAyB;AAAA,MACzB,0BAA0B;AAAA,MAC1B,iBAAiB;AAAA,IAAA;AAAA,IAEnB,QAAQ;AAAA,MACN,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,2BAA2B;AAAA,MAC3B,yBAAyB;AAAA,MACzB,yBAAyB;AAAA,MACzB,0BAA0B;AAAA,MAC1B,iBAAiB;AAAA,IAAA;AAAA,IAEnB,QAAQ;AAAA,MACN,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,2BAA2B;AAAA,MAC3B,yBAAyB;AAAA,MACzB,yBAAyB;AAAA,MACzB,0BAA0B;AAAA,MAC1B,iBAAiB;AAAA,IAAA;AAAA,EACnB;AAAA,EAEF,OAAO;AAAA,IACL,SAAS;AAAA,MACP,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,MAAM;AAAA,MACJ,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,KAAK;AAAA,MACH,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,QAAQ;AAAA,MACN,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,OAAO;AAAA,MACL,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,MAAM;AAAA,MACJ,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,QAAQ;AAAA,MACN,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,IAEnB,QAAQ;AAAA,MACN,iBAAiB;AAAA,MACjB,uBAAuB;AAAA,MACvB,uBAAuB;AAAA,MACvB,wBAAwB;AAAA,MACxB,iBAAiB;AAAA,IAAA;AAAA,EACnB;AAEJ,GAEaC,IAAkB;AAAA,EAC7B,SAAS;AAAA,IACP,GAAK;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,KAAK;AAAA,MACL,IAAI;AAAA,MACJ,SAAS;AAAA,IAAA;AAAA,IAEX,GAAK;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,KAAK;AAAA,MACL,IAAI;AAAA,MACJ,SAAS;AAAA,IAAA;AAAA,IAEX,GAAK;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,KAAK;AAAA,MACL,IAAI;AAAA,MACJ,SAAS;AAAA,IAAA;AAAA,IAEX,GAAK;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,KAAK;AAAA,MACL,IAAI;AAAA,MACJ,SAAS;AAAA,IAAA;AAAA,EACX;AAAA,EAEF,aAAa;AAAA,IACX,GAAK;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,KAAK;AAAA,MACL,IAAI;AAAA,MACJ,SAAS;AAAA,IAAA;AAAA,IAEX,GAAK;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,KAAK;AAAA,MACL,IAAI;AAAA,MACJ,SAAS;AAAA,IAAA;AAAA,IAEX,GAAK;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,KAAK;AAAA,MACL,IAAI;AAAA,MACJ,SAAS;AAAA,IAAA;AAAA,IAEX,GAAK;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACH,KAAK;AAAA,MACL,IAAI;AAAA,MACJ,SAAS;AAAA,IAAA;AAAA,EACX;AAEJ,GAEaC,IAAgB;AAAA,EAC3B,GAAK;AAAA,EACL,GAAK;AAAA,EACL,GAAK;AAAA,EACL,GAAK;AACP,GAEaC,IAAiB;AAAA,EAC5B,OAAO;AAAA,IACL,SAAS;AAAA,IACT,MAAM;AAAA,IACN,KAAK;AAAA,IACL,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,UAAU;AAAA,EAAA;AAAA,EAEZ,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,MAAM;AAAA,IACN,KAAK;AAAA,IACL,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,UAAU;AAAA,EAAA;AAAA,EAEZ,SAAS;AAAA,IACP,SAAS;AAAA,IACT,MAAM;AAAA,IACN,KAAK;AAAA,IACL,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,UAAU;AAAA,EAAA;AAAA,EAEZ,OAAO;AAAA,IACL,SAAS;AAAA,IACT,MAAM;AAAA,IACN,KAAK;AAAA,IACL,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,UAAU;AAAA,EAAA;AAEd,GAEaC,IAAgB;AAAA,EAC3B,GAAK;AAAA,EACL,GAAK;AAAA,EACL,GAAK;AAAA,EACL,GAAK;AACP,GAEaC,IAAiB;AAAA,EAC5B,OAAO;AAAA,IACL,SAAS;AAAA,IACT,MAAM;AAAA,IACN,KAAK;AAAA,IACL,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,UAAU;AAAA,EAAA;AAAA,EAEZ,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,KAAK;AAAA,IACL,OAAO;AAAA,IACP,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,UAAU;AAAA,EAAA;AAAA,EAEZ,SAAS;AAAA,IACP,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,KAAK;AAAA,IACL,OAAO;AAAA,IACP,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,UAAU;AAAA,EAAA;AAAA,EAEZ,OAAO;AAAA,IACL,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,KAAK;AAAA,IACL,OAAO;AAAA,IACP,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,UAAU;AAAA,EAAA;AAEd,GAEaC,IAAmB;AAAA,EAC9B,SAAS;AAAA,EACT,aAAa;AACf,GC3ZMC,IAAgBC,EAAM,cAE1B;AAAA,EACA,SAAS;AAAA,EACT,MAAM;AAAA,EACN,OAAO;AAAA,EACP,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,QAAQ;AACV,CAAC,GASKC,IAAc,CAACC,MACfA,EAAO,WAAiB,aACxBA,EAAO,UAAU,YAAkB,YACnCA,EAAO,SAAe,WACnBA,EAAO,OAGVC,IAAO,CAAwB;AAAA,EACnC,IAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,MAAAC,IAAO;AAAA,EACP,OAAAC,IAAQ;AAAA,EACR,OAAOC,IAAY;AAAA,EACnB,QAAAC,IAAS;AAAA,EACT,MAAAC,IAAO;AAAA,EACP,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,GAAGC;AACL,MAAoB;AAClB,QAAMC,IAAef,EAAY,EAAE,OAAOO,GAAW,UAAAG,GAAU,QAAAF,GAAQ,GACjEQ,IAAQC,EAA8C;AAAA,IAC1D,OAAOF;AAAA,IACP,kBAAkB;AAAA,IAClB,eAAe;AAAA,EAAA,CAChB,GAEK,EAAE,WAAAG,GAAW,YAAAC,EAAA,IAAeC,EAAe;AAAA,IAC/C,OAAO;AAAA,MACL,GAAG7B,EAAiBa,CAAO,EAAEE,CAAK;AAAA,MAClC,OAAAO;AAAA,IAAA;AAAA,IAEF,SAAAvB;AAAA,EAAA,CACD,GAOK+B,IAAYX,KAAY,CAACP,IAAK,WAAWA,GAEzCmB,IAASvB,EAAM,QAAiC,MAAM;;AAC1D,UAAMwB,IAAgBxB,EAAM,SAAS,QAAQa,CAAQ;AACrD,SAAIW,KAAA,gBAAAA,EAAe,YAAW,KAAKxB,EAAM,eAAewB,EAAc,CAAC,CAAC,GAAG;AACzE,YAAMC,IAAQD,EAAc,CAAC;AAO7B,WAAIE,IAAAD,KAAA,gBAAAA,EAAO,UAAP,QAAAC,EAAc;AAChB,eAAO;AAAA,IAEX;AACA,WAAO;AAAA,EACT,GAAG,CAACb,CAAQ,CAAC;AAEb,SACE,gBAAAc;AAAA,IAAC5B,EAAc;AAAA,IAAd;AAAA,MACC,OAAO,EAAE,SAAAM,GAAS,MAAAC,GAAM,OAAAC,GAAO,OAAAU,GAAO,QAAAM,GAAQ,QAAAd,EAAA;AAAA,MAE9C,UAAA,gBAAAmB;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,IAAIP;AAAA,UACJ,WAAWQ,EAAK,eAAelB,CAAS;AAAA,UACxC,SAAQ;AAAA,UACR,OAAM;AAAA,UACN,SAAQ;AAAA,UACP,GAAGnB,EAAgB8B,CAAM,EAAEjB,CAAI;AAAA,UAChC,OAAOa;AAAA,UACP,oBAAgB;AAAA,UAChB,2BAAyBI;AAAA,UACzB,0BAAwBN;AAAA,UACxB,4BAA0BZ;AAAA,UAC1B,0BAAwBE;AAAA,UACxB,UAAUU,MAAU,cAAcA,MAAU;AAAA,UAC3C,GAAIK,MAAc,YAAY,EAAE,MAAAZ,EAAA;AAAA,UAChC,GAAGU;AAAA,UACH,GAAGL;AAAA,UAEH,UAAA;AAAA,YAAAE,MAAU,aACT,gBAAAU;AAAA,cAACI;AAAA,cAAA;AAAA,gBACC,MAAMnC,EAAcU,CAAI;AAAA,gBACxB,OAAOT,EAAeQ,CAAO,EAAEE,CAAK;AAAA,gBACpC,SAAST,EAAiByB,CAAM;AAAA,gBAChC,iCAA6B;AAAA,cAAA;AAAA,YAAA;AAAA,YAGhCV;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGN,GAQMmB,IAAO,CAAwB;AAAA,EACnC,MAAA1B;AAAA,EACA,OAAAC;AAAA,EACA,SAAAF;AAAA,EACA,MAAA4B;AAAA,EACA,KAAAC;AAAA,EACA,eAAeC;AAAA,EACf,mBAAAC;AAAA,EACA,GAAGrB;AACL,MAAoB;AAClB,QAAMsB,IAAUrC,EAAM,WAAWD,CAAa,GAExCuC,IAAY;AAAA,IAChB,MAAMhC,KAAQV,EAAcyC,EAAQ,IAAI;AAAA,IACxC,OACE9B,KACAV,EAAewC,EAAQ,OAAO,EAC5BA,EAAQ,UAAU,aAAa,aAAaA,EAAQ,KACtD;AAAA,IACF,SAAShC,KAAWP,EAAiBuC,EAAQ,MAAM;AAAA,EAAA,GAG/CE,IAAaL,IAAsC,EAAE,KAAAA,EAAA,IAAlC,EAAE,eAAeC,EAAA;AAO1C,SAAIE,EAAQ,UAAU,aAAaD,MAAsB,YAChD,OAIP,gBAAAT;AAAA,IAACa;AAAAA,IAAA;AAAA,MACC,MAAAP;AAAA,MACA,oBAAgB;AAAA,MAChB,0BAAwBK,EAAU;AAAA,MACjC,GAAGC;AAAA,MACH,GAAGD;AAAA,MACH,GAAGvB;AAAA,IAAA;AAAA,EAAA;AAGV,GASM0B,IAAO,CAAwB;AAAA,EACnC,IAAArC;AAAA,EACA,OAAAG;AAAA,EACA,MAAAD;AAAA,EACA,QAAAoC,IAAS;AAAA,EACT,OAAA5B;AAAA,EACA,GAAGC;AACL,MAAoB;AAClB,QAAMsB,IAAUrC,EAAM,WAAWD,CAAa,GACxC4C,IACJpC,KACAZ,EAAe0C,EAAQ,OAAO,EAC5BA,EAAQ,UAAU,aAAa,aAAaA,EAAQ,KACtD;AACF,SACE,gBAAAV;AAAA,IAACiB;AAAAA,IAAA;AAAA,MACC,IAAKxC,KAAM;AAAA,MACX,OAAOuC;AAAA,MACP,MAAMrC,KAAQZ,EAAc2C,EAAQ,IAAI;AAAA,MACxC,QAAAK;AAAA,MACA,qBAAqB;AAAA,MACrB,oBAAgB;AAAA,MAChB,0BAAwBC;AAAA,MACxB,OAAO;AAAA,QACL,gBAAgB;AAAA,QAChB,YAAY;AAAA,QACZ,GAAG7B;AAAA,MAAA;AAAA,MAEJ,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV,GAmBM8B,IAAU,CAAwB;AAAA,EACtC,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,MAAAd;AAAA,EACA,UAAApB;AAAA,EACA,GAAGE;AACL,MAAuB;AACrB,QAAMiC,IAAsBF,KAAeb;AAC3C,SACE,gBAAAL,EAACzB,GAAA,EAAM,GAAGY,GACP,UAAA;AAAA,IAAAiC,KACC,gBAAArB,EAACK,GAAA,EAAM,GAAGgB,GAAqB,mBAAkB,WAAU;AAAA,IAE5DnC,KAAY,gBAAAc,EAACc,GAAA,EAAM,UAAA5B,EAAA,CAAS;AAAA,IAC5BkC,KAAgB,gBAAApB,EAACK,GAAA,EAAM,GAAGe,GAAc,mBAAkB,WAAA,CAAW;AAAA,EAAA,GACxE;AAEJ;AAEA,OAAO,OAAOF,GAAS;AAAA,EACrB,MAAA1C;AAAA,EACA,MAAA6B;AAAA,EACA,MAAAS;AACF,CAAC;AAED,MAAMQ,IAASJ;"}

package/dist/types/Button/Button.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,gBAAgB,EACrB,KAAK,2BAA2B,EAChC,YAAY,EAEZ,KAAK,kBAAkB,EACvB,KAAK,WAAW,EAEjB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,~~EAAE~~,IAAI,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;~~AACxD~~,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE1C,OAAO,EAAE,IAAI,IAAI,aAAa,EAAE,MAAM,uBAAuB,CAAC;~~AAG9D~~,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAGL,KAAK,WAAW,EAChB,KAAK,UAAU,EACf,KAAK,aAAa,EAOnB,MAAM,oBAAoB,CAAC;AAE5B,KAAK,aAAa,GAAG;IACnB,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAC9B,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC;AAQF,KAAK,SAAS,CAAC,CAAC,SAAS,WAAW,IAAI,IAAI,CAC1C,kBAAkB,CAAC,OAAO,KAAK,CAAC,EAChC,SAAS,CACV,GACC,2BAA2B,CAAC,CAAC,EAAE,iBAAiB,CAAC,GACjD,aAAa,CAAC;AA2BhB,QAAA,MAAM,IAAI,GAAI,CAAC,SAAS,WAAW,EAAE,8GAalC,SAAS,CAAC,CAAC,CAAC,~~4CAyEd~~,CAAC;AAEF,KAAK,SAAS,CAAC,CAAC,SAAS,WAAW,IAAI,kBAAkB,CACxD,OAAO,aAAa,CAAC,CAAC,CAAC,CACxB,GAAG;IACF,iBAAiB,CAAC,EAAE,SAAS,GAAG,UAAU,CAAC;CAC5C,CAAC;AAEF,QAAA,MAAM,IAAI,GAAI,CAAC,SAAS,WAAW,EAAE,6FASlC,SAAS,CAAC,CAAC,CAAC,mDAkCd,CAAC;AAEF,KAAK,SAAS,CAAC,CAAC,SAAS,WAAW,IAAI,YAAY,CAClD,kBAAkB,CAAC,OAAO,aAAa,CAAC,CAAC,CAAC,CAAC,EAC3C,IAAI,CACL,GAAG;IACF,EAAE,CAAC,EAAE,CAAC,CAAC;CACR,CAAC;AAEF,QAAA,MAAM,IAAI,GAAI,CAAC,SAAS,WAAW,EAAE,8CAOlC,SAAS,CAAC,CAAC,CAAC,4CAwBd,CAAC;AAEF,KAAK,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,CAAC;AAE1D,KAAK,gBAAgB,GACjB;IACE,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,YAAY,CAAC,EAAE,gBAAgB,CAAC;IAChC,IAAI,CAAC,EAAE,KAAK,CAAC;CACd,GACD;IACE,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB,YAAY,CAAC,EAAE,KAAK,CAAC;CACtB,CAAC;AACN,KAAK,YAAY,CAAC,CAAC,SAAS,WAAW,IAAI,gBAAgB,CAAC,CAAC,CAAC,GAC5D,kBAAkB,CAAC,OAAO,IAAI,CAAC,GAC/B,gBAAgB,CAAC;AAEnB,QAAA,MAAM,OAAO,GAAI,CAAC,SAAS,WAAW,EAAE,yDAMrC,YAAY,CAAC,CAAC,CAAC,4CAWjB,CAAC;AAQF,QAAA,MAAM,MAAM,EAAc,OAAO,OAAO,GAAG;IACzC,IAAI,EAAE,OAAO,IAAI,CAAC;IAClB,IAAI,EAAE,OAAO,IAAI,CAAC;IAClB,IAAI,EAAE,OAAO,IAAI,CAAC;CACnB,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC"}
1	+ {"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,gBAAgB,EACrB,KAAK,2BAA2B,EAChC,YAAY,EAEZ,KAAK,kBAAkB,EACvB,KAAK,WAAW,EAEjB,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAW,IAAI,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AACjE,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE1C,OAAO,EAAE,IAAI,IAAI,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAE9D,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAGL,KAAK,WAAW,EAChB,KAAK,UAAU,EACf,KAAK,aAAa,EAOnB,MAAM,oBAAoB,CAAC;AAE5B,KAAK,aAAa,GAAG;IACnB,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;IAC9B,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC;AAQF,KAAK,SAAS,CAAC,CAAC,SAAS,WAAW,IAAI,IAAI,CAC1C,kBAAkB,CAAC,OAAO,KAAK,CAAC,EAChC,SAAS,CACV,GACC,2BAA2B,CAAC,CAAC,EAAE,iBAAiB,CAAC,GACjD,aAAa,CAAC;AA2BhB,QAAA,MAAM,IAAI,GAAI,CAAC,SAAS,WAAW,EAAE,8GAalC,SAAS,CAAC,CAAC,CAAC,4CA0Ed,CAAC;AAEF,KAAK,SAAS,CAAC,CAAC,SAAS,WAAW,IAAI,kBAAkB,CACxD,OAAO,aAAa,CAAC,CAAC,CAAC,CACxB,GAAG;IACF,iBAAiB,CAAC,EAAE,SAAS,GAAG,UAAU,CAAC;CAC5C,CAAC;AAEF,QAAA,MAAM,IAAI,GAAI,CAAC,SAAS,WAAW,EAAE,6FASlC,SAAS,CAAC,CAAC,CAAC,mDAkCd,CAAC;AAEF,KAAK,SAAS,CAAC,CAAC,SAAS,WAAW,IAAI,YAAY,CAClD,kBAAkB,CAAC,OAAO,aAAa,CAAC,CAAC,CAAC,CAAC,EAC3C,IAAI,CACL,GAAG;IACF,EAAE,CAAC,EAAE,CAAC,CAAC;CACR,CAAC;AAEF,QAAA,MAAM,IAAI,GAAI,CAAC,SAAS,WAAW,EAAE,8CAOlC,SAAS,CAAC,CAAC,CAAC,4CAwBd,CAAC;AAEF,KAAK,gBAAgB,GAAG,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,CAAC;AAE1D,KAAK,gBAAgB,GACjB;IACE,WAAW,CAAC,EAAE,gBAAgB,CAAC;IAC/B,YAAY,CAAC,EAAE,gBAAgB,CAAC;IAChC,IAAI,CAAC,EAAE,KAAK,CAAC;CACd,GACD;IACE,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB,YAAY,CAAC,EAAE,KAAK,CAAC;CACtB,CAAC;AACN,KAAK,YAAY,CAAC,CAAC,SAAS,WAAW,IAAI,gBAAgB,CAAC,CAAC,CAAC,GAC5D,kBAAkB,CAAC,OAAO,IAAI,CAAC,GAC/B,gBAAgB,CAAC;AAEnB,QAAA,MAAM,OAAO,GAAI,CAAC,SAAS,WAAW,EAAE,yDAMrC,YAAY,CAAC,CAAC,CAAC,4CAWjB,CAAC;AAQF,QAAA,MAAM,MAAM,EAAc,OAAO,OAAO,GAAG;IACzC,IAAI,EAAE,OAAO,IAAI,CAAC;IAClB,IAAI,EAAE,OAAO,IAAI,CAAC;IAClB,IAAI,EAAE,OAAO,IAAI,CAAC;CACnB,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@telegraph/button",
-  "version": "0.2.7",
+  "version": "0.3.0",
   "description": "Button component in Telegraph",
   "repository": "https://github.com/knocklabs/telegraph/tree/main/packages/button",
   "author": "@knocklabs",
@@ -33,7 +33,7 @@
   },
   "dependencies": {
     "@telegraph/helpers": "^0.0.13",
-    "@telegraph/icon": "^0.2.7",
+    "@telegraph/icon": "^0.3.0",
     "@telegraph/layout": "^0.2.3",
     "@telegraph/style-engine": "^0.1.16",
     "@telegraph/typography": "^0.1.25",