@yahoo/uds 1.3.4 → 1.4.1

package/cli/preload.ts

@@ -51,6 +51,7 @@ mock.module('googleapis', () => ({
       OAuth2: mock(() => {}).mockImplementation(() => ({
         getToken: () => Promise.resolve({ tokens: 'test' }),
         setCredentials: mock(() => {}),
+        generateAuthUrl: mock(() => 'https://accounts.google.com/o/oauth2/v2/auth'),
       })),
     },
     oauth2: () => ({

package/cli/utils/auth.test.ts

@@ -6,11 +6,15 @@ import http from 'http';
 import httpMocks from 'node-mocks-http';
 
 import {
+  configuratorUrlOrigin,
   getAuthenticatedUser,
+  getAuthorizeUrl,
   isYahooEmployee,
   login,
+  type LoginProvider,
   logout,
-  onRequestHandler,
+  onGETHandler,
+  onPostHandler,
   type User,
 } from './auth';
 
@@ -29,6 +33,22 @@ describe('auth', () => {
     });
   });
 
+  describe('getAuthorizeUrl', () => {
+    it('uses configurator by default', () => {
+      expect(getAuthorizeUrl()).toEqual(
+        `${configuratorUrlOrigin}/login?continue=http://localhost:3000/oauth2callback`,
+      );
+    });
+
+    it('generates the google auth url for other providers', () => {
+      (['google', 'firebase'] as LoginProvider[]).forEach((provider) => {
+        expect(getAuthorizeUrl(provider)).toStartWith(
+          `https://accounts.google.com/o/oauth2/v2/auth`,
+        );
+      });
+    });
+  });
+
   describe('getAuthenticatedUser', () => {
     it('does not return a user on first use', async () => {
       expect(await getAuthenticatedUser(__dirname)).toBeUndefined();
@@ -72,7 +92,7 @@ describe('auth', () => {
 
       const request = httpMocks.createRequest({ method: 'GET', url: '/oauth2callback' });
       const response = httpMocks.createResponse();
-      await onRequestHandler.bind(mockServer)(request, response, resolve, reject);
+      await onGETHandler.bind(mockServer)(request, response, resolve, reject);
       expect(response._getData()).toInclude('no code parameter');
     });
 
@@ -82,13 +102,75 @@ describe('auth', () => {
 
       const request = httpMocks.createRequest({ method: 'GET', url: '/oauth2callback?code=123' });
       const response = httpMocks.createResponse();
-      await onRequestHandler.bind(mockServer)(request, response, resolve, reject);
+      await onGETHandler.bind(mockServer)(request, response, resolve, reject);
       expect(response._getData()).toInclude('Authentication successful! Please close this window.');
       expect(resolve).toHaveBeenCalledWith(mockUser);
       expect(reject).not.toHaveBeenCalled();
     });
   });
 
+  describe('onPostHandler', () => {
+    const mockServer = Object.assign(Object.create(http.Server.prototype), {
+      listen: mock(),
+      on: mock(),
+      close: mock(),
+    });
+
+    it('ignores non-POST requests', () => {
+      const req = httpMocks.createRequest({ method: 'GET' });
+      const resp = httpMocks.createResponse();
+      onPostHandler.bind(mockServer)(req, resp, mock(), mock());
+      expect(resp._getStatusCode()).toBe(405);
+      expect(resp._getData()).toInclude('Method Not Allowed');
+    });
+
+    it('rejects requests from 3rd party origins', () => {
+      const req = httpMocks.createRequest({
+        method: 'POST',
+        headers: { origin: 'https://bad.com' },
+      });
+      const resp = httpMocks.createResponse();
+      const reject = mock();
+      onPostHandler.bind(mockServer)(req, resp, mock(), reject);
+      expect(reject).toHaveBeenCalledWith('Request origin not allowed.');
+    });
+
+    it('sets CORS headers', () => {
+      const req = httpMocks.createRequest({
+        method: 'POST',
+        headers: { origin: configuratorUrlOrigin },
+        // body: JSON.stringify({ email: ''}),
+      });
+      const resp = httpMocks.createResponse();
+      const resolve = mock();
+      const reject = mock();
+      onPostHandler.bind(mockServer)(req, resp, resolve, reject);
+      expect(resp.getHeaders()).toEqual({
+        'access-control-allow-origin': configuratorUrlOrigin,
+        'access-control-allow-methods': 'OPTIONS, GET, POST',
+      });
+    });
+
+    it('sends a user obj', async () => {
+      const mockUser = { email: 'foo@yahooinc.com', displayName: 'Foo' };
+
+      const req = httpMocks.createRequest({
+        method: 'POST',
+        headers: { origin: configuratorUrlOrigin },
+      });
+      const resp = httpMocks.createResponse({
+        eventEmitter: (await import('events')).EventEmitter,
+      });
+      const resolve = mock();
+      const reject = mock();
+      onPostHandler.bind(mockServer)(req, resp, resolve, reject);
+      req.send(mockUser);
+      expect(resp._getData()).toInclude('Authentication successful! Please close this window.');
+      expect(reject).not.toHaveBeenCalled();
+      expect(resolve).toHaveBeenCalledWith(mockUser);
+    });
+  });
+
   describe('logout', () => {
     it('removes the user cache', async () => {
       await writeCache(filepath, { email: 'user@yahooinc.com', name: 'User' });

package/cli/utils/auth.ts

@@ -17,15 +17,23 @@ import open from 'open';
 
 import clientSecrets from './client_secrets.json';
 
+type User = oauth2_v2.Schema$Userinfo | FirebaseUser;
+type LoginProvider = 'google' | 'firebase' | 'configurator';
+
+const LOGIN_PROVIDER: LoginProvider =
+  (process.env.LOGIN_PROVIDER as LoginProvider) ?? 'configurator';
+
 const REDIRECT_URL = clientSecrets.web.redirect_uris[0];
-const { port: PORT, origin: BASE_URL } = new URL(REDIRECT_URL);
+const { port: PORT, origin: SERVER_ORIGIN } = new URL(REDIRECT_URL);
+
+const configuratorUrlOrigin =
+  process.env.NODE_ENV === 'production' ? 'https://config.uds.build' : 'http://localhost:4001';
 
 const CACHE_FILEPATH = '.uds/user.json';
 const DEFAULT_CLI_PATH = path.resolve(import.meta.dir, '..');
 const CACHED_USER_FILE = path.resolve(DEFAULT_CLI_PATH, CACHE_FILEPATH);
 
 const isEmulator = process.env.EMULATOR || process.env.NEXT_PUBLIC_EMULATOR;
-const loginProvider = process.env.LOGIN_PROVIDER ?? 'firebase';
 
 // TODO: consolidate with the firebase config and setup in database/firebase.ts
 const firebaseConfig = !isEmulator
@@ -50,13 +58,72 @@ const oauth2Client = new google.auth.OAuth2(
   REDIRECT_URL,
 );
 
-type User = oauth2_v2.Schema$Userinfo | FirebaseUser;
-
 function isYahooEmployee(user?: User) {
   return user?.email?.endsWith('@yahooinc.com');
 }
 
-async function onRequestHandler(
+function getAuthorizeUrl(loginProvider = LOGIN_PROVIDER) {
+  if (loginProvider === 'configurator') {
+    return `${configuratorUrlOrigin}/login?continue=${REDIRECT_URL}`;
+  }
+
+  return oauth2Client.generateAuthUrl({
+    access_type: 'offline',
+    scope: [
+      'https://www.googleapis.com/auth/userinfo.profile',
+      'https://www.googleapis.com/auth/userinfo.email',
+    ].join(' '),
+    hd: 'yahooinc.com',
+    include_granted_scopes: true,
+  });
+}
+
+function onPostHandler(
+  this: http.Server,
+  req: http.IncomingMessage,
+  res: http.ServerResponse,
+  resolve: (user: User) => void,
+  reject: (reason?: unknown) => void,
+) {
+  if (req.method !== 'POST') {
+    res.writeHead(405, { Allow: 'POST' }); // Set the 405 status and Allow header
+    res.end('Method Not Allowed');
+    reject('Method Not Allowed');
+    return;
+  }
+
+  if (req.headers.origin !== configuratorUrlOrigin) {
+    reject(`Request origin not allowed.`);
+    return;
+  }
+
+  res.setHeader('Access-Control-Allow-Origin', configuratorUrlOrigin);
+  res.setHeader('Access-Control-Allow-Methods', 'OPTIONS, GET, POST');
+
+  let data = '';
+
+  req.on('data', (chunk) => {
+    data += chunk.toString();
+  });
+
+  req.on('error', (err: NodeJS.ErrnoException) => {
+    reject(err);
+  });
+
+  req.on('end', () => {
+    try {
+      const user: FirebaseUser = JSON.parse(data);
+      res.end('Authentication successful! Please close this window.');
+      resolve(user);
+    } catch (err) {
+      reject(err);
+    } finally {
+      this.close();
+    }
+  });
+}
+
+async function onGETHandler(
   this: http.Server,
   req: http.IncomingMessage,
   res: http.ServerResponse,
@@ -64,7 +131,7 @@ async function onRequestHandler(
   reject: (reason?: unknown) => void,
 ) {
   try {
-    const code = new URL(req.url || '', BASE_URL).searchParams.get('code');
+    const code = new URL(req.url || '', SERVER_ORIGIN).searchParams.get('code');
     if (!code) {
       res.end('There was no code parameter on the url.');
       this.close();
@@ -72,7 +139,6 @@ async function onRequestHandler(
     }
 
     res.end('Authentication successful! Please close this window.');
-
     this.close();
 
     const { tokens } = await oauth2Client.getToken(code);
@@ -80,7 +146,7 @@ async function onRequestHandler(
 
     let user: User;
 
-    if (loginProvider === 'firebase') {
+    if (LOGIN_PROVIDER === 'firebase') {
       // Build Firebase credential using the Google ID token.
       const credential = GoogleAuthProvider.credential(tokens.id_token);
       user = (await signInWithCredential(auth, credential)).user;
@@ -102,34 +168,39 @@ async function onRequestHandler(
  */
 async function authenticateUser(): Promise<User> {
   return new Promise((resolve, reject) => {
-    const authorizeUrl = oauth2Client.generateAuthUrl({
-      access_type: 'offline',
-      scope: [
-        'https://www.googleapis.com/auth/userinfo.profile',
-        'https://www.googleapis.com/auth/userinfo.email',
-      ].join(' '),
-      hd: 'yahooinc.com',
-      include_granted_scopes: true,
-    });
-
     // TODO: If port (3000) is already in use, this will fail.
     // Setup https://www.npmjs.com/package/find-free-ports, but that won't
     // play well with the pre-configured redirect_uris in the Google Cloud Console.
-    const server = http
-      .createServer()
-      .listen(PORT, async () => {
-        const childProcess = await open(authorizeUrl, { wait: false });
-        childProcess.unref();
-      })
-      .on('request', (req, res) => onRequestHandler.call(server, req, res, resolve, reject))
-      .on('error', (err: NodeJS.ErrnoException) => {
-        if (err.code && err.code.includes('EADDRINUSE')) {
-          print(
-            red(`🚨 Port ${PORT} already in use. Cannot start local server to handle OAuth flow.`),
-          );
-          server.close();
-        }
+    const server = http.createServer();
+
+    server.listen(PORT, async () => {
+      const authorizeUrl = getAuthorizeUrl();
+
+      print(`Please visit the following URL if it didn't open automatically:\n${authorizeUrl}`);
+
+      const childProcess = await open(authorizeUrl, { wait: false });
+      childProcess.unref();
+
+      process.on('SIGINT', () => {
+        server.close();
+        reject('Received SIGINT.');
       });
+    });
+
+    server.on('error', (err: NodeJS.ErrnoException) => {
+      if (err.code && err.code.includes('EADDRINUSE')) {
+        print(
+          red(`🚨 Port ${PORT} already in use. Cannot start local server to handle OAuth flow.`),
+        );
+        server.close();
+      }
+    });
+
+    if (LOGIN_PROVIDER === 'configurator') {
+      server.on('request', (req, res) => onPostHandler.call(server, req, res, resolve, reject));
+    } else {
+      server.on('request', (req, res) => onGETHandler.call(server, req, res, resolve, reject));
+    }
   });
 }
 
@@ -157,6 +228,7 @@ async function login() {
       await Bun.write(CACHED_USER_FILE, JSON.stringify(user, null, 2));
     } catch (err) {
       console.error('Error:', err);
+      throw err;
     }
   }
 
@@ -193,10 +265,14 @@ async function getAuthenticatedUser(cliPath = DEFAULT_CLI_PATH): Promise<User |
 
 export {
   authenticateUser,
+  configuratorUrlOrigin,
   getAuthenticatedUser,
+  getAuthorizeUrl,
   isYahooEmployee,
   login,
+  type LoginProvider,
   logout,
-  onRequestHandler,
+  onGETHandler,
+  onPostHandler,
   type User,
 };

package/dist/{chunk-WASU57GH.cjs → chunk-E6AO57LK.cjs}

@@ -1 +1 @@
-"use strict";var e=require("./chunk-WLOEKYUI.cjs"),r=require("./chunk-LNFRMD6G.cjs"),t=require("@yahoo/uds/fixtures"),n=require("clsx"),s=require("imurmurhash"),o=require("tailwind-merge"),l=require("react"),i=require("react/jsx-runtime");function a(e){return e&&e.__esModule?e:{default:e}}var c=a(n),u=a(s),d="undefined"!=typeof process,f={useGetStylesCache:!!d&&"true"===process.env.NEXT_PUBLIC_UDS_FEATURE_USE_STYLE_CACHE,useCLIAuth:!!d&&"true"===process.env.UDS_FEATURE_ENABLE_CLI_AUTH},h=()=>f;function p(e){return"boolean"==typeof e?`${e}`:0===e?"0":e}function m(e){const r=Object.create(null),t=Object.keys(e);for(let n=0,s=t.length;n<s;n++){const s=t[n];void 0!==e[s]&&(r[s]=e[s])}return r}var x=o.extendTailwindMerge({extend:{theme:{borderColor:t.lineColors,borderWidth:t.borderWidths,borderRadius:t.borderRadii}},override:{classGroups:{"text-color":[{text:[...t.foregroundColors,...t.spectrumColors]}],"bg-color":[{bg:t.backgroundColors}],"font-family":[{font:["icons",...t.textVariants]}],leading:[{leading:t.textVariants}]},conflictingClassGroups:{}}}),g=(...e)=>{const r=c.default(e);return x(r)},y=e=>r=>{if(!e?.variants)return g(e?.base,r?.className);const{variants:t,defaultVariants:n}=e,s=Object.keys(t).map((e=>{const s=r?.[e],o=n?.[e],l=p(s)||p(o);return t[e][l]})),o={...n,...r&&m(r)},l=e?.compoundVariants?.reduce(((e,{className:r,...t})=>Object.entries(t).every((([e,r])=>o[e]===r))?g(e,r):e),"");return g(e?.base,s,l,r?.className)},v=y({variants:r.variants}),C=new Map,b=e=>{const{useGetStylesCache:r}=h();if(r){const r=function(e){const r=Object.create(null),t=Object.keys(e).sort();for(let n=0,s=t.length;n<s;n++){const s=t[n];r[s]=e[s]}return r}(m(e)),t=(new u.default).hash(JSON.stringify(r)).result();if(C.has(t))return C.get(t);const n=v(r);return C.set(t,n),n}return v(e)},E=l.forwardRef((function({name:r,size:t="md",variant:n="outline",color:s="primary",className:o,...l},a){const c=b({color:s,className:o}),u=e.normalIconSizes[t];return i.jsx("svg",{ref:a,xmlns:"http://www.w3.org/2000/svg",width:u,height:u,viewBox:`0 0 ${u} ${u}`,"aria-hidden":"true",focusable:"false",className:c,...l,children:i.jsx(r,{size:t,variant:n})})}));function j(...e){return r=>e.forEach((e=>function(e,r){"function"==typeof e?e(r):null!=e&&(e.current=r)}(e,r)))}exports.Icon=E,exports.createSlot=function(){const e=l.forwardRef(((e,t)=>{const{children:s,...o}=e,a=l.Children.toArray(s),c=a.find(n);if(c){const e=c.props.children,n=a.map((r=>r===c?l.Children.count(e)>1?l.Children.only(null):l.isValidElement(e)?e.props.children:null:r));return i.jsx(r,{...o,ref:t,children:l.isValidElement(e)?l.cloneElement(e,void 0,n):null})}return i.jsx(r,{...o,ref:t,children:s})}));e.displayName="Slot";const r=l.forwardRef(((e,r)=>{const{children:t,...n}=e;return l.isValidElement(t)?l.cloneElement(t,{...s(n,t.props),ref:r?j(r,t.ref):t.ref}):l.Children.count(t)>1?l.Children.only(null):null}));r.displayName="SlotClone";const t=({children:e})=>e;function n(e){return l.isValidElement(e)&&e.type===t}function s(e,r){const t={...r};for(const n in r){const s=e[n],o=r[n];/^on[A-Z]/.test(n)?s&&o?t[n]=(...e)=>{o(...e),s(...e)}:s&&(t[n]=s):"style"===n&&(t[n]={...s,...o})}return{...e,...t}}return e},exports.cva=y,exports.cx=g,exports.getFeatureFlags=h,exports.getStyles=b,exports.updateFeatureFlags=e=>f={...f,...e};
+"use strict";var e=require("./chunk-WLOEKYUI.cjs"),r=require("./chunk-LNFRMD6G.cjs"),t=require("@yahoo/uds/fixtures"),n=require("clsx"),s=require("imurmurhash"),o=require("tailwind-merge"),l=require("react"),i=require("react/jsx-runtime");function a(e){return e&&e.__esModule?e:{default:e}}var c=a(n),u=a(s),d="undefined"!=typeof process,f={useGetStylesCache:!!d&&"true"===process.env.NEXT_PUBLIC_UDS_FEATURE_USE_STYLE_CACHE,useCLIAuth:!!d&&"true"===process.env.UDS_FEATURE_ENABLE_CLI_AUTH},h=()=>f;function p(e){return"boolean"==typeof e?`${e}`:0===e?"0":e}function m(e){const r=Object.create(null),t=Object.keys(e);for(let n=0,s=t.length;n<s;n++){const s=t[n];void 0!==e[s]&&(r[s]=e[s])}return r}var x=o.extendTailwindMerge({extend:{theme:{borderColor:t.lineColors,borderWidth:t.borderWidths,borderRadius:t.borderRadii}},override:{classGroups:{"text-color":[{text:[...t.foregroundColors,...t.spectrumColors]}],"bg-color":[{bg:t.backgroundColors}],"font-family":[{font:["icons",...t.textVariants]}],leading:[{leading:t.textVariants}]},conflictingClassGroups:{}}}),g=(...e)=>{const r=c.default(e);return x(r)},y=e=>r=>{if(!e?.variants)return g(e?.base,r?.className);const{variants:t,defaultVariants:n}=e,s=Object.keys(t).map((e=>{const s=r?.[e],o=n?.[e],l=p(s)||p(o);return t[e][l]})),o={...n,...r&&m(r)},l=e?.compoundVariants?.reduce(((e,{className:r,...t})=>Object.entries(t).every((([e,r])=>o[e]===r))?g(e,r):e),"");return g(e?.base,s,l,r?.className)},v=y({variants:r.variants}),C=new Map,b=e=>{const{useGetStylesCache:r}=h();if(r){const r=function(e){const r=Object.create(null),t=Object.keys(e).sort();for(let n=0,s=t.length;n<s;n++){const s=t[n];r[s]=e[s]}return r}(m(e)),t=(new u.default).hash(JSON.stringify(r)).result();if(C.has(t))return C.get(t);const n=v(r);return C.set(t,n),n}return v(e)},E=l.forwardRef((function({name:r,size:t="md",variant:n="outline",color:s="primary",className:o,...l},a){const c=b({color:s,flex:"none",className:o}),u=e.normalIconSizes[t];return i.jsx("svg",{ref:a,xmlns:"http://www.w3.org/2000/svg",width:u,height:u,viewBox:`0 0 ${u} ${u}`,"aria-hidden":"true",focusable:"false",className:c,...l,children:i.jsx(r,{size:t,variant:n})})}));function j(...e){return r=>e.forEach((e=>function(e,r){"function"==typeof e?e(r):null!=e&&(e.current=r)}(e,r)))}exports.Icon=E,exports.createSlot=function(){const e=l.forwardRef(((e,t)=>{const{children:s,...o}=e,a=l.Children.toArray(s),c=a.find(n);if(c){const e=c.props.children,n=a.map((r=>r===c?l.Children.count(e)>1?l.Children.only(null):l.isValidElement(e)?e.props.children:null:r));return i.jsx(r,{...o,ref:t,children:l.isValidElement(e)?l.cloneElement(e,void 0,n):null})}return i.jsx(r,{...o,ref:t,children:s})}));e.displayName="Slot";const r=l.forwardRef(((e,r)=>{const{children:t,...n}=e;return l.isValidElement(t)?l.cloneElement(t,{...s(n,t.props),ref:r?j(r,t.ref):t.ref}):l.Children.count(t)>1?l.Children.only(null):null}));r.displayName="SlotClone";const t=({children:e})=>e;function n(e){return l.isValidElement(e)&&e.type===t}function s(e,r){const t={...r};for(const n in r){const s=e[n],o=r[n];/^on[A-Z]/.test(n)?s&&o?t[n]=(...e)=>{o(...e),s(...e)}:s&&(t[n]=s):"style"===n&&(t[n]={...s,...o})}return{...e,...t}}return e},exports.cva=y,exports.cx=g,exports.getFeatureFlags=h,exports.getStyles=b,exports.updateFeatureFlags=e=>f={...f,...e};

package/dist/chunk-VADOXPF5.js

@@ -0,0 +1,3 @@
+import{normalIconSizes as e}from"./chunk-YRYDHL65.js";import{variants as r}from"./chunk-RGE634O5.js";import{lineColors as t,borderWidths as n,borderRadii as o,foregroundColors as s,spectrumColors as c,backgroundColors as i,textVariants as l}from"@yahoo/uds/fixtures";import a from"clsx";import u from"imurmurhash";import{extendTailwindMerge as f}from"tailwind-merge";import{forwardRef as m,Children as d,isValidElement as p,cloneElement as h}from"react";import{jsx as y}from"react/jsx-runtime";
+/*! © 2024 Yahoo, Inc. UDS v0.0.0-development */
+var v="undefined"!=typeof process,b={useGetStylesCache:!!v&&"true"===process.env.NEXT_PUBLIC_UDS_FEATURE_USE_STYLE_CACHE,useCLIAuth:!!v&&"true"===process.env.UDS_FEATURE_ENABLE_CLI_AUTH},g=e=>b={...b,...e},E=()=>b;function N(e){return"boolean"==typeof e?`${e}`:0===e?"0":e}function x(e){const r=Object.create(null),t=Object.keys(e);for(let n=0,o=t.length;n<o;n++){const o=t[n];void 0!==e[o]&&(r[o]=e[o])}return r}var C=f({extend:{theme:{borderColor:t,borderWidth:n,borderRadius:o}},override:{classGroups:{"text-color":[{text:[...s,...c]}],"bg-color":[{bg:i}],"font-family":[{font:["icons",...l]}],leading:[{leading:l}]},conflictingClassGroups:{}}}),_=(...e)=>{const r=a(e);return C(r)},j=e=>r=>{if(!e?.variants)return _(e?.base,r?.className);const{variants:t,defaultVariants:n}=e,o=Object.keys(t).map((e=>{const o=r?.[e],s=n?.[e],c=N(o)||N(s);return t[e][c]})),s={...n,...r&&x(r)},c=e?.compoundVariants?.reduce(((e,{className:r,...t})=>Object.entries(t).every((([e,r])=>s[e]===r))?_(e,r):e),"");return _(e?.base,o,c,r?.className)},w=j({variants:r}),S=new Map,A=e=>{const{useGetStylesCache:r}=E();if(r){const r=function(e){const r=Object.create(null),t=Object.keys(e).sort();for(let n=0,o=t.length;n<o;n++){const o=t[n];r[o]=e[o]}return r}(x(e)),t=(new u).hash(JSON.stringify(r)).result();if(S.has(t))return S.get(t);const n=w(r);return S.set(t,n),n}return w(e)},O=m((function({name:r,size:t="md",variant:n="outline",color:o="primary",className:s,...c},i){const l=A({color:o,flex:"none",className:s}),a=e[t];return y("svg",{ref:i,xmlns:"http://www.w3.org/2000/svg",width:a,height:a,viewBox:`0 0 ${a} ${a}`,"aria-hidden":"true",focusable:"false",className:l,...c,children:y(r,{size:t,variant:n})})}));function U(...e){return r=>e.forEach((e=>function(e,r){"function"==typeof e?e(r):null!=e&&(e.current=r)}(e,r)))}function L(){const e=m(((e,t)=>{const{children:o,...s}=e,c=d.toArray(o),i=c.find(n);if(i){const e=i.props.children,n=c.map((r=>r===i?d.count(e)>1?d.only(null):p(e)?e.props.children:null:r));return y(r,{...s,ref:t,children:p(e)?h(e,void 0,n):null})}return y(r,{...s,ref:t,children:o})}));e.displayName="Slot";const r=m(((e,r)=>{const{children:t,...n}=e;return p(t)?h(t,{...o(n,t.props),ref:r?U(r,t.ref):t.ref}):d.count(t)>1?d.only(null):null}));r.displayName="SlotClone";const t=({children:e})=>e;function n(e){return p(e)&&e.type===t}function o(e,r){const t={...r};for(const n in r){const o=e[n],s=r[n];/^on[A-Z]/.test(n)?o&&s?t[n]=(...e)=>{s(...e),o(...e)}:o&&(t[n]=o):"style"===n&&(t[n]={...o,...s})}return{...e,...t}}return e}export{O as Icon,L as createSlot,j as cva,_ as cx,E as getFeatureFlags,A as getStyles,g as updateFeatureFlags};

package/dist/client/index.cjs

@@ -1,4 +1,4 @@
 "use client";
-"use strict";var e=require("../chunk-WASU57GH.cjs"),t=require("../chunk-PECN66KD.cjs"),n=require("../chunk-WLOEKYUI.cjs"),a=require("../chunk-J6D4HCFT.cjs"),i=require("@yahoo/uds/fixtures"),o=require("react/jsx-runtime"),s=require("framer-motion"),r=require("react"),c={scale:.7,opacity:0},l={scale:[.7,.7,1],opacity:[0,0,1],transition:{times:[0,.5,1]}},u={icon:l,hide:c,loading:c},d={loading:l,hide:c,icon:c},m=`var(${a.BUTTON_CSS_VAR_MAP.columnGap})`,h=`var(${a.BUTTON_CSS_VAR_MAP.iconSize})`,p={rest:{scale:`var(${a.BUTTON_CSS_VAR_MAP.effects.scale.rest})`},hover:{scale:`var(${a.BUTTON_CSS_VAR_MAP.effects.scale.hover})`},pressed:{scale:`var(${a.BUTTON_CSS_VAR_MAP.effects.scale.pressed})`},withoutIcon:{columnGap:"0px"},withIcon:{columnGap:m}},g={withoutIcon:{marginLeft:0},withIcon:{marginLeft:`calc(${m} * -1)`}},f={hide:{width:"0px",opacity:0,display:"none"},loading:{width:h,display:"flex",opacity:1},icon:{width:h,display:"flex",opacity:1}},x=({size:e,variant:t})=>{if("outline"===t)switch(e){case"sm":return o.jsx(o.Fragment,{children:o.jsx("path",{fill:"currentColor",d:"M7.9 2.7a5.2 5.2 0 1 0 5.2 5.2h1.6a6.8 6.8 0 1 1-6.8-6.8.8.8 0 1 1 0 1.6"})});case"md":return o.jsx(o.Fragment,{children:o.jsx("path",{fill:"currentColor",d:"M12 4a8 8 0 1 0 8 8h2c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2a1 1 0 1 1 0 2"})});case"lg":return o.jsx(o.Fragment,{children:o.jsx("path",{fill:"currentColor",d:"M16.15 4.3C9.605 4.3 4.3 9.605 4.3 16.15S9.605 28 16.15 28 28 22.695 28 16.15h2.3c0 7.815-6.335 14.15-14.15 14.15S2 23.965 2 16.15 8.335 2 16.15 2a1.15 1.15 0 0 1 0 2.3"})})}if("fill"===t)switch(e){case"sm":return o.jsx(o.Fragment,{children:o.jsx("path",{fill:"currentColor",d:"M8 2.9A5.1 5.1 0 1 0 13.1 8h1.8A6.9 6.9 0 1 1 8 1.1a.9.9 0 1 1 0 1.8"})});case"md":return o.jsx(o.Fragment,{children:o.jsx("path",{fill:"currentColor",d:"M12.15 4.3A7.85 7.85 0 1 0 20 12.15h2.3c0 5.606-4.544 10.15-10.15 10.15S2 17.756 2 12.15 6.544 2 12.15 2a1.15 1.15 0 0 1 0 2.3"})});case"lg":return o.jsx(o.Fragment,{children:o.jsx("path",{fill:"currentColor",d:"M16.35 4.7C9.916 4.7 4.7 9.916 4.7 16.35S9.916 28 16.35 28 28 22.784 28 16.35h2.7c0 7.925-6.425 14.35-14.35 14.35S2 24.275 2 16.35 8.425 2 16.35 2a1.35 1.35 0 1 1 0 2.7"})})}return o.jsx(o.Fragment,{})},v=()=>import("../motionFeatures-THWWLQYC.cjs").then((({domAnimation:e})=>e));function j({reducedMotion:e="user",children:a,layoutVariant:i="subtle",layoutSpeed:c="3",colorVariant:l="smooth",colorSpeed:u="3"}){const d=n.motion[i][c],m=n.motion[l][u],[h,p]=r.useState(d),[g,f]=r.useState(m),x={variant:l,speed:u},j=t.getMotionVar({...x,control:"stiffness"}),b=t.getMotionVar({...x,control:"damping"}),S={variant:i,speed:c},y=t.getMotionVar({...S,control:"stiffness"}),M=t.getMotionVar({...S,control:"damping"});r.useEffect((()=>{const e=getComputedStyle(document.documentElement),t={damping:Number(e.getPropertyValue(M)),stiffness:Number(e.getPropertyValue(y))},n={damping:Number(e.getPropertyValue(b)),stiffness:Number(e.getPropertyValue(j))};p(t),f(n)}),[b,j,M,y]);const I=r.useMemo((()=>({type:"spring",mass:1,...h,layout:h,opacity:g,color:g,borderColor:g,backgroundColor:g})),[g,h]);return o.jsx(s.LazyMotion,{features:v,strict:!0,children:o.jsx(s.MotionConfig,{transition:I,reducedMotion:e,children:a})})}var b=e.createSlot(),S=s.m.create(b,{forwardMotionProps:!0}),y=r.forwardRef((function({palette:t,variant:n,size:a,startIcon:c,endIcon:l,iconVariant:m,loading:h,disableEffects:v,children:b,asChild:y,className:M,...I},C){const w=r.useRef(null);r.useImperativeHandle(C,(()=>w.current));const N=l?"icon":"hide",V=(({startIcon:e,endIcon:t,loading:n})=>e||t||n?"withIcon":"withoutIcon")({startIcon:c,endIcon:l,loading:h}),A=(({loading:e,startIcon:t})=>e?"loading":t?"icon":"hide")({loading:h,startIcon:c}),z={button:e.getStyles({buttonSize:a,buttonVariant:n,buttonPalette:t,className:e.cx("uds-button","uds-ring","uds-hit-target",h&&"uds-button-loading",v&&"uds-button-without-effects","withIcon"===V&&"uds-button-with-gap",M)}),iconContainer:"uds-button-icon-container flex overflow-hidden",loading:"uds-button-icon start-content animate-spin",start:"uds-button-icon start-content",end:"uds-button-icon end-content",spacer:"uds-button-spacer"},P=s.useReducedMotion()?"smooth":"subtle",T=r.useMemo((()=>o.jsx(s.m.span,{className:z.iconContainer,initial:!1,variants:f,animate:A,children:o.jsxs(s.AnimatePresence,{initial:!1,mode:"popLayout",children:[h&&o.jsx(s.m.span,{variants:d,initial:"hide",animate:"loading",exit:"hide",children:o.jsx(e.Icon,{size:i.buttonIconSvgSize,name:x,variant:m,color:"current",className:z.loading})},"loading"),c&&!h&&o.jsx(s.m.span,{variants:u,initial:"hide",animate:"icon",exit:"hide",children:o.jsx(e.Icon,{size:i.buttonIconSvgSize,name:c,variant:m,color:"current",className:z.start})},c.name)]})})),[z.iconContainer,z.loading,z.start,A,h,m,c]),_=r.useMemo((()=>o.jsx(s.m.span,{className:z.iconContainer,initial:!1,variants:f,animate:N,children:o.jsx(s.AnimatePresence,{initial:!1,mode:"popLayout",children:l&&o.jsx(s.m.span,{variants:u,initial:"hide",animate:"icon",exit:"hide",children:o.jsx(e.Icon,{size:i.buttonIconSvgSize,name:l,variant:m,color:"current",className:z.start})},l.name)})})),[z.iconContainer,z.start,l,N,m]),R=r.useMemo((()=>v?{...p,rest:{},hover:{},pressed:{}}:p),[v]);return y&&r.isValidElement(b)?o.jsx(j,{layoutSpeed:"3",layoutVariant:P,children:o.jsx(S,{className:z.button,initial:["hide",V],animate:V,variants:R,whileHover:"hover",whileTap:"pressed",...I,children:r.cloneElement(b,b.props,o.jsxs(o.Fragment,{children:[T,b.props.children,_,o.jsx(s.m.span,{className:z.spacer,variants:g,initial:!1,animate:V})]}))})}):o.jsx(j,{layoutSpeed:"3",layoutVariant:P,children:o.jsxs(s.m.button,{ref:w,className:z.button,initial:["hide",V],animate:V,variants:R,whileHover:"hover",whileTap:"pressed",...I,children:[T,b,_,o.jsx(s.m.span,{className:z.spacer,variants:g,initial:!1,animate:V})]})})})),M=r.forwardRef((function({palette:t,variant:n,size:a,iconVariant:c,loading:l,disableEffects:m,name:h,className:g,...f},v){const b=r.useRef(null);r.useImperativeHandle(v,(()=>b.current));const S=r.useMemo((()=>({button:e.getStyles({buttonVariant:n,buttonPalette:t,iconButtonSize:a,className:e.cx("uds-icon-button","uds-button","uds-ring","uds-hit-target",l&&"uds-button-loading",m&&"uds-button-without-effects",g)}),loading:"uds-button-icon start-content animate-spin",icon:"uds-button-icon start-content"})),[t,n,g,m,a,l]),y=s.useReducedMotion(),M=r.useMemo((()=>y?"smooth":"subtle"),[y]),I=r.useMemo((()=>m?{...p,rest:{},hover:{},pressed:{}}:p),[m]);return o.jsx(j,{layoutSpeed:"3",layoutVariant:M,reducedMotion:m?"always":"user",children:o.jsx(s.m.button,{ref:b,className:S.button,initial:"icon",variants:I,whileHover:"hover",whileTap:"pressed",...f,children:o.jsxs(s.AnimatePresence,{initial:!1,mode:"popLayout",children:[l&&o.jsx(s.m.span,{variants:d,initial:"loading",animate:"loading",exit:"hide",children:o.jsx(e.Icon,{size:i.buttonIconSvgSize,name:x,variant:c,color:"current",className:S.loading})},"loading"),h&&!l&&o.jsx(s.m.span,{variants:u,initial:"icon",animate:"icon",exit:"hide",children:o.jsx(e.Icon,{size:i.buttonIconSvgSize,name:h,variant:c,color:"current",className:S.icon})},h.name)]})})})}));
+"use strict";var e=require("../chunk-E6AO57LK.cjs"),t=require("../chunk-PECN66KD.cjs"),n=require("../chunk-WLOEKYUI.cjs"),a=require("../chunk-J6D4HCFT.cjs"),i=require("@yahoo/uds/fixtures"),o=require("react/jsx-runtime"),s=require("framer-motion"),r=require("react"),c={scale:.7,opacity:0},l={scale:[.7,.7,1],opacity:[0,0,1],transition:{times:[0,.5,1]}},u={icon:l,hide:c,loading:c},d={loading:l,hide:c,icon:c},m=`var(${a.BUTTON_CSS_VAR_MAP.columnGap})`,h=`var(${a.BUTTON_CSS_VAR_MAP.iconSize})`,p={rest:{scale:`var(${a.BUTTON_CSS_VAR_MAP.effects.scale.rest})`},hover:{scale:`var(${a.BUTTON_CSS_VAR_MAP.effects.scale.hover})`},pressed:{scale:`var(${a.BUTTON_CSS_VAR_MAP.effects.scale.pressed})`},withoutIcon:{columnGap:"0px"},withIcon:{columnGap:m}},g={withoutIcon:{marginLeft:0},withIcon:{marginLeft:`calc(${m} * -1)`}},f={hide:{width:"0px",opacity:0,display:"none"},loading:{width:h,display:"flex",opacity:1},icon:{width:h,display:"flex",opacity:1}},x=({size:e,variant:t})=>{if("outline"===t)switch(e){case"sm":return o.jsx(o.Fragment,{children:o.jsx("path",{fill:"currentColor",d:"M7.9 2.7a5.2 5.2 0 1 0 5.2 5.2h1.6a6.8 6.8 0 1 1-6.8-6.8.8.8 0 1 1 0 1.6"})});case"md":return o.jsx(o.Fragment,{children:o.jsx("path",{fill:"currentColor",d:"M12 4a8 8 0 1 0 8 8h2c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2a1 1 0 1 1 0 2"})});case"lg":return o.jsx(o.Fragment,{children:o.jsx("path",{fill:"currentColor",d:"M16.15 4.3C9.605 4.3 4.3 9.605 4.3 16.15S9.605 28 16.15 28 28 22.695 28 16.15h2.3c0 7.815-6.335 14.15-14.15 14.15S2 23.965 2 16.15 8.335 2 16.15 2a1.15 1.15 0 0 1 0 2.3"})})}if("fill"===t)switch(e){case"sm":return o.jsx(o.Fragment,{children:o.jsx("path",{fill:"currentColor",d:"M8 2.9A5.1 5.1 0 1 0 13.1 8h1.8A6.9 6.9 0 1 1 8 1.1a.9.9 0 1 1 0 1.8"})});case"md":return o.jsx(o.Fragment,{children:o.jsx("path",{fill:"currentColor",d:"M12.15 4.3A7.85 7.85 0 1 0 20 12.15h2.3c0 5.606-4.544 10.15-10.15 10.15S2 17.756 2 12.15 6.544 2 12.15 2a1.15 1.15 0 0 1 0 2.3"})});case"lg":return o.jsx(o.Fragment,{children:o.jsx("path",{fill:"currentColor",d:"M16.35 4.7C9.916 4.7 4.7 9.916 4.7 16.35S9.916 28 16.35 28 28 22.784 28 16.35h2.7c0 7.925-6.425 14.35-14.35 14.35S2 24.275 2 16.35 8.425 2 16.35 2a1.35 1.35 0 1 1 0 2.7"})})}return o.jsx(o.Fragment,{})},v=()=>import("../motionFeatures-THWWLQYC.cjs").then((({domAnimation:e})=>e));function j({reducedMotion:e="user",children:a,layoutVariant:i="subtle",layoutSpeed:c="3",colorVariant:l="smooth",colorSpeed:u="3"}){const d=n.motion[i][c],m=n.motion[l][u],[h,p]=r.useState(d),[g,f]=r.useState(m),x={variant:l,speed:u},j=t.getMotionVar({...x,control:"stiffness"}),b=t.getMotionVar({...x,control:"damping"}),S={variant:i,speed:c},y=t.getMotionVar({...S,control:"stiffness"}),M=t.getMotionVar({...S,control:"damping"});r.useEffect((()=>{const e=getComputedStyle(document.documentElement),t={damping:Number(e.getPropertyValue(M)),stiffness:Number(e.getPropertyValue(y))},n={damping:Number(e.getPropertyValue(b)),stiffness:Number(e.getPropertyValue(j))};p(t),f(n)}),[b,j,M,y]);const I=r.useMemo((()=>({type:"spring",mass:1,...h,layout:h,opacity:g,color:g,borderColor:g,backgroundColor:g})),[g,h]);return o.jsx(s.LazyMotion,{features:v,strict:!0,children:o.jsx(s.MotionConfig,{transition:I,reducedMotion:e,children:a})})}var b=e.createSlot(),S=s.m.create(b,{forwardMotionProps:!0}),y=r.forwardRef((function({palette:t,variant:n,size:a,startIcon:c,endIcon:l,iconVariant:m,loading:h,disableEffects:v,children:b,asChild:y,className:M,...I},C){const w=r.useRef(null);r.useImperativeHandle(C,(()=>w.current));const N=l?"icon":"hide",V=(({startIcon:e,endIcon:t,loading:n})=>e||t||n?"withIcon":"withoutIcon")({startIcon:c,endIcon:l,loading:h}),A=(({loading:e,startIcon:t})=>e?"loading":t?"icon":"hide")({loading:h,startIcon:c}),z={button:e.getStyles({buttonSize:a,buttonVariant:n,buttonPalette:t,className:e.cx("uds-button","uds-ring","uds-hit-target",h&&"uds-button-loading",v&&"uds-button-without-effects","withIcon"===V&&"uds-button-with-gap",M)}),iconContainer:"uds-button-icon-container flex overflow-hidden",loading:"uds-button-icon start-content animate-spin",start:"uds-button-icon start-content",end:"uds-button-icon end-content",spacer:"uds-button-spacer"},P=s.useReducedMotion()?"smooth":"subtle",T=r.useMemo((()=>o.jsx(s.m.span,{className:z.iconContainer,initial:!1,variants:f,animate:A,children:o.jsxs(s.AnimatePresence,{initial:!1,mode:"popLayout",children:[h&&o.jsx(s.m.span,{variants:d,initial:"hide",animate:"loading",exit:"hide",children:o.jsx(e.Icon,{size:i.buttonIconSvgSize,name:x,variant:m,color:"current",className:z.loading})},"loading"),c&&!h&&o.jsx(s.m.span,{variants:u,initial:"hide",animate:"icon",exit:"hide",children:o.jsx(e.Icon,{size:i.buttonIconSvgSize,name:c,variant:m,color:"current",className:z.start})},c.name)]})})),[z.iconContainer,z.loading,z.start,A,h,m,c]),_=r.useMemo((()=>o.jsx(s.m.span,{className:z.iconContainer,initial:!1,variants:f,animate:N,children:o.jsx(s.AnimatePresence,{initial:!1,mode:"popLayout",children:l&&o.jsx(s.m.span,{variants:u,initial:"hide",animate:"icon",exit:"hide",children:o.jsx(e.Icon,{size:i.buttonIconSvgSize,name:l,variant:m,color:"current",className:z.start})},l.name)})})),[z.iconContainer,z.start,l,N,m]),R=r.useMemo((()=>v?{...p,rest:{},hover:{},pressed:{}}:p),[v]);return y&&r.isValidElement(b)?o.jsx(j,{layoutSpeed:"3",layoutVariant:P,children:o.jsx(S,{className:z.button,initial:["hide",V],animate:V,variants:R,whileHover:"hover",whileTap:"pressed",...I,children:r.cloneElement(b,b.props,o.jsxs(o.Fragment,{children:[T,b.props.children,_,o.jsx(s.m.span,{className:z.spacer,variants:g,initial:!1,animate:V})]}))})}):o.jsx(j,{layoutSpeed:"3",layoutVariant:P,children:o.jsxs(s.m.button,{ref:w,className:z.button,initial:["hide",V],animate:V,variants:R,whileHover:"hover",whileTap:"pressed",...I,children:[T,b,_,o.jsx(s.m.span,{className:z.spacer,variants:g,initial:!1,animate:V})]})})})),M=r.forwardRef((function({palette:t,variant:n,size:a,iconVariant:c,loading:l,disableEffects:m,name:h,className:g,...f},v){const b=r.useRef(null);r.useImperativeHandle(v,(()=>b.current));const S=r.useMemo((()=>({button:e.getStyles({buttonVariant:n,buttonPalette:t,iconButtonSize:a,className:e.cx("uds-icon-button","uds-button","uds-ring","uds-hit-target",l&&"uds-button-loading",m&&"uds-button-without-effects",g)}),loading:"uds-button-icon start-content animate-spin",icon:"uds-button-icon start-content"})),[t,n,g,m,a,l]),y=s.useReducedMotion(),M=r.useMemo((()=>y?"smooth":"subtle"),[y]),I=r.useMemo((()=>m?{...p,rest:{},hover:{},pressed:{}}:p),[m]);return o.jsx(j,{layoutSpeed:"3",layoutVariant:M,reducedMotion:m?"always":"user",children:o.jsx(s.m.button,{ref:b,className:S.button,initial:"icon",variants:I,whileHover:"hover",whileTap:"pressed",...f,children:o.jsxs(s.AnimatePresence,{initial:!1,mode:"popLayout",children:[l&&o.jsx(s.m.span,{variants:d,initial:"loading",animate:"loading",exit:"hide",children:o.jsx(e.Icon,{size:i.buttonIconSvgSize,name:x,variant:c,color:"current",className:S.loading})},"loading"),h&&!l&&o.jsx(s.m.span,{variants:u,initial:"icon",animate:"icon",exit:"hide",children:o.jsx(e.Icon,{size:i.buttonIconSvgSize,name:h,variant:c,color:"current",className:S.icon})},h.name)]})})})}));
 /*! © 2024 Yahoo, Inc. UDS v0.0.0-development */
 exports.Button=y,exports.IconButton=M,exports.SpringMotionConfig=j;

package/dist/client/index.js

@@ -1,6 +1,6 @@
 "use client";
-import{createSlot as t,getStyles as n,cx as a,Icon as e}from"../chunk-6GVKLLYU.js";import{getMotionVar as i}from"../chunk-PSTMMXTR.js";import{motion as o}from"../chunk-YRYDHL65.js";import{BUTTON_CSS_VAR_MAP as r}from"../chunk-33B23P5G.js";import{buttonIconSvgSize as s}from"@yahoo/uds/fixtures";import{jsx as c,jsxs as l,Fragment as d}from"react/jsx-runtime";import{m as u,useReducedMotion as h,AnimatePresence as m,LazyMotion as p,MotionConfig as f}from"framer-motion";import{forwardRef as g,useRef as v,useImperativeHandle as b,useMemo as y,isValidElement as w,cloneElement as N,useState as C,useEffect as S}from"react";
+import{createSlot as t,getStyles as n,cx as a,Icon as e}from"../chunk-VADOXPF5.js";import{getMotionVar as i}from"../chunk-PSTMMXTR.js";import{motion as o}from"../chunk-YRYDHL65.js";import{BUTTON_CSS_VAR_MAP as r}from"../chunk-33B23P5G.js";import{buttonIconSvgSize as s}from"@yahoo/uds/fixtures";import{jsx as c,jsxs as l,Fragment as d}from"react/jsx-runtime";import{m as u,useReducedMotion as h,AnimatePresence as m,LazyMotion as p,MotionConfig as f}from"framer-motion";import{forwardRef as g,useRef as v,useImperativeHandle as b,useMemo as y,isValidElement as w,cloneElement as N,useState as C,useEffect as S}from"react";
 /*! © 2024 Yahoo, Inc. UDS v0.0.0-development */
-var I={scale:.7,opacity:0},V={scale:[.7,.7,1],opacity:[0,0,1],transition:{times:[0,.5,1]}},x={icon:V,hide:I,loading:I},M={loading:V,hide:I,icon:I},z=`var(${r.columnGap})`,P=`var(${r.iconSize})`,L={rest:{scale:`var(${r.effects.scale.rest})`},hover:{scale:`var(${r.effects.scale.hover})`},pressed:{scale:`var(${r.effects.scale.pressed})`},withoutIcon:{columnGap:"0px"},withIcon:{columnGap:z}},j={withoutIcon:{marginLeft:0},withIcon:{marginLeft:`calc(${z} * -1)`}},G={hide:{width:"0px",opacity:0,display:"none"},loading:{width:P,display:"flex",opacity:1},icon:{width:P,display:"flex",opacity:1}},$=({size:t,variant:n})=>{if("outline"===n)switch(t){case"sm":return c(d,{children:c("path",{fill:"currentColor",d:"M7.9 2.7a5.2 5.2 0 1 0 5.2 5.2h1.6a6.8 6.8 0 1 1-6.8-6.8.8.8 0 1 1 0 1.6"})});case"md":return c(d,{children:c("path",{fill:"currentColor",d:"M12 4a8 8 0 1 0 8 8h2c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2a1 1 0 1 1 0 2"})});case"lg":return c(d,{children:c("path",{fill:"currentColor",d:"M16.15 4.3C9.605 4.3 4.3 9.605 4.3 16.15S9.605 28 16.15 28 28 22.695 28 16.15h2.3c0 7.815-6.335 14.15-14.15 14.15S2 23.965 2 16.15 8.335 2 16.15 2a1.15 1.15 0 0 1 0 2.3"})})}if("fill"===n)switch(t){case"sm":return c(d,{children:c("path",{fill:"currentColor",d:"M8 2.9A5.1 5.1 0 1 0 13.1 8h1.8A6.9 6.9 0 1 1 8 1.1a.9.9 0 1 1 0 1.8"})});case"md":return c(d,{children:c("path",{fill:"currentColor",d:"M12.15 4.3A7.85 7.85 0 1 0 20 12.15h2.3c0 5.606-4.544 10.15-10.15 10.15S2 17.756 2 12.15 6.544 2 12.15 2a1.15 1.15 0 0 1 0 2.3"})});case"lg":return c(d,{children:c("path",{fill:"currentColor",d:"M16.35 4.7C9.916 4.7 4.7 9.916 4.7 16.35S9.916 28 16.35 28 28 22.784 28 16.35h2.7c0 7.925-6.425 14.35-14.35 14.35S2 24.275 2 16.35 8.425 2 16.35 2a1.35 1.35 0 1 1 0 2.7"})})}return c(d,{})},k=()=>import("../motionFeatures-B5UV2GY2.js").then((({domAnimation:t})=>t));function T({reducedMotion:t="user",children:n,layoutVariant:a="subtle",layoutSpeed:e="3",colorVariant:r="smooth",colorSpeed:s="3"}){const l=o[a][e],d=o[r][s],[u,h]=C(l),[m,g]=C(d),v={variant:r,speed:s},b=i({...v,control:"stiffness"}),w=i({...v,control:"damping"}),N={variant:a,speed:e},I=i({...N,control:"stiffness"}),V=i({...N,control:"damping"});S((()=>{const t=getComputedStyle(document.documentElement),n={damping:Number(t.getPropertyValue(V)),stiffness:Number(t.getPropertyValue(I))},a={damping:Number(t.getPropertyValue(w)),stiffness:Number(t.getPropertyValue(b))};h(n),g(a)}),[w,b,V,I]);const x=y((()=>({type:"spring",mass:1,...u,layout:u,opacity:m,color:m,borderColor:m,backgroundColor:m})),[m,u]);return c(p,{features:k,strict:!0,children:c(f,{transition:x,reducedMotion:t,children:n})})}var A=t(),H=u.create(A,{forwardMotionProps:!0}),Y=g((function({palette:t,variant:i,size:o,startIcon:r,endIcon:p,iconVariant:f,loading:g,disableEffects:C,children:S,asChild:I,className:V,...z},P){const k=v(null);b(P,(()=>k.current));const A=p?"icon":"hide",Y=(({startIcon:t,endIcon:n,loading:a})=>t||n||a?"withIcon":"withoutIcon")({startIcon:r,endIcon:p,loading:g}),B=(({loading:t,startIcon:n})=>t?"loading":n?"icon":"hide")({loading:g,startIcon:r}),E={button:n({buttonSize:o,buttonVariant:i,buttonPalette:t,className:a("uds-button","uds-ring","uds-hit-target",g&&"uds-button-loading",C&&"uds-button-without-effects","withIcon"===Y&&"uds-button-with-gap",V)}),iconContainer:"uds-button-icon-container flex overflow-hidden",loading:"uds-button-icon start-content animate-spin",start:"uds-button-icon start-content",end:"uds-button-icon end-content",spacer:"uds-button-spacer"},R=h()?"smooth":"subtle",U=y((()=>c(u.span,{className:E.iconContainer,initial:!1,variants:G,animate:B,children:l(m,{initial:!1,mode:"popLayout",children:[g&&c(u.span,{variants:M,initial:"hide",animate:"loading",exit:"hide",children:c(e,{size:s,name:$,variant:f,color:"current",className:E.loading})},"loading"),r&&!g&&c(u.span,{variants:x,initial:"hide",animate:"icon",exit:"hide",children:c(e,{size:s,name:r,variant:f,color:"current",className:E.start})},r.name)]})})),[E.iconContainer,E.loading,E.start,B,g,f,r]),D=y((()=>c(u.span,{className:E.iconContainer,initial:!1,variants:G,animate:A,children:c(m,{initial:!1,mode:"popLayout",children:p&&c(u.span,{variants:x,initial:"hide",animate:"icon",exit:"hide",children:c(e,{size:s,name:p,variant:f,color:"current",className:E.start})},p.name)})})),[E.iconContainer,E.start,p,A,f]),F=y((()=>C?{...L,rest:{},hover:{},pressed:{}}:L),[C]);return I&&w(S)?c(T,{layoutSpeed:"3",layoutVariant:R,children:c(H,{className:E.button,initial:["hide",Y],animate:Y,variants:F,whileHover:"hover",whileTap:"pressed",...z,children:N(S,S.props,l(d,{children:[U,S.props.children,D,c(u.span,{className:E.spacer,variants:j,initial:!1,animate:Y})]}))})}):c(T,{layoutSpeed:"3",layoutVariant:R,children:l(u.button,{ref:k,className:E.button,initial:["hide",Y],animate:Y,variants:F,whileHover:"hover",whileTap:"pressed",...z,children:[U,S,D,c(u.span,{className:E.spacer,variants:j,initial:!1,animate:Y})]})})})),B=g((function({palette:t,variant:i,size:o,iconVariant:r,loading:d,disableEffects:p,name:f,className:g,...w},N){const C=v(null);b(N,(()=>C.current));const S=y((()=>({button:n({buttonVariant:i,buttonPalette:t,iconButtonSize:o,className:a("uds-icon-button","uds-button","uds-ring","uds-hit-target",d&&"uds-button-loading",p&&"uds-button-without-effects",g)}),loading:"uds-button-icon start-content animate-spin",icon:"uds-button-icon start-content"})),[t,i,g,p,o,d]),I=h(),V=y((()=>I?"smooth":"subtle"),[I]),z=y((()=>p?{...L,rest:{},hover:{},pressed:{}}:L),[p]);return c(T,{layoutSpeed:"3",layoutVariant:V,reducedMotion:p?"always":"user",children:c(u.button,{ref:C,className:S.button,initial:"icon",variants:z,whileHover:"hover",whileTap:"pressed",...w,children:l(m,{initial:!1,mode:"popLayout",children:[d&&c(u.span,{variants:M,initial:"loading",animate:"loading",exit:"hide",children:c(e,{size:s,name:$,variant:r,color:"current",className:S.loading})},"loading"),f&&!d&&c(u.span,{variants:x,initial:"icon",animate:"icon",exit:"hide",children:c(e,{size:s,name:f,variant:r,color:"current",className:S.icon})},f.name)]})})})}));
+var I={scale:.7,opacity:0},V={scale:[.7,.7,1],opacity:[0,0,1],transition:{times:[0,.5,1]}},x={icon:V,hide:I,loading:I},M={loading:V,hide:I,icon:I},z=`var(${r.columnGap})`,P=`var(${r.iconSize})`,j={rest:{scale:`var(${r.effects.scale.rest})`},hover:{scale:`var(${r.effects.scale.hover})`},pressed:{scale:`var(${r.effects.scale.pressed})`},withoutIcon:{columnGap:"0px"},withIcon:{columnGap:z}},L={withoutIcon:{marginLeft:0},withIcon:{marginLeft:`calc(${z} * -1)`}},$={hide:{width:"0px",opacity:0,display:"none"},loading:{width:P,display:"flex",opacity:1},icon:{width:P,display:"flex",opacity:1}},k=({size:t,variant:n})=>{if("outline"===n)switch(t){case"sm":return c(d,{children:c("path",{fill:"currentColor",d:"M7.9 2.7a5.2 5.2 0 1 0 5.2 5.2h1.6a6.8 6.8 0 1 1-6.8-6.8.8.8 0 1 1 0 1.6"})});case"md":return c(d,{children:c("path",{fill:"currentColor",d:"M12 4a8 8 0 1 0 8 8h2c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2a1 1 0 1 1 0 2"})});case"lg":return c(d,{children:c("path",{fill:"currentColor",d:"M16.15 4.3C9.605 4.3 4.3 9.605 4.3 16.15S9.605 28 16.15 28 28 22.695 28 16.15h2.3c0 7.815-6.335 14.15-14.15 14.15S2 23.965 2 16.15 8.335 2 16.15 2a1.15 1.15 0 0 1 0 2.3"})})}if("fill"===n)switch(t){case"sm":return c(d,{children:c("path",{fill:"currentColor",d:"M8 2.9A5.1 5.1 0 1 0 13.1 8h1.8A6.9 6.9 0 1 1 8 1.1a.9.9 0 1 1 0 1.8"})});case"md":return c(d,{children:c("path",{fill:"currentColor",d:"M12.15 4.3A7.85 7.85 0 1 0 20 12.15h2.3c0 5.606-4.544 10.15-10.15 10.15S2 17.756 2 12.15 6.544 2 12.15 2a1.15 1.15 0 0 1 0 2.3"})});case"lg":return c(d,{children:c("path",{fill:"currentColor",d:"M16.35 4.7C9.916 4.7 4.7 9.916 4.7 16.35S9.916 28 16.35 28 28 22.784 28 16.35h2.7c0 7.925-6.425 14.35-14.35 14.35S2 24.275 2 16.35 8.425 2 16.35 2a1.35 1.35 0 1 1 0 2.7"})})}return c(d,{})},A=()=>import("../motionFeatures-B5UV2GY2.js").then((({domAnimation:t})=>t));function G({reducedMotion:t="user",children:n,layoutVariant:a="subtle",layoutSpeed:e="3",colorVariant:r="smooth",colorSpeed:s="3"}){const l=o[a][e],d=o[r][s],[u,h]=C(l),[m,g]=C(d),v={variant:r,speed:s},b=i({...v,control:"stiffness"}),w=i({...v,control:"damping"}),N={variant:a,speed:e},I=i({...N,control:"stiffness"}),V=i({...N,control:"damping"});S((()=>{const t=getComputedStyle(document.documentElement),n={damping:Number(t.getPropertyValue(V)),stiffness:Number(t.getPropertyValue(I))},a={damping:Number(t.getPropertyValue(w)),stiffness:Number(t.getPropertyValue(b))};h(n),g(a)}),[w,b,V,I]);const x=y((()=>({type:"spring",mass:1,...u,layout:u,opacity:m,color:m,borderColor:m,backgroundColor:m})),[m,u]);return c(p,{features:A,strict:!0,children:c(f,{transition:x,reducedMotion:t,children:n})})}var T=t(),H=u.create(T,{forwardMotionProps:!0}),B=g((function({palette:t,variant:i,size:o,startIcon:r,endIcon:p,iconVariant:f,loading:g,disableEffects:C,children:S,asChild:I,className:V,...z},P){const A=v(null);b(P,(()=>A.current));const T=p?"icon":"hide",B=(({startIcon:t,endIcon:n,loading:a})=>t||n||a?"withIcon":"withoutIcon")({startIcon:r,endIcon:p,loading:g}),E=(({loading:t,startIcon:n})=>t?"loading":n?"icon":"hide")({loading:g,startIcon:r}),Y={button:n({buttonSize:o,buttonVariant:i,buttonPalette:t,className:a("uds-button","uds-ring","uds-hit-target",g&&"uds-button-loading",C&&"uds-button-without-effects","withIcon"===B&&"uds-button-with-gap",V)}),iconContainer:"uds-button-icon-container flex overflow-hidden",loading:"uds-button-icon start-content animate-spin",start:"uds-button-icon start-content",end:"uds-button-icon end-content",spacer:"uds-button-spacer"},D=h()?"smooth":"subtle",F=y((()=>c(u.span,{className:Y.iconContainer,initial:!1,variants:$,animate:E,children:l(m,{initial:!1,mode:"popLayout",children:[g&&c(u.span,{variants:M,initial:"hide",animate:"loading",exit:"hide",children:c(e,{size:s,name:k,variant:f,color:"current",className:Y.loading})},"loading"),r&&!g&&c(u.span,{variants:x,initial:"hide",animate:"icon",exit:"hide",children:c(e,{size:s,name:r,variant:f,color:"current",className:Y.start})},r.name)]})})),[Y.iconContainer,Y.loading,Y.start,E,g,f,r]),R=y((()=>c(u.span,{className:Y.iconContainer,initial:!1,variants:$,animate:T,children:c(m,{initial:!1,mode:"popLayout",children:p&&c(u.span,{variants:x,initial:"hide",animate:"icon",exit:"hide",children:c(e,{size:s,name:p,variant:f,color:"current",className:Y.start})},p.name)})})),[Y.iconContainer,Y.start,p,T,f]),X=y((()=>C?{...j,rest:{},hover:{},pressed:{}}:j),[C]);return I&&w(S)?c(G,{layoutSpeed:"3",layoutVariant:D,children:c(H,{className:Y.button,initial:["hide",B],animate:B,variants:X,whileHover:"hover",whileTap:"pressed",...z,children:N(S,S.props,l(d,{children:[F,S.props.children,R,c(u.span,{className:Y.spacer,variants:L,initial:!1,animate:B})]}))})}):c(G,{layoutSpeed:"3",layoutVariant:D,children:l(u.button,{ref:A,className:Y.button,initial:["hide",B],animate:B,variants:X,whileHover:"hover",whileTap:"pressed",...z,children:[F,S,R,c(u.span,{className:Y.spacer,variants:L,initial:!1,animate:B})]})})})),E=g((function({palette:t,variant:i,size:o,iconVariant:r,loading:d,disableEffects:p,name:f,className:g,...w},N){const C=v(null);b(N,(()=>C.current));const S=y((()=>({button:n({buttonVariant:i,buttonPalette:t,iconButtonSize:o,className:a("uds-icon-button","uds-button","uds-ring","uds-hit-target",d&&"uds-button-loading",p&&"uds-button-without-effects",g)}),loading:"uds-button-icon start-content animate-spin",icon:"uds-button-icon start-content"})),[t,i,g,p,o,d]),I=h(),V=y((()=>I?"smooth":"subtle"),[I]),z=y((()=>p?{...j,rest:{},hover:{},pressed:{}}:j),[p]);return c(G,{layoutSpeed:"3",layoutVariant:V,reducedMotion:p?"always":"user",children:c(u.button,{ref:C,className:S.button,initial:"icon",variants:z,whileHover:"hover",whileTap:"pressed",...w,children:l(m,{initial:!1,mode:"popLayout",children:[d&&c(u.span,{variants:M,initial:"loading",animate:"loading",exit:"hide",children:c(e,{size:s,name:k,variant:r,color:"current",className:S.loading})},"loading"),f&&!d&&c(u.span,{variants:x,initial:"icon",animate:"icon",exit:"hide",children:c(e,{size:s,name:f,variant:r,color:"current",className:S.icon})},f.name)]})})})}));
 /*! © 2024 Yahoo, Inc. UDS v0.0.0-development */
-export{Y as Button,B as IconButton,T as SpringMotionConfig};
+export{B as Button,E as IconButton,G as SpringMotionConfig};