@necto-react/components 1.2.12 → 1.2.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1,402 +1,645 @@
1
- import{DOM as so}from"@necto/constants";import{HTMLElements as ao}from"@necto/dom";import{forwardRef as y,isValidElement as co,cloneElement as po,Children as lo}from"react";import{jsx as mo}from"@emotion/react/jsx-runtime";var fo=ao.Div,O=({as:o,asChild:t,children:s,...n},r)=>{let i=o??fo;if(t){let e=lo.only(s);return co(e)?po(e,{...n,ref:e.ref??r}):null}return mo(i,{ref:r,...n,children:s})},g=Object.assign(y(O),so.HTML_TAGS.reduce((o,t)=>{let s=t,n=t[0].toUpperCase()+t.slice(1),r=y((i,e)=>O({...i,as:t},e));return o[s]=r,o[n]=r,o},{}));import{Fragment as uo}from"react";import{jsx as bo}from"react/jsx-runtime";var B=o=>{let{children:t}=o;return bo(uo,{children:typeof t=="function"?t():t})};import{Fragment as go,Children as Bo}from"react";import{jsx as yo}from"react/jsx-runtime";var u=o=>{let{condition:t,keepAlive:s,children:n}=o;if(!n)return null;let r=!!(typeof t=="function"?t():t);return yo(go,{children:Bo.toArray(n).find(i=>i.type!==B!=!r)||null})};import vo from"clsx";import{forwardRef as Co}from"react";import To from"@emotion/styled";import{FaApple as wo}from"react-icons/fa";import{css as Oo}from"@emotion/react";import{HTMLElements as xo}from"@necto/dom";import{forwardRef as Ro,Fragment as Eo}from"react";import{jsx as b,jsxs as ho}from"@emotion/react/jsx-runtime";var _o=xo.Button,l=Ro(function({as:t=_o,asChild:s=!1,children:n,icon:r,showIcon:i=!0,iconPosition:e="left",disabled:a,className:p,...c},no){let io=(t?.toLowerCase?.()??"")==="button"?{disabled:a}:{role:"button",tabIndex:a?-1:0,"aria-disabled":!!a,onKeyDown:m=>{a||(m.key==="Enter"||m.key===" ")&&(c.onClick?.(m),m.preventDefault())}},d=r?b("span",{className:"_necto:BrandIcon",css:Oo`
1
+ import{DOM as Co}from"@necto/constants";import{HTMLElements as ho}from"@necto/dom";import{forwardRef as h,isValidElement as To,cloneElement as wo,Children as Lo}from"react";import{jsx as ko}from"@emotion/react/jsx-runtime";var xo=ho.Div,T=({as:t,asChild:o,children:r,...s},n)=>{let i=t??xo;if(o){let e=Lo.only(r);return To(e)?wo(e,{...s,ref:e.ref??n}):null}return ko(i,{ref:n,...s,children:r})},E=Object.assign(h(T),Co.HTML_TAGS.reduce((t,o)=>{let r=o,s=o[0].toUpperCase()+o.slice(1),n=h((i,e)=>T({...i,as:o},e));return t[r]=n,t[s]=n,t},{}));import{Fragment as $o}from"react";import{jsx as So}from"@emotion/react/jsx-runtime";var y=t=>{let{children:o}=t;return So($o,{children:typeof o=="function"?o():o})};import{Fragment as Ao,Children as Fo}from"react";import{jsx as Mo}from"@emotion/react/jsx-runtime";var O=t=>{let{condition:o,keepAlive:r,children:s}=t;if(!s)return null;let n=!!(typeof o=="function"?o():o);return Mo(Ao,{children:Fo.toArray(s).find(i=>i.type!==y!=!n)||null})};import Do from"clsx";import{forwardRef as Uo}from"react";import Xo from"@emotion/styled";import{FaApple as Ko}from"react-icons/fa";import{css as w}from"@emotion/react";import{HTMLElements as Ho}from"@necto/dom";import{forwardRef as Po,Fragment as Io}from"react";import{jsx as R,jsxs as No}from"@emotion/react/jsx-runtime";var Go=Ho.Button,f=Po(function({as:o=Go,asChild:r=!1,children:s,icon:n,showIcon:i=!0,iconPosition:e="left",disabled:a,className:l,...c},d){let Eo=(o?.toLowerCase?.()??"")==="button"?{disabled:a}:{role:"button",tabIndex:a?-1:0,"aria-disabled":!!a,onKeyDown:u=>{a||(u.key==="Enter"||u.key===" ")&&(c.onClick?.(u),u.preventDefault())}},B=n?R("span",{className:"_necto:BrandIcon",css:w`
2
2
  flex-shrink: 0;
3
3
  line-height: 0;
4
4
  display: inline-flex;
5
- `,children:r}):null;return b(g,{as:t,ref:no,asChild:s,className:p,...io,...c,children:ho(Eo,{children:[b(u,{condition:!!d&&i&&e==="left",children:d}),n,b(u,{condition:!!d&&i&&e==="right",children:d})]})})});import{jsx as R}from"@emotion/react/jsx-runtime";var E="AppleButton",x="#000000",Lo="#1a1a1a",Ao="#333333",Po="#ffffff",Go="rgba(0, 0, 0, 0.3)",$o=To(l)`
6
- display: inline-flex;
7
- align-items: center;
8
- justify-content: center;
9
- gap: 10px;
5
+ `,children:n}):null,yo=w`
6
+ display: inline-flex;
7
+ align-items: center;
8
+ justify-content: center;
9
+ gap: 10px;
10
+ min-height: 40px;
11
+ width: 100%;
12
+ border-radius: 8px;
13
+ font-size: 14px;
14
+ line-height: 20px;
15
+ cursor: pointer;
16
+ user-select: none;
17
+ text-decoration: none;
18
+ transition: background-color 0.2s, box-shadow 0.2s, border-color 0.2s, color 0.2s;
19
+
20
+ &:focus-visible {
21
+ outline: none;
22
+ }
23
+
24
+ ${a&&`
25
+ opacity: 0.7;
26
+ cursor: not-allowed;
27
+ pointer-events: none;
28
+ `}
29
+ `;return R(E,{as:o,ref:d,asChild:r,className:l,css:yo,...Eo,...(()=>{let{css:u,...vo}=c;return vo})(),children:No(Io,{children:[R(O,{condition:!!B&&i&&e==="left",children:B}),s,R(O,{condition:!!B&&i&&e==="right",children:B})]})})});import{jsx as x}from"@emotion/react/jsx-runtime";var k="AppleButton",L="#000000",zo="#1a1a1a",Vo="#333333",Wo="#ffffff",Yo="rgba(0, 0, 0, 0.3)",Zo=Xo(f)`
10
30
  padding: 0 18px;
11
- min-height: 40px;
12
- width: 100%;
13
- background-color: var(--necto-apple-bg, ${x});
14
- color: var(--necto-apple-text, ${Po});
31
+ background-color: var(--necto-apple-bg, ${L});
32
+ color: var(--necto-apple-text, ${Wo});
15
33
  border: none;
16
- border-radius: 8px;
17
- font-size: 14px;
18
34
  font-weight: 400;
19
35
  font-family: 'Roboto', system-ui, -apple-system, sans-serif;
20
- line-height: 20px;
21
- cursor: pointer;
22
- user-select: none;
23
- text-decoration: none;
24
- transition: background-color 0.2s, box-shadow 0.2s, border-color 0.2s, color 0.2s;
25
36
 
26
37
  &:hover {
27
- background-color: var(--necto-apple-bg-hover, ${Lo});
38
+ background-color: var(--necto-apple-bg-hover, ${zo});
28
39
  }
29
40
 
30
41
  &:active {
31
- background-color: var(--necto-apple-bg-active, ${Ao});
42
+ background-color: var(--necto-apple-bg-active, ${Vo});
32
43
  }
33
44
 
34
45
  &:focus-visible {
35
- outline: none;
36
- box-shadow: 0 0 0 3px var(--necto-apple-focus-shadow, ${Go});
46
+ box-shadow: 0 0 0 3px var(--necto-apple-focus-shadow, ${Yo});
37
47
  }
38
48
 
39
- ${o=>o.$disabled&&`
40
- opacity: 0.7;
41
- cursor: not-allowed;
42
- pointer-events: none;
43
-
49
+ ${t=>t.$disabled&&`
44
50
  &:hover,
45
51
  &:active {
46
- background-color: var(--necto-apple-bg, ${x});
52
+ background-color: var(--necto-apple-bg, ${L});
47
53
  }
48
54
  `}
49
- `,_=Co(({as:o,asChild:t,children:s="Continue with Apple",iconPosition:n="left",showIcon:r=!0,iconSize:i=20,disabled:e,className:a,...p},c)=>R($o,{as:o,ref:c,asChild:t,icon:R(wo,{size:i}),showIcon:r,disabled:e,$disabled:e,iconPosition:n,className:vo(`_necto:${E}`,a),...p,children:s}));_.displayName=E;import ko from"clsx";import{forwardRef as Fo}from"react";import Ho from"@emotion/styled";import{FaAtlassian as Do}from"react-icons/fa";import{jsx as v}from"@emotion/react/jsx-runtime";var C="AtlassianButton",h="#0052cc",Io="#0747a6",So="#003d99",No="#ffffff",Mo="rgba(0, 82, 204, 0.3)",Uo=Ho(l)`
50
- display: inline-flex;
51
- align-items: center;
52
- justify-content: center;
53
- gap: 10px;
55
+ `,$=Uo(({as:t,asChild:o,children:r="Continue with Apple",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>x(Zo,{as:t,ref:c,asChild:o,icon:x(Ko,{size:i}),showIcon:n,disabled:e,$disabled:e,iconPosition:s,className:Do(`_necto:${k}`,a),...l,children:r}));$.displayName=k;import qo from"clsx";import{forwardRef as Jo}from"react";import Qo from"@emotion/styled";import{FaAtlassian as jo}from"react-icons/fa";import{jsx as A}from"@emotion/react/jsx-runtime";var F="AtlassianButton",S="#0052cc",te="#0747a6",oe="#003d99",ee="#ffffff",re="rgba(0, 82, 204, 0.3)",ne=Qo(f)`
54
56
  padding: 0 18px;
55
- min-height: 40px;
56
- width: 100%;
57
- background-color: var(--necto-atlassian-bg, ${h});
58
- color: var(--necto-atlassian-text, ${No});
57
+ background-color: var(--necto-atlassian-bg, ${S});
58
+ color: var(--necto-atlassian-text, ${ee});
59
59
  border: none;
60
- border-radius: 8px;
61
- font-size: 14px;
62
60
  font-weight: 500;
63
61
  font-family: system-ui, -apple-system, sans-serif;
64
- line-height: 20px;
65
- cursor: pointer;
66
- user-select: none;
67
- text-decoration: none;
68
- transition: background-color 0.2s, box-shadow 0.2s;
69
62
 
70
63
  &:hover {
71
- background-color: var(--necto-atlassian-bg-hover, ${Io});
64
+ background-color: var(--necto-atlassian-bg-hover, ${te});
72
65
  }
73
66
 
74
67
  &:active {
75
- background-color: var(--necto-atlassian-bg-active, ${So});
68
+ background-color: var(--necto-atlassian-bg-active, ${oe});
76
69
  }
77
70
 
78
71
  &:focus-visible {
79
- outline: none;
80
- box-shadow: 0 0 0 3px var(--necto-atlassian-focus-shadow, ${Mo});
72
+ box-shadow: 0 0 0 3px var(--necto-atlassian-focus-shadow, ${re});
81
73
  }
82
74
 
83
- ${o=>o.$disabled&&`
84
- opacity: 0.7;
85
- cursor: not-allowed;
86
- pointer-events: none;
87
-
75
+ ${t=>t.$disabled&&`
88
76
  &:hover,
89
77
  &:active {
90
- background-color: var(--necto-atlassian-bg, ${h});
78
+ background-color: var(--necto-atlassian-bg, ${S});
91
79
  }
92
80
  `}
93
- `,T=Fo(({as:o,asChild:t,children:s="Continue with Atlassian",iconPosition:n="left",showIcon:r=!0,iconSize:i=20,disabled:e,className:a,...p},c)=>v(Uo,{as:o,ref:c,asChild:t,showIcon:r,disabled:e,$disabled:e,iconPosition:n,icon:v(Do,{size:i}),className:ko(`_necto:${C}`,a),...p,children:s}));T.displayName=C;import Vo from"clsx";import{forwardRef as zo}from"react";import Ko from"@emotion/styled";import{jsx as f,jsxs as w}from"react/jsx-runtime";var L=({size:o})=>w("svg",{width:o,height:o,viewBox:"0 0 72 72",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[f("title",{children:"Bitbucket"}),f("path",{d:"M58.8295 28.5831H43.8317L41.332 43.3331H30.9168L18.6685 57.9163C18.6685 57.9163 19.2517 58.4163 20.0849 58.4163H52.7472C53.4971 58.4163 54.1637 57.8331 54.3303 57.083L58.8295 28.5831Z",fill:"url(#paint0_linear_5907_10188)"}),f("path",{d:"M12.5863 13.5C11.5864 13.5 10.8366 14.4167 11.0033 15.3333L17.7524 56.6666C17.8357 57.1667 18.0857 57.6667 18.5023 58C18.5023 58 19.0855 58.5 19.9187 58.5L32.5838 43.3334H30.834L28.0843 28.5834H43.8323H58.8304L60.9967 15.3333C61.1635 14.3333 60.4135 13.5 59.4136 13.5H12.5863Z",fill:"white",style:{fill:"white",fillOpacity:1}}),f("defs",{children:w("linearGradient",{id:"paint0_linear_5907_10188",x1:"60.8078",y1:"35.1603",x2:"37.2868",y2:"51.0791",gradientUnits:"userSpaceOnUse",children:[f("stop",{offset:"0.0718327","stop-color":"white","stop-opacity":"0.4",style:{stopColor:"white",stopOpacity:.4}}),f("stop",{offset:"1","stop-color":"white",style:{stopColor:"white",stopOpacity:1}})]})})]});import{jsx as P}from"@emotion/react/jsx-runtime";var G="BitbucketButton",A="#0052cc",Xo="#0747a6",Wo="#003d99",Zo="#ffffff",qo="rgba(0, 82, 204, 0.3)",Jo=Ko(l)`
94
- display: inline-flex;
95
- align-items: center;
96
- justify-content: center;
97
- gap: 10px;
81
+ `,M=Jo(({as:t,asChild:o,children:r="Continue with Atlassian",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>A(ne,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,iconPosition:s,icon:A(jo,{size:i}),className:qo(`_necto:${F}`,a),...l,children:r}));M.displayName=F;import se from"clsx";import{forwardRef as ie}from"react";import ae from"@emotion/styled";import{jsx as m,jsxs as H}from"@emotion/react/jsx-runtime";var P=({size:t})=>H("svg",{width:t,height:t,viewBox:"0 0 72 72",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[m("title",{children:"Bitbucket"}),m("path",{d:"M58.8295 28.5831H43.8317L41.332 43.3331H30.9168L18.6685 57.9163C18.6685 57.9163 19.2517 58.4163 20.0849 58.4163H52.7472C53.4971 58.4163 54.1637 57.8331 54.3303 57.083L58.8295 28.5831Z",fill:"url(#paint0_linear_5907_10188)"}),m("path",{d:"M12.5863 13.5C11.5864 13.5 10.8366 14.4167 11.0033 15.3333L17.7524 56.6666C17.8357 57.1667 18.0857 57.6667 18.5023 58C18.5023 58 19.0855 58.5 19.9187 58.5L32.5838 43.3334H30.834L28.0843 28.5834H43.8323H58.8304L60.9967 15.3333C61.1635 14.3333 60.4135 13.5 59.4136 13.5H12.5863Z",fill:"white",style:{fill:"white",fillOpacity:1}}),m("defs",{children:H("linearGradient",{id:"paint0_linear_5907_10188",x1:"60.8078",y1:"35.1603",x2:"37.2868",y2:"51.0791",gradientUnits:"userSpaceOnUse",children:[m("stop",{offset:"0.0718327","stop-color":"white","stop-opacity":"0.4",style:{stopColor:"white",stopOpacity:.4}}),m("stop",{offset:"1","stop-color":"white",style:{stopColor:"white",stopOpacity:1}})]})})]});import{jsx as G}from"@emotion/react/jsx-runtime";var N="BitbucketButton",I="#0052cc",ce="#0747a6",le="#003d99",fe="#ffffff",pe="rgba(0, 82, 204, 0.3)",de=ae(f)`
98
82
  padding: 0 18px;
99
- min-height: 40px;
100
- width: 100%;
101
- background-color: var(--necto-bitbucket-bg, ${A});
102
- color: var(--necto-bitbucket-text, ${Zo});
83
+ background-color: var(--necto-bitbucket-bg, ${I});
84
+ color: var(--necto-bitbucket-text, ${fe});
103
85
  border: none;
104
- border-radius: 8px;
105
- font-size: 14px;
106
86
  font-weight: 500;
107
87
  font-family: system-ui, -apple-system, sans-serif;
108
- line-height: 20px;
109
- cursor: pointer;
110
- user-select: none;
111
- text-decoration: none;
112
- transition: background-color 0.2s, box-shadow 0.2s;
113
88
 
114
89
  &:hover {
115
- background-color: var(--necto-bitbucket-bg-hover, ${Xo});
90
+ background-color: var(--necto-bitbucket-bg-hover, ${ce});
116
91
  }
117
92
 
118
93
  &:active {
119
- background-color: var(--necto-bitbucket-bg-active, ${Wo});
94
+ background-color: var(--necto-bitbucket-bg-active, ${le});
120
95
  }
121
96
 
122
97
  &:focus-visible {
123
- outline: none;
124
- box-shadow: 0 0 0 3px var(--necto-bitbucket-focus-shadow, ${qo});
98
+ box-shadow: 0 0 0 3px var(--necto-bitbucket-focus-shadow, ${pe});
99
+ }
100
+
101
+ ${t=>t.$disabled&&`
102
+ &:hover,
103
+ &:active {
104
+ background-color: var(--necto-bitbucket-bg, ${I});
105
+ }
106
+ `}
107
+ `,D=ie(({as:t,asChild:o,children:r="Continue with Bitbucket",iconPosition:s="left",showIcon:n=!0,iconSize:i=22,disabled:e,className:a,...l},c)=>G(de,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,iconPosition:s,icon:G(P,{size:i}),className:se(`_necto:${N}`,a),...l,children:r}));D.displayName=N;import me from"clsx";import{forwardRef as ue}from"react";import be from"@emotion/styled";import{FaDiscord as ge}from"react-icons/fa";import{jsx as X}from"@emotion/react/jsx-runtime";var K="DiscordButton",U="#5865f2",Be="#4752d9",Oe="#3c45c0",Re="#ffffff",_e="rgba(88, 101, 242, 0.3)",Ee=be(f)`
108
+ padding: 0 18px;
109
+ background-color: var(--necto-discord-bg, ${U});
110
+ color: var(--necto-discord-text, ${Re});
111
+ border: none;
112
+ font-weight: 500;
113
+ font-family: 'Roboto', system-ui, -apple-system, sans-serif;
114
+
115
+ &:hover {
116
+ background-color: var(--necto-discord-bg-hover, ${Be});
125
117
  }
126
118
 
127
- ${o=>o.$disabled&&`
128
- opacity: 0.7;
129
- cursor: not-allowed;
130
- pointer-events: none;
119
+ &:active {
120
+ background-color: var(--necto-discord-bg-active, ${Oe});
121
+ }
122
+
123
+ &:focus-visible {
124
+ box-shadow: 0 0 0 3px var(--necto-discord-focus-shadow, ${_e});
125
+ }
131
126
 
127
+ ${t=>t.$disabled&&`
132
128
  &:hover,
133
129
  &:active {
134
- background-color: var(--necto-bitbucket-bg, ${A});
130
+ background-color: var(--necto-discord-bg, ${U});
135
131
  }
136
132
  `}
137
- `,$=zo(({as:o,asChild:t,children:s="Continue with Bitbucket",iconPosition:n="left",showIcon:r=!0,iconSize:i=22,disabled:e,className:a,...p},c)=>P(Jo,{as:o,ref:c,asChild:t,showIcon:r,disabled:e,$disabled:e,iconPosition:n,icon:P(L,{size:i}),className:Vo(`_necto:${G}`,a),...p,children:s}));$.displayName=G;import Qo from"clsx";import{forwardRef as Yo}from"react";import jo from"@emotion/styled";import{FaDiscord as ot}from"react-icons/fa";import{jsx as F}from"@emotion/react/jsx-runtime";var H="DiscordButton",k="#5865f2",tt="#4752d9",et="#3c45c0",rt="#ffffff",nt="rgba(88, 101, 242, 0.3)",it=jo(l)`
138
- display: inline-flex;
139
- align-items: center;
140
- justify-content: center;
141
- gap: 10px;
133
+ `,z=ue(({as:t,asChild:o,children:r="Continue with Discord",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>X(Ee,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,iconPosition:s,icon:X(ge,{size:i}),className:me(`_necto:${K}`,a),...l,children:r}));z.displayName=K;import ye from"clsx";import{forwardRef as ve}from"react";import Ce from"@emotion/styled";import{FaDropbox as he}from"react-icons/fa";import{jsx as W}from"@emotion/react/jsx-runtime";var Y="DropboxButton",V="#0061ff",Te="#0056e0",we="#004bc5",Le="#ffffff",xe="rgba(0, 97, 255, 0.3)",ke=Ce(f)`
142
134
  padding: 0 18px;
143
- min-height: 40px;
144
- width: 100%;
145
- background-color: var(--necto-discord-bg, ${k});
146
- color: var(--necto-discord-text, ${rt});
135
+ background-color: var(--necto-dropbox-bg, ${V});
136
+ color: var(--necto-dropbox-text, ${Le});
147
137
  border: none;
148
- border-radius: 8px;
149
- font-size: 14px;
150
138
  font-weight: 500;
151
139
  font-family: 'Roboto', system-ui, -apple-system, sans-serif;
152
- line-height: 20px;
153
- cursor: pointer;
154
- user-select: none;
155
- text-decoration: none;
156
- transition: background-color 0.2s, box-shadow 0.2s, border-color 0.2s, color 0.2s;
157
140
 
158
141
  &:hover {
159
- background-color: var(--necto-discord-bg-hover, ${tt});
142
+ background-color: var(--necto-dropbox-bg-hover, ${Te});
160
143
  }
161
144
 
162
145
  &:active {
163
- background-color: var(--necto-discord-bg-active, ${et});
146
+ background-color: var(--necto-dropbox-bg-active, ${we});
164
147
  }
165
148
 
166
149
  &:focus-visible {
167
- outline: none;
168
- box-shadow: 0 0 0 3px var(--necto-discord-focus-shadow, ${nt});
150
+ box-shadow: 0 0 0 3px var(--necto-dropbox-focus-shadow, ${xe});
169
151
  }
170
152
 
171
- ${o=>o.$disabled&&`
172
- opacity: 0.7;
173
- cursor: not-allowed;
174
- pointer-events: none;
153
+ ${t=>t.$disabled&&`
154
+ &:hover,
155
+ &:active {
156
+ background-color: var(--necto-dropbox-bg, ${V});
157
+ }
158
+ `}
159
+ `,Z=ve(({as:t,asChild:o,children:r="Continue with Dropbox",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>W(ke,{as:t,ref:c,asChild:o,icon:W(he,{size:i}),showIcon:n,disabled:e,$disabled:e,iconPosition:s,className:ye(`_necto:${Y}`,a),...l,children:r}));Z.displayName=Y;import $e from"clsx";import{forwardRef as Se}from"react";import Ae from"@emotion/styled";import{FaFacebook as Fe}from"react-icons/fa6";import{jsx as J}from"@emotion/react/jsx-runtime";var Q="FacebookButton",q="#1877f2",Me="#166fe5",He="#1467d6",Pe="#ffffff",Ie="#1877f2",Ge="rgba(24, 119, 242, 0.3)",Ne=Ae(f)`
160
+ padding: 0 18px;
161
+ background-color: var(--necto-facebook-bg, ${q});
162
+ color: var(--necto-facebook-text, ${Pe});
163
+ border: 1px solid var(--necto-facebook-border, ${Ie});
164
+ font-weight: 500;
165
+ font-family: system-ui, -apple-system, sans-serif;
166
+
167
+ &:hover {
168
+ background-color: var(--necto-facebook-bg-hover, ${Me});
169
+ }
175
170
 
171
+ &:active {
172
+ background-color: var(--necto-facebook-bg-active, ${He});
173
+ }
174
+
175
+ &:focus-visible {
176
+ box-shadow: 0 0 0 3px var(--necto-facebook-focus-shadow, ${Ge});
177
+ }
178
+
179
+ ${t=>t.$disabled&&`
176
180
  &:hover,
177
181
  &:active {
178
- background-color: var(--necto-discord-bg, ${k});
182
+ background-color: var(--necto-facebook-bg, ${q});
179
183
  }
180
184
  `}
181
- `,D=Yo(({as:o,asChild:t,children:s="Continue with Discord",iconPosition:n="left",showIcon:r=!0,iconSize:i=20,disabled:e,className:a,...p},c)=>F(it,{as:o,ref:c,asChild:t,showIcon:r,disabled:e,$disabled:e,iconPosition:n,icon:F(ot,{size:i}),className:Qo(`_necto:${H}`,a),...p,children:s}));D.displayName=H;import st from"clsx";import{forwardRef as at}from"react";import ct from"@emotion/styled";import{FaDropbox as pt}from"react-icons/fa";import{jsx as S}from"@emotion/react/jsx-runtime";var N="DropboxButton",I="#0061ff",lt="#0056e0",ft="#004bc5",dt="#ffffff",mt="rgba(0, 97, 255, 0.3)",ut=ct(l)`
182
- display: inline-flex;
183
- align-items: center;
184
- justify-content: center;
185
- gap: 10px;
185
+ `,j=Se(({as:t,asChild:o,children:r="Continue with Facebook",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>J(Ne,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,iconPosition:s,icon:J(Fe,{size:i}),className:$e(`_necto:${Q}`,a),...l,children:r}));j.displayName=Q;import De from"clsx";import{forwardRef as Ue}from"react";import Xe from"@emotion/styled";import{FaGithub as Ke}from"react-icons/fa";import{jsx as ot}from"@emotion/react/jsx-runtime";var et="GitHubButton",tt="#24292f",ze="#2c3237",Ve="#373e47",We="#ffffff",Ye="#24292f",Ze="rgba(36, 41, 47, 0.3)",qe=Xe(f)`
186
186
  padding: 0 18px;
187
- min-height: 40px;
188
- width: 100%;
189
- background-color: var(--necto-dropbox-bg, ${I});
190
- color: var(--necto-dropbox-text, ${dt});
187
+ background-color: var(--necto-github-bg, ${tt});
188
+ color: var(--necto-github-text, ${We});
189
+ border: 1px solid var(--necto-github-border, ${Ye});
190
+ font-weight: 500;
191
+ font-family: system-ui, -apple-system, sans-serif;
192
+
193
+ &:hover {
194
+ background-color: var(--necto-github-bg-hover, ${ze});
195
+ }
196
+
197
+ &:active {
198
+ background-color: var(--necto-github-bg-active, ${Ve});
199
+ }
200
+
201
+ &:focus-visible {
202
+ box-shadow: 0 0 0 3px var(--necto-github-focus-shadow, ${Ze});
203
+ }
204
+
205
+ ${t=>t.$disabled&&`
206
+ &:hover,
207
+ &:active {
208
+ background-color: var(--necto-github-bg, ${tt});
209
+ }
210
+ `}
211
+ `,rt=Ue(({as:t,asChild:o,children:r="Continue with GitHub",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>ot(qe,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,iconPosition:s,icon:ot(Ke,{size:i}),className:De(`_necto:${et}`,a),...l,children:r}));rt.displayName=et;import Qe from"clsx";import{forwardRef as je}from"react";import tr from"@emotion/styled";import{jsx as b,jsxs as Je}from"@emotion/react/jsx-runtime";var nt=({size:t,color:o})=>{let r=o==null;return Je("svg",{width:t,height:t,viewBox:"0 0 32 32",xmlns:"http://www.w3.org/2000/svg",children:[b("title",{children:"GitLab Icon"}),b("path",{fill:r?"#E24329":o??void 0,d:"M29.5 13.2v-.1l-3.8-9.9c-.1-.2-.2-.4-.4-.5c-.4-.2-.8-.2-1.2.1c-.1.1-.3.2-.3.4l-2.6 7.9H10.8L8.2 3.2c0-.2-.2-.3-.3-.5c-.4-.2-.8-.3-1.2 0c-.2.1-.3.2-.4.4L2.5 13v.1c-1.1 2.9-.2 6.3 2.3 8.2l5.8 4.3l2.9 2.2l1.7 1.3c.4.3 1 .3 1.4 0l1.7-1.3l2.9-2.2l5.8-4.4c2.7-1.7 3.7-5.1 2.5-8"}),b("path",{fill:r?"#FC6D26":o??void 0,d:"M29.5 13.2v-.1c-1.9.4-3.6 1.2-5.1 2.3L16 21.7c2.9 2.2 5.3 4 5.3 4l5.8-4.4c2.6-1.8 3.6-5.2 2.4-8.1"}),b("path",{fill:r?"#FCA326":o??void 0,d:"m10.7 25.8l2.9 2.2l1.7 1.3c.4.3 1 .3 1.4 0l1.7-1.3l2.9-2.2s-2.5-1.9-5.3-4c-2.9 2.1-5.3 4-5.3 4"}),b("path",{fill:r?"#FC6D26":o??void 0,d:"M7.6 15.4c-1.5-1.1-3.3-1.9-5.1-2.3v.1c-1.1 2.9-.2 6.3 2.3 8.2l5.8 4.3s2.5-1.9 5.3-4z"})]})};import{jsx as it}from"@emotion/react/jsx-runtime";var at="GitLabButton",st="#fc6d26",or="#e24329",er="#c73b1c",rr="#ffffff",nr="rgba(252, 109, 38, 0.3)",sr=tr(f)`
212
+ padding: 0 18px;
213
+ background-color: var(--necto-gitlab-bg, ${st});
214
+ color: var(--necto-gitlab-text, ${rr});
215
+ border: none;
216
+ font-weight: 500;
217
+ font-family: system-ui, -apple-system, sans-serif;
218
+
219
+ &:hover {
220
+ background-color: var(--necto-gitlab-bg-hover, ${or});
221
+ }
222
+
223
+ &:active {
224
+ background-color: var(--necto-gitlab-bg-active, ${er});
225
+ }
226
+
227
+ &:focus-visible {
228
+ box-shadow: 0 0 0 3px var(--necto-gitlab-focus-shadow, ${nr});
229
+ }
230
+
231
+ ${t=>t.$disabled&&`
232
+ &:hover,
233
+ &:active {
234
+ background-color: var(--necto-gitlab-bg, ${st});
235
+ }
236
+ `}
237
+ `,ct=je(({as:t,asChild:o,iconColor:r="#fff",children:s="Continue with GitLab",iconPosition:n="left",showIcon:i=!0,iconSize:e=20,disabled:a,className:l,...c},d)=>it(sr,{as:t,ref:d,asChild:o,showIcon:i,disabled:a,$disabled:a,iconPosition:n,icon:it(nt,{size:e,color:r}),className:Qe(`_necto:${at}`,l),...c,children:s}));ct.displayName=at;import ir from"clsx";import{forwardRef as ar}from"react";import cr from"@emotion/styled";import{FcGoogle as lr}from"react-icons/fc";import{jsx as ft}from"@emotion/react/jsx-runtime";var pt="GoogleButton",lt="#ffffff",fr="#f8f9fa",pr="#eceff1",dr="#1f1f1f",mr="#747775",ur="rgba(66, 133, 244, 0.3)",br=cr(f)`
238
+ padding: 0 12px 0 12px;
239
+ height: 40px;
240
+ background-color: var(--necto-google-bg, ${lt});
241
+ color: var(--necto-google-text, ${dr});
242
+ border: 1px solid var(--necto-google-border, ${mr});
243
+ font-weight: 500;
244
+ font-family: 'Roboto Medium', system-ui, -apple-system, sans-serif;
245
+
246
+ &:hover {
247
+ background-color: var(--necto-google-bg-hover, ${fr});
248
+ }
249
+
250
+ &:active {
251
+ background-color: var(--necto-google-bg-active, ${pr});
252
+ }
253
+
254
+ &:focus-visible {
255
+ box-shadow: 0 0 0 3px var(--necto-google-focus-shadow, ${ur});
256
+ }
257
+
258
+ ${t=>t.$disabled&&`
259
+ &:hover,
260
+ &:active {
261
+ background-color: var(--necto-google-bg, ${lt});
262
+ }
263
+ `}
264
+ `,dt=ar(({as:t,asChild:o,children:r="Continue with Google",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>ft(br,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,className:ir(`_necto:${pt}`,a),iconPosition:s,icon:ft(lr,{size:i}),...l,children:r}));dt.displayName=pt;import gr from"clsx";import{forwardRef as Br}from"react";import Or from"@emotion/styled";import{SiHubspot as Rr}from"react-icons/si";import{jsx as ut}from"@emotion/react/jsx-runtime";var bt="HubSpotButton",mt="#ff7a59",_r="#ff6a47",Er="#e55d3f",yr="#ffffff",vr="rgba(255, 122, 89, 0.3)",Cr=Or(f)`
265
+ padding: 0 12px 0 12px;
266
+ background-color: var(--necto-hubspot-bg, ${mt});
267
+ color: var(--necto-hubspot-text, ${yr});
191
268
  border: none;
192
- border-radius: 8px;
193
- font-size: 14px;
194
269
  font-weight: 500;
195
270
  font-family: 'Roboto', system-ui, -apple-system, sans-serif;
196
- line-height: 20px;
197
- cursor: pointer;
198
- user-select: none;
199
- text-decoration: none;
200
- transition: background-color 0.2s, box-shadow 0.2s, border-color 0.2s, color 0.2s;
201
271
 
202
272
  &:hover {
203
- background-color: var(--necto-dropbox-bg-hover, ${lt});
273
+ background-color: var(--necto-hubspot-bg-hover, ${_r});
204
274
  }
205
275
 
206
276
  &:active {
207
- background-color: var(--necto-dropbox-bg-active, ${ft});
277
+ background-color: var(--necto-hubspot-bg-active, ${Er});
208
278
  }
209
279
 
210
280
  &:focus-visible {
211
- outline: none;
212
- box-shadow: 0 0 0 3px var(--necto-dropbox-focus-shadow, ${mt});
281
+ box-shadow: 0 0 0 3px var(--necto-hubspot-focus-shadow, ${vr});
282
+ }
283
+
284
+ ${t=>t.$disabled&&`
285
+ &:hover,
286
+ &:active {
287
+ background-color: var(--necto-hubspot-bg, ${mt});
288
+ }
289
+ `}
290
+ `,gt=Br(({as:t,asChild:o,children:r="Continue with HubSpot",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>ut(Cr,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,className:gr(`_necto:${bt}`,a),iconPosition:s,icon:ut(Rr,{size:i}),...l,children:r}));gt.displayName=bt;import hr from"clsx";import{forwardRef as Tr}from"react";import wr from"@emotion/styled";import{SiHuggingface as Lr}from"react-icons/si";import{jsx as Ot}from"@emotion/react/jsx-runtime";var Rt="HuggingFaceButton",Bt="#ffcc00",xr="#e6b800",kr="#cca300",$r="#000000",Sr="rgba(255, 204, 0, 0.3)",Ar=wr(f)`
291
+ padding: 0 12px 0 12px;
292
+ background-color: var(--necto-huggingface-bg, ${Bt});
293
+ color: var(--necto-huggingface-text, ${$r});
294
+ border: none;
295
+ font-weight: 500;
296
+ font-family: 'Roboto', system-ui, -apple-system, sans-serif;
297
+
298
+ &:hover {
299
+ background-color: var(--necto-huggingface-bg-hover, ${xr});
300
+ }
301
+
302
+ &:active {
303
+ background-color: var(--necto-huggingface-bg-active, ${kr});
213
304
  }
214
305
 
215
- ${o=>o.$disabled&&`
216
- opacity: 0.7;
217
- cursor: not-allowed;
218
- pointer-events: none;
306
+ &:focus-visible {
307
+ box-shadow: 0 0 0 3px var(--necto-huggingface-focus-shadow, ${Sr});
308
+ }
219
309
 
310
+ ${t=>t.$disabled&&`
220
311
  &:hover,
221
312
  &:active {
222
- background-color: var(--necto-dropbox-bg, ${I});
313
+ background-color: var(--necto-huggingface-bg, ${Bt});
223
314
  }
224
315
  `}
225
- `,M=at(({as:o,asChild:t,children:s="Continue with Dropbox",iconPosition:n="left",showIcon:r=!0,iconSize:i=20,disabled:e,className:a,...p},c)=>S(ut,{as:o,ref:c,asChild:t,icon:S(pt,{size:i}),showIcon:r,disabled:e,$disabled:e,iconPosition:n,className:st(`_necto:${N}`,a),...p,children:s}));M.displayName=N;import bt from"clsx";import{forwardRef as gt}from"react";import Bt from"@emotion/styled";import{FaFacebook as yt}from"react-icons/fa6";import{jsx as V}from"@emotion/react/jsx-runtime";var z="FacebookButton",U="#1877f2",Ot="#166fe5",xt="#1467d6",Rt="#ffffff",Et="#1877f2",_t="rgba(24, 119, 242, 0.3)",ht=Bt(l)`
226
- display: inline-flex;
227
- align-items: center;
228
- justify-content: center;
229
- gap: 10px;
230
- padding: 0 18px;
231
- min-height: 40px;
232
- width: 100%;
233
- background-color: var(--necto-facebook-bg, ${U});
234
- color: var(--necto-facebook-text, ${Rt});
235
- border: 1px solid var(--necto-facebook-border, ${Et});
236
- border-radius: 8px;
237
- font-size: 14px;
316
+ `,_t=Tr(({as:t,asChild:o,children:r="Continue with HuggingFace",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>Ot(Ar,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,className:hr(`_necto:${Rt}`,a),iconPosition:s,icon:Ot(Lr,{size:i}),...l,children:r}));_t.displayName=Rt;import Fr from"clsx";import{forwardRef as Mr}from"react";import Hr from"@emotion/styled";import{FaLinkedin as Pr}from"react-icons/fa";import{jsx as yt}from"@emotion/react/jsx-runtime";var vt="LinkedInButton",Et="#0a66c2",Ir="#004182",Gr="#003366",Nr="#ffffff",Dr="rgba(10, 102, 194, 0.3)",Ur=Hr(f)`
317
+ padding: 0 12px;
318
+ background-color: var(--necto-linkedin-bg, ${Et});
319
+ color: var(--necto-linkedin-text, ${Nr});
320
+ border: none;
238
321
  font-weight: 500;
239
322
  font-family: system-ui, -apple-system, sans-serif;
240
- line-height: 20px;
241
- cursor: pointer;
242
- user-select: none;
243
- text-decoration: none;
244
- transition: background-color 0.2s, box-shadow 0.2s, border-color 0.2s, color 0.2s;
245
323
 
246
324
  &:hover {
247
- background-color: var(--necto-facebook-bg-hover, ${Ot});
325
+ background-color: var(--necto-linkedin-bg-hover, ${Ir});
248
326
  }
249
327
 
250
328
  &:active {
251
- background-color: var(--necto-facebook-bg-active, ${xt});
329
+ background-color: var(--necto-linkedin-bg-active, ${Gr});
252
330
  }
253
331
 
254
332
  &:focus-visible {
255
- outline: none;
256
- box-shadow: 0 0 0 3px var(--necto-facebook-focus-shadow, ${_t});
333
+ box-shadow: 0 0 0 3px var(--necto-linkedin-focus-shadow, ${Dr});
257
334
  }
258
335
 
259
- ${o=>o.$disabled&&`
260
- opacity: 0.7;
261
- cursor: not-allowed;
262
- pointer-events: none;
336
+ ${t=>t.$disabled&&`
337
+ &:hover,
338
+ &:active {
339
+ background-color: var(--necto-linkedin-bg, ${Et});
340
+ }
341
+ `}
342
+ `,Ct=Mr(({as:t,asChild:o,children:r="Continue with LinkedIn",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>yt(Ur,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,className:Fr(`_necto:${vt}`,a),iconPosition:s,icon:yt(Pr,{size:i}),...l,children:r}));Ct.displayName=vt;import Kr from"clsx";import{forwardRef as zr}from"react";import Vr from"@emotion/styled";import{jsx as p,jsxs as Xr}from"@emotion/react/jsx-runtime";var ht=({size:t})=>Xr("svg",{width:t,height:t,version:"1.1",id:"Layer_1",xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink",x:"0px",y:"0px",viewBox:"0 0 142 136.878",xmlSpace:"preserve",children:[p("title",{children:"MetaMask logo"}),p("path",{fill:"#FF5C16",d:`M132.682,132.192l-30.583-9.106l-23.063,13.787l-16.092-0.007l-23.077-13.78l-30.569,9.106L0,100.801
343
+ l9.299-34.839L0,36.507L9.299,0l47.766,28.538h27.85L132.682,0l9.299,36.507l-9.299,29.455l9.299,34.839L132.682,132.192
344
+ L132.682,132.192z`}),p("path",{fill:"#FF5C16",d:`M9.305,0l47.767,28.558l-1.899,19.599L9.305,0z M39.875,100.814l21.017,16.01l-21.017,6.261
345
+ C39.875,123.085,39.875,100.814,39.875,100.814z M59.212,74.345l-4.039-26.174L29.317,65.97l-0.014-0.007v0.013l0.08,18.321
346
+ l10.485-9.951L59.212,74.345L59.212,74.345z M132.682,0L84.915,28.558l1.893,19.599L132.682,0z M102.113,100.814l-21.018,16.01
347
+ l21.018,6.261V100.814z M112.678,65.975h0.007H112.678v-0.013l-0.006,0.007L86.815,48.171l-4.039,26.174h19.336l10.492,9.95
348
+ C112.604,84.295,112.678,65.975,112.678,65.975z`}),p("path",{fill:"#E34807",d:`M39.868,123.085l-30.569,9.106L0,100.814h39.868C39.868,100.814,39.868,123.085,39.868,123.085z
349
+ M59.205,74.338l5.839,37.84l-8.093-21.04L29.37,84.295l10.491-9.956h19.344L59.205,74.338z M102.112,123.085l30.57,9.106
350
+ l9.299-31.378h-39.869C102.112,100.814,102.112,123.085,102.112,123.085z M82.776,74.338l-5.839,37.84l8.092-21.04l27.583-6.843
351
+ l-10.498-9.956H82.776V74.338z`}),p("path",{fill:"#FF8D5D",d:`M0,100.801l9.299-34.839h19.997l0.073,18.327l27.584,6.843l8.092,21.039l-4.16,4.633l-21.017-16.01H0
352
+ V100.801z M141.981,100.801l-9.299-34.839h-19.998l-0.073,18.327l-27.582,6.843l-8.093,21.039l4.159,4.633l21.018-16.01h39.868
353
+ V100.801z M84.915,28.538h-27.85l-1.891,19.599l9.872,64.013h11.891l9.878-64.013L84.915,28.538z`}),p("path",{fill:"#661800",d:`M9.299,0L0,36.507l9.299,29.455h19.997l25.87-17.804L9.299,0z M53.426,81.938h-9.059l-4.932,4.835
354
+ l17.524,4.344l-3.533-9.186V81.938z M132.682,0l9.299,36.507l-9.299,29.455h-19.998L86.815,48.158L132.682,0z M88.568,81.938h9.072
355
+ l4.932,4.841l-17.544,4.353l3.54-9.201V81.938z M79.029,124.385l2.067-7.567l-4.16-4.633h-11.9l-4.159,4.633l2.066,7.567`}),p("path",{fill:"#C0C4CD",d:"M79.029,124.384v12.495H62.945v-12.495L79.029,124.384L79.029,124.384z"}),p("path",{fill:"#E7EBF6",d:`M39.875,123.072l23.083,13.8v-12.495l-2.067-7.566C60.891,116.811,39.875,123.072,39.875,123.072z
356
+ M102.113,123.072l-23.084,13.8v-12.495l2.067-7.566C81.096,116.811,102.113,123.072,102.113,123.072z`})]});import{jsx as wt}from"@emotion/react/jsx-runtime";var Lt="MetaMaskButton",Tt="#f6851b",Wr="#e2761a",Yr="#cd6a17",Zr="#ffffff",qr="rgba(246, 133, 27, 0.3)",Jr=Vr(f)`
357
+ padding: 0 12px 0 12px;
358
+ background-color: var(--necto-metamask-bg, ${Tt});
359
+ color: var(--necto-metamask-text, ${Zr});
360
+ border: none;
361
+ font-weight: 500;
362
+ font-family: 'Roboto', system-ui, -apple-system, sans-serif;
363
+
364
+ &:hover {
365
+ background-color: var(--necto-metamask-bg-hover, ${Wr});
366
+ }
367
+
368
+ &:active {
369
+ background-color: var(--necto-metamask-bg-active, ${Yr});
370
+ }
371
+
372
+ &:focus-visible {
373
+ box-shadow: 0 0 0 3px var(--necto-metamask-focus-shadow, ${qr});
374
+ }
263
375
 
376
+ ${t=>t.$disabled&&`
264
377
  &:hover,
265
378
  &:active {
266
- background-color: var(--necto-facebook-bg, ${U});
379
+ background-color: var(--necto-metamask-bg, ${Tt});
267
380
  }
268
381
  `}
269
- `,K=gt(({as:o,asChild:t,children:s="Continue with Facebook",iconPosition:n="left",showIcon:r=!0,iconSize:i=20,disabled:e,className:a,...p},c)=>V(ht,{as:o,ref:c,asChild:t,showIcon:r,disabled:e,$disabled:e,iconPosition:n,icon:V(yt,{size:i}),className:bt(`_necto:${z}`,a),...p,children:s}));K.displayName=z;import vt from"clsx";import{forwardRef as Ct}from"react";import Tt from"@emotion/styled";import{FaGithub as wt}from"react-icons/fa";import{jsx as W}from"@emotion/react/jsx-runtime";var Z="GitHubButton",X="#24292f",Lt="#2c3237",At="#373e47",Pt="#ffffff",Gt="#24292f",$t="rgba(36, 41, 47, 0.3)",kt=Tt(l)`
270
- display: inline-flex;
271
- align-items: center;
272
- justify-content: center;
273
- gap: 10px;
382
+ `,xt=zr(({as:t,asChild:o,children:r="Continue with MetaMask",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>wt(Jr,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,className:Kr(`_necto:${Lt}`,a),iconPosition:s,icon:wt(ht,{size:i}),...l,children:r}));xt.displayName=Lt;import jr from"clsx";import{forwardRef as tn}from"react";import on from"@emotion/styled";import{jsx as g,jsxs as Qr}from"@emotion/react/jsx-runtime";var kt=({size:t})=>Qr("svg",{xmlns:"http://www.w3.org/2000/svg",width:t,height:t,viewBox:"0 0 256 256",children:[g("title",{children:"Microsoft"}),g("path",{fill:"#F1511B",d:"M121.666 121.666H0V0h121.666z"}),g("path",{fill:"#80CC28",d:"M256 121.666H134.335V0H256z"}),g("path",{fill:"#00ADEF",d:"M121.663 256.002H0V134.336h121.663z"}),g("path",{fill:"#FBBC09",d:"M256 256.002H134.335V134.336H256z"})]});import{jsx as St}from"@emotion/react/jsx-runtime";var At="MicrosoftButton",$t="#2f2f2f",en="#3d3d3d",rn="#4a4a4a",nn="#ffffff",sn="#8c8c8c",an="rgba(47, 47, 47, 0.3)",cn=on(f)`
274
383
  padding: 0 18px;
275
- min-height: 40px;
276
- width: 100%;
277
- background-color: var(--necto-github-bg, ${X});
278
- color: var(--necto-github-text, ${Pt});
279
- border: 1px solid var(--necto-github-border, ${Gt});
280
- border-radius: 8px;
281
- font-size: 14px;
384
+ min-height: 41px;
385
+ background-color: var(--necto-microsoft-bg, ${$t});
386
+ color: var(--necto-microsoft-text, ${nn});
387
+ border: 1px solid var(--necto-microsoft-border, ${sn});
388
+ font-size: 15px;
389
+ font-weight: 600;
390
+ font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
391
+
392
+ &:hover {
393
+ background-color: var(--necto-microsoft-bg-hover, ${en});
394
+ }
395
+
396
+ &:active {
397
+ background-color: var(--necto-microsoft-bg-active, ${rn});
398
+ }
399
+
400
+ &:focus-visible {
401
+ box-shadow: 0 0 0 3px var(--necto-microsoft-focus-shadow, ${an});
402
+ }
403
+
404
+ ${t=>t.$disabled&&`
405
+ &:hover,
406
+ &:active {
407
+ background-color: var(--necto-microsoft-bg, ${$t});
408
+ }
409
+ `}
410
+ `,Ft=tn(({as:t,asChild:o,children:r="Sign in with Microsoft",iconPosition:s="left",showIcon:n=!0,iconSize:i=18,disabled:e,className:a,...l},c)=>St(cn,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,className:jr(`_necto:${At}`,a),iconPosition:s,icon:St(kt,{size:i}),...l,children:r}));Ft.displayName=At;import ln from"clsx";import{forwardRef as fn}from"react";import pn from"@emotion/styled";import{SiNotion as dn}from"react-icons/si";import{jsx as Ht}from"@emotion/react/jsx-runtime";var Pt="NotionButton",Mt="#000000",mn="#1a1a1a",un="#333333",bn="#ffffff",gn="rgba(0, 0, 0, 0.3)",Bn=pn(f)`
411
+ padding: 0 12px 0 12px;
412
+ background-color: var(--necto-notion-bg, ${Mt});
413
+ color: var(--necto-notion-text, ${bn});
414
+ border: none;
415
+ font-weight: 500;
416
+ font-family: 'Roboto', system-ui, -apple-system, sans-serif;
417
+
418
+ &:hover {
419
+ background-color: var(--necto-notion-bg-hover, ${mn});
420
+ }
421
+
422
+ &:active {
423
+ background-color: var(--necto-notion-bg-active, ${un});
424
+ }
425
+
426
+ &:focus-visible {
427
+ box-shadow: 0 0 0 3px var(--necto-notion-focus-shadow, ${gn});
428
+ }
429
+
430
+ ${t=>t.$disabled&&`
431
+ &:hover,
432
+ &:active {
433
+ background-color: var(--necto-notion-bg, ${Mt});
434
+ }
435
+ `}
436
+ `,It=fn(({as:t,asChild:o,children:r="Continue with Notion",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>Ht(Bn,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,className:ln(`_necto:${Pt}`,a),iconPosition:s,icon:Ht(dn,{size:i}),...l,children:r}));It.displayName=Pt;import On from"clsx";import{forwardRef as Rn}from"react";import _n from"@emotion/styled";import{SiOkx as En}from"react-icons/si";import{jsx as Nt}from"@emotion/react/jsx-runtime";var Dt="OKXButton",Gt="#000000",yn="#1a1a1a",vn="#333333",Cn="#ffffff",hn="rgba(0, 0, 0, 0.3)",Tn=_n(f)`
437
+ padding: 0 12px 0 12px;
438
+ background-color: var(--necto-okx-bg, ${Gt});
439
+ color: var(--necto-okx-text, ${Cn});
440
+ border: none;
441
+ font-weight: 500;
442
+ font-family: 'Roboto', system-ui, -apple-system, sans-serif;
443
+
444
+ &:hover {
445
+ background-color: var(--necto-okx-bg-hover, ${yn});
446
+ }
447
+
448
+ &:active {
449
+ background-color: var(--necto-okx-bg-active, ${vn});
450
+ }
451
+
452
+ &:focus-visible {
453
+ box-shadow: 0 0 0 3px var(--necto-okx-focus-shadow, ${hn});
454
+ }
455
+
456
+ ${t=>t.$disabled&&`
457
+ &:hover,
458
+ &:active {
459
+ background-color: var(--necto-okx-bg, ${Gt});
460
+ }
461
+ `}
462
+ `,Ut=Rn(({as:t,asChild:o,children:r="Continue with OKX",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>Nt(Tn,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,className:On(`_necto:${Dt}`,a),iconPosition:s,icon:Nt(En,{size:i}),...l,children:r}));Ut.displayName=Dt;import wn from"clsx";import{forwardRef as Ln}from"react";import xn from"@emotion/styled";import{FaSalesforce as kn}from"react-icons/fa";import{jsx as Kt}from"@emotion/react/jsx-runtime";var zt="SalesforceButton",Xt="#00a1e0",$n="#0074a8",Sn="#005c85",An="#ffffff",Fn="rgba(0, 161, 224, 0.3)",Mn=xn(f)`
463
+ padding: 0 12px;
464
+ background-color: var(--necto-salesforce-bg, ${Xt});
465
+ color: var(--necto-salesforce-text, ${An});
466
+ border: none;
282
467
  font-weight: 500;
283
468
  font-family: system-ui, -apple-system, sans-serif;
284
- line-height: 20px;
285
- cursor: pointer;
286
- user-select: none;
287
- text-decoration: none;
288
- transition: background-color 0.2s, box-shadow 0.2s, border-color 0.2s, color 0.2s;
289
469
 
290
470
  &:hover {
291
- background-color: var(--necto-github-bg-hover, ${Lt});
471
+ background-color: var(--necto-salesforce-bg-hover, ${$n});
292
472
  }
293
473
 
294
474
  &:active {
295
- background-color: var(--necto-github-bg-active, ${At});
475
+ background-color: var(--necto-salesforce-bg-active, ${Sn});
296
476
  }
297
477
 
298
478
  &:focus-visible {
299
- outline: none;
300
- box-shadow: 0 0 0 3px var(--necto-github-focus-shadow, ${$t});
479
+ box-shadow: 0 0 0 3px var(--necto-salesforce-focus-shadow, ${Fn});
301
480
  }
302
481
 
303
- ${o=>o.$disabled&&`
304
- opacity: 0.7;
305
- cursor: not-allowed;
306
- pointer-events: none;
482
+ ${t=>t.$disabled&&`
483
+ &:hover,
484
+ &:active {
485
+ background-color: var(--necto-salesforce-bg, ${Xt});
486
+ }
487
+ `}
488
+ `,Vt=Ln(({as:t,asChild:o,children:r="Continue with Salesforce",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>Kt(Mn,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,className:wn(`_necto:${zt}`,a),iconPosition:s,icon:Kt(kn,{size:i}),...l,children:r}));Vt.displayName=zt;import Hn from"clsx";import{forwardRef as Pn}from"react";import In from"@emotion/styled";import{FaSlack as Gn}from"react-icons/fa";import{jsx as Yt}from"@emotion/react/jsx-runtime";var Zt="SlackButton",Wt="#4a154b",Nn="#3f1240",Dn="#350f36",Un="#ffffff",Xn="rgba(74, 21, 75, 0.3)",Kn=In(f)`
489
+ padding: 0 12px 0 12px;
490
+ background-color: var(--necto-slack-bg, ${Wt});
491
+ color: var(--necto-slack-text, ${Un});
492
+ border: none;
493
+ font-weight: 500;
494
+ font-family: 'Roboto', system-ui, -apple-system, sans-serif;
307
495
 
496
+ &:hover {
497
+ background-color: var(--necto-slack-bg-hover, ${Nn});
498
+ }
499
+
500
+ &:active {
501
+ background-color: var(--necto-slack-bg-active, ${Dn});
502
+ }
503
+
504
+ &:focus-visible {
505
+ box-shadow: 0 0 0 3px var(--necto-slack-focus-shadow, ${Xn});
506
+ }
507
+
508
+ ${t=>t.$disabled&&`
308
509
  &:hover,
309
510
  &:active {
310
- background-color: var(--necto-github-bg, ${X});
511
+ background-color: var(--necto-slack-bg, ${Wt});
311
512
  }
312
513
  `}
313
- `,q=Ct(({as:o,asChild:t,children:s="Continue with GitHub",iconPosition:n="left",showIcon:r=!0,iconSize:i=20,disabled:e,className:a,...p},c)=>W(kt,{as:o,ref:c,asChild:t,showIcon:r,disabled:e,$disabled:e,iconPosition:n,icon:W(wt,{size:i}),className:vt(`_necto:${Z}`,a),...p,children:s}));q.displayName=Z;import Ft from"clsx";import{forwardRef as Ht}from"react";import Dt from"@emotion/styled";import{FaGitlab as It}from"react-icons/fa6";import{jsx as Q}from"@emotion/react/jsx-runtime";var Y="GitLabButton",J="#fc6d26",St="#e24329",Nt="#c73b1c",Mt="#ffffff",Ut="rgba(252, 109, 38, 0.3)",Vt=Dt(l)`
314
- display: inline-flex;
315
- align-items: center;
316
- justify-content: center;
317
- gap: 10px;
514
+ `,qt=Pn(({as:t,asChild:o,children:r="Continue with Slack",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>Yt(Kn,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,className:Hn(`_necto:${Zt}`,a),iconPosition:s,icon:Yt(Gn,{size:i}),...l,children:r}));qt.displayName=Zt;import zn from"clsx";import{forwardRef as Vn}from"react";import Wn from"@emotion/styled";import{jsx as v,jsxs as Jt}from"@emotion/react/jsx-runtime";var Qt=({size:t,color:o})=>{let r=o==null;return Jt("svg",{width:t,height:t,viewBox:"0 0 500 500",xmlns:"http://www.w3.org/2000/svg",children:[v("title",{children:"Snapchat Icon"}),Jt("g",{children:[v("path",{fill:r?"white":o??void 0,d:"M417.93,340.71c-60.61-29.34-70.27-74.64-70.7-78-.52-4.07-1.11-7.27,3.38-11.41,4.33-4,23.54-15.89,28.87-19.61,8.81-6.16,12.69-12.31,9.83-19.87-2-5.23-6.87-7.2-12-7.2a22.3,22.3,0,0,0-4.81.54c-9.68,2.1-19.08,6.95-24.52,8.26a8.56,8.56,0,0,1-2,.27c-2.9,0-4-1.29-3.72-4.78.68-10.58,2.12-31.23.45-50.52-2.29-26.54-10.85-39.69-21-51.32C316.8,101.43,294,77.2,250,77.2S183.23,101.43,178.35,107c-10.18,11.63-18.73,24.78-21,51.32-1.67,19.29-.17,39.93.45,50.52.2,3.32-.82,4.78-3.72,4.78a8.64,8.64,0,0,1-2-.27c-5.43-1.31-14.83-6.16-24.51-8.26a22.3,22.3,0,0,0-4.81-.54c-5.15,0-10,2-12,7.2-2.86,7.56,1,13.71,9.84,19.87,5.33,3.72,24.54,15.6,28.87,19.61,4.48,4.14,3.9,7.34,3.38,11.41-.43,3.41-10.1,48.71-70.7,78-3.55,1.72-9.59,5.36,1.06,11.24,16.72,9.24,27.85,8.25,36.5,13.82,7.34,4.73,3,14.93,8.34,18.61,6.56,4.53,25.95-.32,51,7.95,21,6.92,33.76,26.47,71,26.47s50.37-19.64,71-26.47c25-8.27,44.43-3.42,51-7.95,5.33-3.68,1-13.88,8.34-18.61,8.65-5.57,19.77-4.58,36.5-13.82C427.52,346.07,421.48,342.43,417.93,340.71Z"}),v("path",{fill:r?"black":o??void 0,d:"M444.3,337.26c-2.72-7.4-7.9-11.36-13.8-14.64-1.11-.65-2.13-1.17-3-1.57-1.76-.91-3.56-1.79-5.35-2.72-18.39-9.75-32.75-22.05-42.71-36.63a83.06,83.06,0,0,1-7.33-13c-.85-2.43-.81-3.81-.2-5.07a8.25,8.25,0,0,1,2.35-2.45c3.16-2.09,6.42-4.21,8.63-5.64,3.94-2.55,7.06-4.57,9.07-6,7.55-5.28,12.83-10.89,16.13-17.16A34.17,34.17,0,0,0,409.78,204c-5-13.16-17.43-21.33-32.49-21.33a44.75,44.75,0,0,0-9.45,1c-.83.18-1.66.37-2.47.58.14-9-.06-18.5-.86-27.85-2.84-32.87-14.35-50.1-26.35-63.84A105,105,0,0,0,311.37,71C293.16,60.6,272.51,55.32,250,55.32S206.94,60.6,188.71,71a104.62,104.62,0,0,0-26.84,21.6c-12,13.74-23.51,31-26.35,63.84-.8,9.35-1,18.9-.87,27.85-.81-.21-1.63-.4-2.46-.58a44.75,44.75,0,0,0-9.45-1c-15.07,0-27.52,8.17-32.5,21.33a34.21,34.21,0,0,0,1.65,28.41c3.31,6.27,8.59,11.88,16.14,17.16,2,1.4,5.13,3.42,9.07,6,2.13,1.38,5.24,3.4,8.29,5.42a8.9,8.9,0,0,1,2.66,2.67c.64,1.31.66,2.72-.29,5.32a82.29,82.29,0,0,1-7.21,12.73c-9.74,14.25-23.68,26.33-41.48,36-9.43,5-19.23,8.34-23.37,19.59-3.12,8.49-1.08,18.15,6.85,26.29h0a39.63,39.63,0,0,0,10,7.57,108.35,108.35,0,0,0,24.47,9.79,16.16,16.16,0,0,1,4.94,2.21c2.89,2.53,2.48,6.34,6.33,11.92a27.8,27.8,0,0,0,7.24,7.36c8.08,5.58,17.16,5.93,26.78,6.3,8.69.33,18.54.71,29.79,4.42,4.66,1.54,9.5,4.52,15.11,8,13.47,8.28,31.91,19.61,62.77,19.61s49.43-11.39,63-19.7c5.57-3.42,10.38-6.37,14.91-7.87,11.25-3.72,21.1-4.09,29.79-4.42,9.62-.37,18.7-.72,26.78-6.3a27.89,27.89,0,0,0,8.24-9c2.77-4.71,2.7-8,5.3-10.3a15.32,15.32,0,0,1,4.64-2.12,108.76,108.76,0,0,0,24.8-9.88A39,39,0,0,0,437.94,363l.1-.12C445.48,354.92,447.35,345.54,444.3,337.26ZM416.87,352c-16.73,9.24-27.85,8.25-36.5,13.82-7.35,4.73-3,14.93-8.34,18.61-6.56,4.53-25.95-.32-51,7.95-20.66,6.83-33.84,26.47-71,26.47S200,399.25,179,392.33c-25-8.27-44.43-3.42-51-7.95-5.33-3.68-1-13.88-8.34-18.61C111,360.2,99.88,361.19,83.16,352c-10.65-5.88-4.61-9.52-1.06-11.24,60.6-29.34,70.27-74.64,70.7-78,.52-4.07,1.1-7.27-3.38-11.41-4.33-4-23.54-15.89-28.87-19.61-8.82-6.16-12.7-12.31-9.84-19.87,2-5.23,6.88-7.2,12-7.2a22.3,22.3,0,0,1,4.81.54c9.68,2.1,19.08,6.95,24.51,8.26a8.64,8.64,0,0,0,2,.27c2.9,0,3.92-1.46,3.72-4.78-.62-10.59-2.12-31.23-.45-50.52,2.29-26.54,10.84-39.69,21-51.32,4.88-5.59,27.81-29.82,71.66-29.82S316.8,101.43,321.68,107c10.17,11.63,18.73,24.78,21,51.32,1.67,19.29.23,39.94-.45,50.52-.23,3.49.82,4.78,3.72,4.78a8.56,8.56,0,0,0,2-.27c5.44-1.31,14.84-6.16,24.52-8.26a22.3,22.3,0,0,1,4.81-.54c5.15,0,10,2,12,7.2,2.86,7.56-1,13.71-9.83,19.87-5.33,3.72-24.54,15.6-28.87,19.61-4.49,4.14-3.9,7.34-3.38,11.41.43,3.41,10.09,48.71,70.7,78C421.48,342.43,427.52,346.07,416.87,352Z"})]})]})};import{jsx as to}from"@emotion/react/jsx-runtime";var oo="SnapchatButton",jt="#FFFC00",Yn="#F7EC09",Zn="#E8DD08",qn="#000000",Jn="rgba(255, 252, 0, 0.3)",Qn=Wn(f)`
318
515
  padding: 0 18px;
319
- min-height: 40px;
320
- width: 100%;
321
- background-color: var(--necto-gitlab-bg, ${J});
322
- color: var(--necto-gitlab-text, ${Mt});
516
+ background-color: var(--necto-snapchat-bg, ${jt});
517
+ color: var(--necto-snapchat-text, ${qn});
323
518
  border: none;
324
- border-radius: 8px;
325
- font-size: 14px;
326
519
  font-weight: 500;
327
- font-family: system-ui, -apple-system, sans-serif;
328
- line-height: 20px;
329
- cursor: pointer;
330
- user-select: none;
331
- text-decoration: none;
332
- transition: background-color 0.2s, box-shadow 0.2s;
520
+ font-family: 'Roboto', system-ui, -apple-system, sans-serif;
333
521
 
334
522
  &:hover {
335
- background-color: var(--necto-gitlab-bg-hover, ${St});
523
+ background-color: var(--necto-snapchat-bg-hover, ${Yn});
336
524
  }
337
525
 
338
526
  &:active {
339
- background-color: var(--necto-gitlab-bg-active, ${Nt});
527
+ background-color: var(--necto-snapchat-bg-active, ${Zn});
340
528
  }
341
529
 
342
530
  &:focus-visible {
343
- outline: none;
344
- box-shadow: 0 0 0 3px var(--necto-gitlab-focus-shadow, ${Ut});
531
+ box-shadow: 0 0 0 3px var(--necto-snapchat-focus-shadow, ${Jn});
345
532
  }
346
533
 
347
- ${o=>o.$disabled&&`
348
- opacity: 0.7;
349
- cursor: not-allowed;
350
- pointer-events: none;
534
+ ${t=>t.$disabled&&`
535
+ &:hover,
536
+ &:active {
537
+ background-color: var(--necto-snapchat-bg, ${jt});
538
+ }
539
+ `}
540
+ `,eo=Vn(({as:t,asChild:o,iconColor:r=null,children:s="Continue with Snapchat",iconPosition:n="left",showIcon:i=!0,iconSize:e=20,disabled:a,className:l,...c},d)=>to(Qn,{as:t,ref:d,asChild:o,showIcon:i,disabled:a,$disabled:a,iconPosition:n,icon:to(Qt,{size:e,color:r}),className:zn(`_necto:${oo}`,l),...c,children:s}));eo.displayName=oo;import jn from"clsx";import{forwardRef as ts}from"react";import os from"@emotion/styled";import{FaSpotify as es}from"react-icons/fa";import{jsx as no}from"@emotion/react/jsx-runtime";var so="SpotifyButton",ro="#1db954",rs="#1aa64b",ns="#179443",ss="#ffffff",is="rgba(29, 185, 84, 0.3)",as=os(f)`
541
+ padding: 0 12px 0 12px;
542
+ background-color: var(--necto-spotify-bg, ${ro});
543
+ color: var(--necto-spotify-text, ${ss});
544
+ border: none;
545
+ font-weight: 500;
546
+ font-family: 'Roboto', system-ui, -apple-system, sans-serif;
351
547
 
548
+ &:hover {
549
+ background-color: var(--necto-spotify-bg-hover, ${rs});
550
+ }
551
+
552
+ &:active {
553
+ background-color: var(--necto-spotify-bg-active, ${ns});
554
+ }
555
+
556
+ &:focus-visible {
557
+ box-shadow: 0 0 0 3px var(--necto-spotify-focus-shadow, ${is});
558
+ }
559
+
560
+ ${t=>t.$disabled&&`
352
561
  &:hover,
353
562
  &:active {
354
- background-color: var(--necto-gitlab-bg, ${J});
563
+ background-color: var(--necto-spotify-bg, ${ro});
355
564
  }
356
565
  `}
357
- `,j=Ht(({as:o,asChild:t,children:s="Continue with GitLab",iconPosition:n="left",showIcon:r=!0,iconSize:i=20,disabled:e,className:a,...p},c)=>Q(Vt,{as:o,ref:c,asChild:t,showIcon:r,disabled:e,$disabled:e,iconPosition:n,icon:Q(It,{size:i}),className:Ft(`_necto:${Y}`,a),...p,children:s}));j.displayName=Y;import zt from"clsx";import{forwardRef as Kt}from"react";import Xt from"@emotion/styled";import{FcGoogle as Wt}from"react-icons/fc";import{jsx as to}from"@emotion/react/jsx-runtime";var eo="GoogleButton",oo="#ffffff",Zt="#f8f9fa",qt="#eceff1",Jt="#1f1f1f",Qt="#747775",Yt="rgba(66, 133, 244, 0.3)",jt=Xt(l)`
358
- display: inline-flex;
359
- align-items: center;
360
- justify-content: center;
361
- gap: 10px;
566
+ `,io=ts(({as:t,asChild:o,children:r="Continue with Spotify",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>no(as,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,className:jn(`_necto:${so}`,a),iconPosition:s,icon:no(es,{size:i}),...l,children:r}));io.displayName=so;import cs from"clsx";import{forwardRef as ls}from"react";import fs from"@emotion/styled";import{jsx as _,jsxs as ao}from"@emotion/react/jsx-runtime";var co=({size:t})=>ao("svg",{width:t,height:t,viewBox:"0 0 256 290",xmlns:"http://www.w3.org/2000/svg",children:[_("title",{children:"TikTok Icon"}),ao("g",{children:[_("path",{fill:"#FF004F",d:"M189.72 104.421c18.678 13.345 41.56 21.197 66.273 21.197v-47.53a67 67 0 0 1-13.918-1.456v37.413c-24.711 0-47.59-7.851-66.272-21.195v96.996c0 48.523-39.356 87.855-87.9 87.855c-18.113 0-34.949-5.473-48.934-14.86c15.962 16.313 38.222 26.432 62.848 26.432c48.548 0 87.905-39.332 87.905-87.857v-96.995zm17.17-47.952c-9.546-10.423-15.814-23.893-17.17-38.785v-6.113h-13.189c3.32 18.927 14.644 35.097 30.358 44.898M69.673 225.607a40 40 0 0 1-8.203-24.33c0-22.192 18.001-40.186 40.21-40.186a40.3 40.3 0 0 1 12.197 1.883v-48.593c-4.61-.631-9.262-.9-13.912-.801v37.822a40.3 40.3 0 0 0-12.203-1.882c-22.208 0-40.208 17.992-40.208 40.187c0 15.694 8.997 29.281 22.119 35.9"}),_("path",{fill:"#000000",d:"M175.803 92.849c18.683 13.344 41.56 21.195 66.272 21.195V76.631c-13.794-2.937-26.005-10.141-35.186-20.162c-15.715-9.802-27.038-25.972-30.358-44.898h-34.643v189.843c-.079 22.132-18.049 40.052-40.21 40.052c-13.058 0-24.66-6.221-32.007-15.86c-13.12-6.618-22.118-20.206-22.118-35.898c0-22.193 18-40.187 40.208-40.187c4.255 0 8.356.662 12.203 1.882v-37.822c-47.692.985-86.047 39.933-86.047 87.834c0 23.912 9.551 45.589 25.053 61.428c13.985 9.385 30.82 14.86 48.934 14.86c48.545 0 87.9-39.335 87.9-87.857z"}),_("path",{fill:"#00F2EA",d:"M242.075 76.63V66.516a66.3 66.3 0 0 1-35.186-10.047a66.47 66.47 0 0 0 35.186 20.163M176.53 11.57a68 68 0 0 1-.728-5.457V0h-47.834v189.845c-.076 22.13-18.046 40.05-40.208 40.05a40.06 40.06 0 0 1-18.09-4.287c7.347 9.637 18.949 15.857 32.007 15.857c22.16 0 40.132-17.918 40.21-40.05V11.571zM99.966 113.58v-10.769a89 89 0 0 0-12.061-.818C39.355 101.993 0 141.327 0 189.845c0 30.419 15.467 57.227 38.971 72.996c-15.502-15.838-25.053-37.516-25.053-61.427c0-47.9 38.354-86.848 86.048-87.833"})]})]});import{FaTiktok as ps}from"react-icons/fa";import{jsx as C}from"@emotion/react/jsx-runtime";var fo="TikTokButton",lo="#000000",ds="#1a1a1a",ms="#333333",us="#ffffff",bs="rgba(0, 0, 0, 0.3)",gs=fs(f)`
362
567
  padding: 0 12px 0 12px;
363
- min-height: 40px;
364
- width: 100%;
365
- background-color: var(--necto-google-bg, ${oo});
366
- color: var(--necto-google-text, ${Jt});
367
- border: 1px solid var(--necto-google-border, ${Qt});
368
- border-radius: 8px;
369
- font-size: 14px;
568
+ background-color: var(--necto-tiktok-bg, ${lo});
569
+ color: var(--necto-tiktok-text, ${us});
570
+ border: none;
370
571
  font-weight: 500;
371
- font-family: 'Roboto Medium', system-ui, -apple-system, sans-serif;
372
- line-height: 20px;
373
- cursor: pointer;
374
- user-select: none;
375
- text-decoration: none;
376
- transition: background-color 0.2s, box-shadow 0.2s, border-color 0.2s, color 0.2s;
572
+ font-family: 'Roboto', system-ui, -apple-system, sans-serif;
573
+
574
+ &:hover {
575
+ background-color: var(--necto-tiktok-bg-hover, ${ds});
576
+ }
577
+
578
+ &:active {
579
+ background-color: var(--necto-tiktok-bg-active, ${ms});
580
+ }
581
+
582
+ &:focus-visible {
583
+ box-shadow: 0 0 0 3px var(--necto-tiktok-focus-shadow, ${bs});
584
+ }
585
+
586
+ ${t=>t.$disabled&&`
587
+ &:hover,
588
+ &:active {
589
+ background-color: var(--necto-tiktok-bg, ${lo});
590
+ }
591
+ `}
592
+ `,po=ls(({as:t,asChild:o,iconColor:r=null,children:s="Continue with TikTok",iconPosition:n="left",showIcon:i=!0,iconSize:e=20,disabled:a,className:l,...c},d)=>C(gs,{as:t,ref:d,asChild:o,showIcon:i,disabled:a,$disabled:a,className:cs(`_necto:${fo}`,l),iconPosition:n,icon:r?C(ps,{size:e,color:r}):C(co,{size:e}),...c,children:s}));po.displayName=fo;import Bs from"clsx";import{forwardRef as Os}from"react";import Rs from"@emotion/styled";import{FaTwitch as _s}from"react-icons/fa";import{jsx as uo}from"@emotion/react/jsx-runtime";var bo="TwitchButton",mo="#9146ff",Es="#823ee6",ys="#7337cc",vs="#ffffff",Cs="rgba(145, 70, 255, 0.3)",hs=Rs(f)`
593
+ padding: 0 12px 0 12px;
594
+ background-color: var(--necto-twitch-bg, ${mo});
595
+ color: var(--necto-twitch-text, ${vs});
596
+ border: none;
597
+ font-weight: 500;
598
+ font-family: 'Roboto', system-ui, -apple-system, sans-serif;
377
599
 
378
600
  &:hover {
379
- background-color: var(--necto-google-bg-hover, ${Zt});
601
+ background-color: var(--necto-twitch-bg-hover, ${Es});
380
602
  }
381
603
 
382
604
  &:active {
383
- background-color: var(--necto-google-bg-active, ${qt});
605
+ background-color: var(--necto-twitch-bg-active, ${ys});
384
606
  }
385
607
 
386
608
  &:focus-visible {
387
- outline: none;
388
- box-shadow: 0 0 0 3px var(--necto-google-focus-shadow, ${Yt});
609
+ box-shadow: 0 0 0 3px var(--necto-twitch-focus-shadow, ${Cs});
389
610
  }
390
611
 
391
- ${o=>o.$disabled&&`
392
- opacity: 0.7;
393
- cursor: not-allowed;
394
- pointer-events: none;
612
+ ${t=>t.$disabled&&`
613
+ &:hover,
614
+ &:active {
615
+ background-color: var(--necto-twitch-bg, ${mo});
616
+ }
617
+ `}
618
+ `,go=Os(({as:t,asChild:o,children:r="Continue with Twitch",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>uo(hs,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,className:Bs(`_necto:${bo}`,a),iconPosition:s,icon:uo(_s,{size:i}),...l,children:r}));go.displayName=bo;import Ts from"clsx";import{forwardRef as ws}from"react";import Ls from"@emotion/styled";import{FaXTwitter as xs}from"react-icons/fa6";import{jsx as Oo}from"@emotion/react/jsx-runtime";var Ro="XButton",Bo="#000000",ks="#1a1a1a",$s="#333333",Ss="#ffffff",As="rgba(0, 0, 0, 0.3)",Fs=Ls(f)`
619
+ padding: 0 12px 0 12px;
620
+ background-color: var(--necto-x-bg, ${Bo});
621
+ color: var(--necto-x-text, ${Ss});
622
+ border: none;
623
+ font-weight: 500;
624
+ font-family: 'Roboto', system-ui, -apple-system, sans-serif;
625
+
626
+ &:hover {
627
+ background-color: var(--necto-x-bg-hover, ${ks});
628
+ }
629
+
630
+ &:active {
631
+ background-color: var(--necto-x-bg-active, ${$s});
632
+ }
633
+
634
+ &:focus-visible {
635
+ box-shadow: 0 0 0 3px var(--necto-x-focus-shadow, ${As});
636
+ }
395
637
 
638
+ ${t=>t.$disabled&&`
396
639
  &:hover,
397
640
  &:active {
398
- background-color: var(--necto-google-bg, ${oo});
641
+ background-color: var(--necto-x-bg, ${Bo});
399
642
  }
400
643
  `}
401
- `,ro=Kt(({as:o,asChild:t,children:s="Continue with Google",iconPosition:n="left",showIcon:r=!0,iconSize:i=20,disabled:e,className:a,...p},c)=>to(jt,{as:o,ref:c,asChild:t,showIcon:r,disabled:e,$disabled:e,className:zt(`_necto:${eo}`,a),iconPosition:n,icon:to(Wt,{size:i}),...p,children:s}));ro.displayName=eo;export{_ as AppleButton,T as AtlassianButton,$ as BitbucketButton,D as DiscordButton,M as DropboxButton,B as Else,K as FacebookButton,q as GitHubButton,j as GitLabButton,ro as GoogleButton,u as If,g as Primitive};
644
+ `,_o=ws(({as:t,asChild:o,children:r="Continue with X",iconPosition:s="left",showIcon:n=!0,iconSize:i=20,disabled:e,className:a,...l},c)=>Oo(Fs,{as:t,ref:c,asChild:o,showIcon:n,disabled:e,$disabled:e,className:Ts(`_necto:${Ro}`,a),iconPosition:s,icon:Oo(xs,{size:i}),...l,children:r}));_o.displayName=Ro;export{$ as AppleButton,M as AtlassianButton,D as BitbucketButton,z as DiscordButton,Z as DropboxButton,y as Else,j as FacebookButton,rt as GitHubButton,ct as GitLabButton,dt as GoogleButton,gt as HubSpotButton,_t as HuggingFaceButton,O as If,Ct as LinkedInButton,xt as MetaMaskButton,Ft as MicrosoftButton,It as NotionButton,Ut as OKXButton,E as Primitive,Vt as SalesforceButton,qt as SlackButton,eo as SnapchatButton,io as SpotifyButton,po as TikTokButton,go as TwitchButton,_o as XButton};
402
645
  //# sourceMappingURL=index.js.map