@nylas/react 0.0.0-canary-20240925163706

package/LICENSE.md

@@ -0,0 +1,22 @@
+The MIT License (MIT)
+----
+
+Copyright (c) 2014-2015 InboxApp, Inc. and Contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

package/README.md

@@ -0,0 +1,111 @@
+# Nylas React Components
+
+React components for Nylas Scheduler
+
+![npm](https://img.shields.io/npm/v/@nylas/react)
+
+## Requirements
+
+- [Node.js](https://nodejs.org/en/) v20 or higher
+- [React.js](https://react.dev/) v18 or higher
+
+## Installation
+
+Install Nylas React Components via npm:
+
+```bash
+npm install @nylas/react@latest
+```
+
+or yarn
+
+```bash
+  yarn add @nylas/react@latest
+```
+
+## Getting Started
+
+The following example adds the Nylas Scheduler Editor and Scheduling components to your React app.
+
+> ⚠️ **Important:** Make sure to replace the `NYLAS_CLIENT_ID` with your Nylas Client ID. Your Nylas Client ID can be found in your app's Overview page on the [Nylas Dashboard](https://dashboard-v3.nylas.com).
+
+### Adding the Components
+
+```jsx
+import { BrowserRouter, Route, Routes } from 'react-router-dom';
+import { NylasSchedulerEditor, NylasScheduling } from '@nylas/react';
+
+function App() {
+  // Get the configuration ID from the URL query string
+  const urlParams = new URLSearchParams(window.location.search);
+  const configId = urlParams.get('config_id') || '';
+
+  return (
+    <BrowserRouter>
+      <Routes>
+        <Route
+          path="/"
+          element={
+            <div>
+              <a href="/scheduler-editor" className="button">
+                View Scheduler Editor
+              </a>
+              <NylasScheduling configurationId={configId} schedulerApiUrl="https://api.us.nylas.com" />
+            </div>
+          }
+        />
+        <Route
+          path="/scheduler-editor"
+          element={
+            <div>
+              <NylasSchedulerEditor
+                schedulerPreviewLink={`${window.location.origin}/?config_id={config.id}`}
+                nylasSessionsConfig={{
+                  clientId: 'NYLAS_CLIENT_ID', // Replace with your Nylas client ID from the previous
+                  redirectUri: `${window.location.origin}/scheduler-editor`,
+                  domain: 'https://api.us.nylas.com/v3', // or 'https://api.eu.nylas.com/v3' for EU data center
+                  hosted: true,
+                  accessType: 'offline',
+                }}
+                defaultSchedulerConfigState={{
+                  selectedConfiguration: {
+                    requires_session_auth: false, // Creates a public configuration which doesn't require a session
+                    scheduler: {
+                      // The callback URLs to be set in email notifications
+                      rescheduling_url: `${window.location.origin}/reschedule/:booking_ref`, // The URL of the email notification includes the booking reference
+                      cancellation_url: `${window.location.origin}/cancel/:booking_ref`,
+                    },
+                  },
+                }}
+              />
+            </div>
+          }
+        />
+      </Routes>
+    </BrowserRouter>
+  );
+}
+export default App;
+```
+
+### Start a local development server
+
+To create a Scheduling Page from the Scheduler Editor, you'll need a working Scheduler UI. To do this, run a local server to host your Scheduler Editor and Scheduling Pages.
+
+Navigate the root directory of your project and run the following command.
+
+```text
+npm run dev -- --port <PORT>
+```
+
+After you run the command, open your browser to `http://localhost:<PORT>/scheduler-editor` to see your Scheduler Editor and create your first Scheduling Page.
+
+## Links
+
+For a complete walkthrough on setting up Scheduler can be found at [https://developer.nylas.com/docs/v3/quickstart/scheduler](https://developer.nylas.com/docs/v3/quickstart/scheduler), with the complete code available on [GitHub](https://github.com/nylas-samples/quickstart-scheduler-react).
+
+### Further reading:
+
+- [Scheduler documentation](https://developer.nylas.com/docs/v3/scheduler/)
+- [Scheduler API reference](https://developer.nylas.com/docs/api/v3/scheduler/)
+- [Developer Forums](https://forums.nylas.com/)

package/dist/add-circle-icon_2.entry-19a0fe6b.js

@@ -0,0 +1,25 @@
+import { r as t, h as e } from "./index-995dd3b3.js";
+import "react";
+import "react-dom";
+const s = ".sc-add-circle-icon-h{display:flex}", a = s, i = class {
+  constructor(c) {
+    t(this, c), this.width = "24", this.height = "25";
+  }
+  render() {
+    return e("svg", { key: "5f4574833991cf259f08df93a218894bd849d112", width: this.width, height: this.height, fill: "none", xmlns: "http://www.w3.org/2000/svg" }, e("path", { key: "5369d12ef03c62758a830c0a48d45aa1f731bbc8", d: "M12 2.5c5.523 0 10 4.477 10 10s-4.477 10-10 10-10-4.477-10-10 4.477-10 10-10ZM12 4a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17Zm0 3.5a.75.75 0 0 1 .75.75v3.5h3.5a.75.75 0 0 1 0 1.5h-3.5v3.5a.75.75 0 0 1-1.5 0v-3.5h-3.5a.75.75 0 0 1 0-1.5h3.5v-3.5A.75.75 0 0 1 12 7.5Z", fill: "currentColor" }));
+  }
+};
+i.style = a;
+const l = ".sc-close-icon-h{display:flex}", h = l, o = class {
+  constructor(c) {
+    t(this, c), this.width = "16", this.height = "16";
+  }
+  render() {
+    return e("svg", { key: "ae2727b3e3bb8e386a60828defc34532de883473", width: "21", height: "21", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, e("g", { key: "3bc87607b1cf527273887ff3835716c2b16c312c", "clip-path": "url(#a)" }, e("path", { key: "3e5870c3439d7aba6930d4468925e958cd3867bf", d: "M5.73 4.574a.75.75 0 1 0-1.061 1.06l4.419 4.42-4.42 4.42a.75.75 0 1 0 1.061 1.06l4.42-4.42 4.419 4.42a.75.75 0 0 0 1.06-1.06l-4.419-4.42 4.42-4.42a.75.75 0 1 0-1.061-1.06l-4.42 4.42-4.419-4.42Z", fill: "currentColor" })), e("defs", { key: "7ae8ce566367e278782c83c4c2a3964013968579" }, e("clipPath", { key: "184fe559a12c59831e92e05d9564787fb14ce197", id: "a" }, e("path", { key: "907b8eb528141f6ff41e3d266557d6b720617a2a", fill: "#fff", transform: "translate(.148 .054)", d: "M0 0h20v20H0z" }))));
+  }
+};
+o.style = h;
+export {
+  i as add_circle_icon,
+  o as close_icon
+};

package/dist/add-circle-icon_2.entry-6f0ef50b.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-87381561.cjs");require("react");require("react-dom");const i=".sc-add-circle-icon-h{display:flex}",h=i,t=class{constructor(c){e.registerInstance(this,c),this.width="24",this.height="25"}render(){return e.h("svg",{key:"5f4574833991cf259f08df93a218894bd849d112",width:this.width,height:this.height,fill:"none",xmlns:"http://www.w3.org/2000/svg"},e.h("path",{key:"5369d12ef03c62758a830c0a48d45aa1f731bbc8",d:"M12 2.5c5.523 0 10 4.477 10 10s-4.477 10-10 10-10-4.477-10-10 4.477-10 10-10ZM12 4a8.5 8.5 0 1 0 0 17 8.5 8.5 0 0 0 0-17Zm0 3.5a.75.75 0 0 1 .75.75v3.5h3.5a.75.75 0 0 1 0 1.5h-3.5v3.5a.75.75 0 0 1-1.5 0v-3.5h-3.5a.75.75 0 0 1 0-1.5h3.5v-3.5A.75.75 0 0 1 12 7.5Z",fill:"currentColor"}))}};t.style=h;const a=".sc-close-icon-h{display:flex}",l=a,s=class{constructor(c){e.registerInstance(this,c),this.width="16",this.height="16"}render(){return e.h("svg",{key:"ae2727b3e3bb8e386a60828defc34532de883473",width:"21",height:"21",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e.h("g",{key:"3bc87607b1cf527273887ff3835716c2b16c312c","clip-path":"url(#a)"},e.h("path",{key:"3e5870c3439d7aba6930d4468925e958cd3867bf",d:"M5.73 4.574a.75.75 0 1 0-1.061 1.06l4.419 4.42-4.42 4.42a.75.75 0 1 0 1.061 1.06l4.42-4.42 4.419 4.42a.75.75 0 0 0 1.06-1.06l-4.419-4.42 4.42-4.42a.75.75 0 1 0-1.061-1.06l-4.42 4.42-4.419-4.42Z",fill:"currentColor"})),e.h("defs",{key:"7ae8ce566367e278782c83c4c2a3964013968579"},e.h("clipPath",{key:"184fe559a12c59831e92e05d9564787fb14ce197",id:"a"},e.h("path",{key:"907b8eb528141f6ff41e3d266557d6b720617a2a",fill:"#fff",transform:"translate(.148 .054)",d:"M0 0h20v20H0z"}))))}};s.style=l;exports.add_circle_icon=t;exports.close_icon=s;

package/dist/archive-icon.entry-7caa062b.js

@@ -0,0 +1,15 @@
+import { r as s, h as t } from "./index-995dd3b3.js";
+import "react";
+import "react-dom";
+const o = ".sc-archive-icon-h{display:flex}", a = o, c = class {
+  constructor(e) {
+    s(this, e), this.width = "15", this.height = "15";
+  }
+  render() {
+    return t("svg", { key: "bef43f90f17584ed04d54ad3e93eef2e41fe10df", width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "auto", xmlns: "http://www.w3.org/2000/svg" }, t("path", { key: "def31c24d8567d5c3af5101b38de6f988d1cc635", d: "M3 6H5H21", stroke: "auto", "stroke-width": "1.5" }), t("path", { key: "4cdf3198a41cc8b5aa739671c4c3166589379ac0", d: "M8 6V4C8 3.46957 8.21071 2.96086 8.58579 2.58579C8.96086 2.21071 9.46957 2 10 2H14C14.5304 2 15.0391 2.21071 15.4142 2.58579C15.7893 2.96086 16 3.46957 16 4V6M19 6V20C19 20.5304 18.7893 21.0391 18.4142 21.4142C18.0391 21.7893 17.5304 22 17 22H7C6.46957 22 5.96086 21.7893 5.58579 21.4142C5.21071 21.0391 5 20.5304 5 20V6H19Z", stroke: "auto", "stroke-width": "1.5" }), t("path", { key: "e6badf9923afe64301196f62fb505ceb3e4e211f", d: "M10 11V17", stroke: "auto", "stroke-width": "1.5" }), t("path", { key: "a41123224201ba80a7a24b24bcf19a722592e0de", d: "M14 11V17", stroke: "auto", "stroke-width": "1.5" }));
+  }
+};
+c.style = a;
+export {
+  c as archive_icon
+};

package/dist/archive-icon.entry-d9a39415.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-87381561.cjs");require("react");require("react-dom");const i=".sc-archive-icon-h{display:flex}",c=i,t=class{constructor(h){e.registerInstance(this,h),this.width="15",this.height="15"}render(){return e.h("svg",{key:"bef43f90f17584ed04d54ad3e93eef2e41fe10df",width:this.width,height:this.height,viewBox:"0 0 24 24",fill:"auto",xmlns:"http://www.w3.org/2000/svg"},e.h("path",{key:"def31c24d8567d5c3af5101b38de6f988d1cc635",d:"M3 6H5H21",stroke:"auto","stroke-width":"1.5"}),e.h("path",{key:"4cdf3198a41cc8b5aa739671c4c3166589379ac0",d:"M8 6V4C8 3.46957 8.21071 2.96086 8.58579 2.58579C8.96086 2.21071 9.46957 2 10 2H14C14.5304 2 15.0391 2.21071 15.4142 2.58579C15.7893 2.96086 16 3.46957 16 4V6M19 6V20C19 20.5304 18.7893 21.0391 18.4142 21.4142C18.0391 21.7893 17.5304 22 17 22H7C6.46957 22 5.96086 21.7893 5.58579 21.4142C5.21071 21.0391 5 20.5304 5 20V6H19Z",stroke:"auto","stroke-width":"1.5"}),e.h("path",{key:"e6badf9923afe64301196f62fb505ceb3e4e211f",d:"M10 11V17",stroke:"auto","stroke-width":"1.5"}),e.h("path",{key:"a41123224201ba80a7a24b24bcf19a722592e0de",d:"M14 11V17",stroke:"auto","stroke-width":"1.5"}))}};t.style=c;exports.archive_icon=t;

package/dist/arrow-icon.entry-29ce2105.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-87381561.cjs");require("react");require("react-dom");const o=".sc-arrow-icon-h{display:flex}",i=o,t=class{constructor(r){e.registerInstance(this,r),this.width="15",this.height="15"}render(){return e.h("svg",{key:"a7d7e1b1ad65a8b540fd3d3ec3a5bebdd7799b9a",width:this.width,height:this.height,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e.h("path",{key:"5ae23fbbd6276df6aea78458d6640a225a0ea0b4",d:"M5 12H19M12 5L19 12L12 19",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"}))}};t.style=i;exports.arrow_icon=t;

package/dist/arrow-icon.entry-ab601786.js

@@ -0,0 +1,15 @@
+import { r as o, h as t } from "./index-995dd3b3.js";
+import "react";
+import "react-dom";
+const e = ".sc-arrow-icon-h{display:flex}", s = e, i = class {
+  constructor(r) {
+    o(this, r), this.width = "15", this.height = "15";
+  }
+  render() {
+    return t("svg", { key: "a7d7e1b1ad65a8b540fd3d3ec3a5bebdd7799b9a", width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, t("path", { key: "5ae23fbbd6276df6aea78458d6640a225a0ea0b4", d: "M5 12H19M12 5L19 12L12 19", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }));
+  }
+};
+i.style = s;
+export {
+  i as arrow_icon
+};

package/dist/bold-icon.entry-6ff126e7.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-87381561.cjs");require("react");require("react-dom");const i=".sc-bold-icon-h{display:flex}",r=i,t=class{constructor(o){e.registerInstance(this,o),this.width="15",this.height="15"}render(){return e.h("svg",{key:"d1c7df50a98582b26d02f830f40fff900a8f1fce",width:this.width,height:this.height,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},e.h("path",{key:"0db57bf1fed8ab77ea972da815ea88cd63769580",d:"M6 4V20M9.5 4H15.5C17.7091 4 19.5 5.79086 19.5 8C19.5 10.2091 17.7091 12 15.5 12H9.5H16.5C18.7091 12 20.5 13.7909 20.5 16C20.5 18.2091 18.7091 20 16.5 20H9.5M9.5 4V20M9.5 4H4M9.5 20H4",stroke:"currentColor","stroke-width":"2","stroke-linecap":"round","stroke-linejoin":"round"}))}};t.style=r;exports.bold_icon=t;

package/dist/bold-icon.entry-e389dd6a.js

@@ -0,0 +1,15 @@
+import { r as e, h as t } from "./index-995dd3b3.js";
+import "react";
+import "react-dom";
+const s = ".sc-bold-icon-h{display:flex}", i = s, r = class {
+  constructor(o) {
+    e(this, o), this.width = "15", this.height = "15";
+  }
+  render() {
+    return t("svg", { key: "d1c7df50a98582b26d02f830f40fff900a8f1fce", width: this.width, height: this.height, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, t("path", { key: "0db57bf1fed8ab77ea972da815ea88cd63769580", d: "M6 4V20M9.5 4H15.5C17.7091 4 19.5 5.79086 19.5 8C19.5 10.2091 17.7091 12 15.5 12H9.5H16.5C18.7091 12 20.5 13.7909 20.5 16C20.5 18.2091 18.7091 20 16.5 20H9.5M9.5 4V20M9.5 4H4M9.5 20H4", stroke: "currentColor", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }));
+  }
+};
+r.style = i;
+export {
+  r as bold_icon
+};

package/dist/button-component_2.entry-06af034d.js

@@ -0,0 +1,26 @@
+import { r as o, h as t } from "./index-995dd3b3.js";
+import "react";
+import "react-dom";
+const e = "button.sc-button-component{display:flex;align-items:center;justify-content:center;gap:0.75rem;height:48px;border:none;border-radius:var(--nylas-border-radius-2x);font-size:1rem;line-height:24px;padding:0 1rem;cursor:pointer;font-family:var(--nylas-font-family);font-weight:600;width:100%}@media screen and (max-width: 768px){button.sc-button-component{width:100%}}button.button-primary.sc-button-component{background:var(--nylas-primary);color:var(--nylas-base-0);height:48px;border:none;border-radius:var(--nylas-border-radius-2x);font-size:1rem;line-height:24px;padding:0 1rem;cursor:pointer}button.button-primary.sc-button-component:hover{background:var(--nylas-base-600)}button.button-primary.sc-button-component:active{background:var(--nylas-base-800)}button.button-primary.sc-button-component:disabled{background:var(--nylas-base-300);cursor:not-allowed}button.button-basic.sc-button-component{border:1px solid var(--nylas-base-300);color:var(--nylas-base-700);background:transparent}button.button-basic.sc-button-component:hover{background:transparent;border-color:var(--nylas-primary)}button.button-basic.sc-button-component:active{background:transparent;border-color:var(--nylas-base-600);border-width:2px}button.button-basic.sc-button-component:disabled{background:transparent;border-color:var(--nylas-base-300);color:var(--nylas-base-300);cursor:not-allowed}button.button-destructive.sc-button-component{border:1px solid var(--nylas-base-300);color:var(--nylas-error);background:transparent}button.button-destructive.sc-button-component:hover{background:transparent;border-color:var(--nylas-error)}button.button-destructive.sc-button-component:active{background:transparent;border-color:var(--nylas-error-pressed);border-width:2px;color:var(--nylas-error-pressed)}button.button-destructive.sc-button-component:disabled{background:transparent;border-color:var(--nylas-base-300);color:var(--nylas-base-300);cursor:not-allowed}button.button-invisible.sc-button-component{background:transparent;color:var(--nylas-base-800);border:none}button.button-invisible.sc-button-component:hover{background:var(--nylas-base-50);color:var(--nylas-primary)}button.button-invisible.sc-button-component:active{background:var(--nylas-base-50);color:var(--nylas-base-850)}button.button-invisible.sc-button-component:disabled{background:transparent;color:var(--nylas-base-300);cursor:not-allowed}", r = e, a = class {
+  constructor(n) {
+    o(this, n), this.variant = "primary", this.disabled = !1, this.type = "button", this.tooltip = "", this.isLoading = !1, this.clickHandler = void 0, this.mouseOverHandler = void 0, this.mouseOutHandler = void 0, this.focusHandler = void 0, this.blurHandler = void 0;
+  }
+  render() {
+    const n = `button-${this.variant}` + (this.disabled ? " disabled" : "");
+    return t("button", { key: "062f523a6eaa6c883cb39a4ffc6d26a12c83912d", class: n, disabled: this.disabled, type: "type", title: this.tooltip, onClick: this.clickHandler, onMouseOver: this.mouseOverHandler, onMouseOut: this.mouseOutHandler, onFocus: this.focusHandler, onBlur: this.blurHandler }, !!this.isLoading && t("loading-icon", { slot: "icon" }), t("slot", { key: "dbac2e8205f067c8c38e62afbb35f5ab9222dba3" }));
+  }
+};
+a.style = r;
+const s = ".wave{display:flex;align-items:center;justify-content:center}.dot{width:4px;height:4px;background-color:var(--dot-color, white);border-radius:50%;margin:0 2px;animation:wave 1.5s infinite ease-in-out}.dot:nth-child(2){animation-delay:0.2s}.dot:nth-child(3){animation-delay:0.4s}@keyframes wave{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-4px)}}", i = s, c = class {
+  constructor(n) {
+    o(this, n), this.width = "15", this.height = "15";
+  }
+  render() {
+    return t("div", { key: "4fd330645289551b628d0721382f4f24769b09c9", class: "wave" }, t("div", { key: "b23500951f1409eb1ffb244d2b9ee78e444264ac", class: "dot" }), t("div", { key: "4ae7966e56af13fb94df25a46e734909f95febea", class: "dot" }), t("div", { key: "da55a5c9efa1f7de83252d32324b4c8726c6ee66", class: "dot" }));
+  }
+};
+c.style = i;
+export {
+  a as button_component,
+  c as loading_icon
+};

package/dist/button-component_2.entry-837792bd.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./index-87381561.cjs");require("react");require("react-dom");const r="button.sc-button-component{display:flex;align-items:center;justify-content:center;gap:0.75rem;height:48px;border:none;border-radius:var(--nylas-border-radius-2x);font-size:1rem;line-height:24px;padding:0 1rem;cursor:pointer;font-family:var(--nylas-font-family);font-weight:600;width:100%}@media screen and (max-width: 768px){button.sc-button-component{width:100%}}button.button-primary.sc-button-component{background:var(--nylas-primary);color:var(--nylas-base-0);height:48px;border:none;border-radius:var(--nylas-border-radius-2x);font-size:1rem;line-height:24px;padding:0 1rem;cursor:pointer}button.button-primary.sc-button-component:hover{background:var(--nylas-base-600)}button.button-primary.sc-button-component:active{background:var(--nylas-base-800)}button.button-primary.sc-button-component:disabled{background:var(--nylas-base-300);cursor:not-allowed}button.button-basic.sc-button-component{border:1px solid var(--nylas-base-300);color:var(--nylas-base-700);background:transparent}button.button-basic.sc-button-component:hover{background:transparent;border-color:var(--nylas-primary)}button.button-basic.sc-button-component:active{background:transparent;border-color:var(--nylas-base-600);border-width:2px}button.button-basic.sc-button-component:disabled{background:transparent;border-color:var(--nylas-base-300);color:var(--nylas-base-300);cursor:not-allowed}button.button-destructive.sc-button-component{border:1px solid var(--nylas-base-300);color:var(--nylas-error);background:transparent}button.button-destructive.sc-button-component:hover{background:transparent;border-color:var(--nylas-error)}button.button-destructive.sc-button-component:active{background:transparent;border-color:var(--nylas-error-pressed);border-width:2px;color:var(--nylas-error-pressed)}button.button-destructive.sc-button-component:disabled{background:transparent;border-color:var(--nylas-base-300);color:var(--nylas-base-300);cursor:not-allowed}button.button-invisible.sc-button-component{background:transparent;color:var(--nylas-base-800);border:none}button.button-invisible.sc-button-component:hover{background:var(--nylas-base-50);color:var(--nylas-primary)}button.button-invisible.sc-button-component:active{background:var(--nylas-base-50);color:var(--nylas-base-850)}button.button-invisible.sc-button-component:disabled{background:transparent;color:var(--nylas-base-300);cursor:not-allowed}",a=r,o=class{constructor(n){t.registerInstance(this,n),this.variant="primary",this.disabled=!1,this.type="button",this.tooltip="",this.isLoading=!1,this.clickHandler=void 0,this.mouseOverHandler=void 0,this.mouseOutHandler=void 0,this.focusHandler=void 0,this.blurHandler=void 0}render(){const n=`button-${this.variant}`+(this.disabled?" disabled":"");return t.h("button",{key:"062f523a6eaa6c883cb39a4ffc6d26a12c83912d",class:n,disabled:this.disabled,type:"type",title:this.tooltip,onClick:this.clickHandler,onMouseOver:this.mouseOverHandler,onMouseOut:this.mouseOutHandler,onFocus:this.focusHandler,onBlur:this.blurHandler},!!this.isLoading&&t.h("loading-icon",{slot:"icon"}),t.h("slot",{key:"dbac2e8205f067c8c38e62afbb35f5ab9222dba3"}))}};o.style=a;const s=".wave{display:flex;align-items:center;justify-content:center}.dot{width:4px;height:4px;background-color:var(--dot-color, white);border-radius:50%;margin:0 2px;animation:wave 1.5s infinite ease-in-out}.dot:nth-child(2){animation-delay:0.2s}.dot:nth-child(3){animation-delay:0.4s}@keyframes wave{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-4px)}}",i=s,e=class{constructor(n){t.registerInstance(this,n),this.width="15",this.height="15"}render(){return t.h("div",{key:"4fd330645289551b628d0721382f4f24769b09c9",class:"wave"},t.h("div",{key:"b23500951f1409eb1ffb244d2b9ee78e444264ac",class:"dot"}),t.h("div",{key:"4ae7966e56af13fb94df25a46e734909f95febea",class:"dot"}),t.h("div",{key:"da55a5c9efa1f7de83252d32324b4c8726c6ee66",class:"dot"}))}};e.style=i;exports.button_component=o;exports.loading_icon=e;