@getflip/swirl-components 0.1.0

package/dist/components/flip-icon-warning.js

@@ -0,0 +1,37 @@
+import { proxyCustomElement, HTMLElement, h, Fragment } from '@stencil/core/internal/client';
+
+const flipIconCss = ":host{display:inline-flex}";
+
+const FlipIconWarning$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.size = 24;
+  }
+  render() {
+    return (h("svg", { class: "flip-icon", fill: "none", height: this.size, part: "icon", viewBox: `0 0 ${this.size} ${this.size}`, width: this.size, xmlns: "http://www.w3.org/2000/svg" }, this.size === 16 && (h(Fragment, null, h("path", { d: "M1.81666 14C1.5611 14 1.37221 13.8889 1.24999 13.6667C1.12777 13.4444 1.12777 13.2222 1.24999 13L7.41666 2.33333C7.53888 2.11111 7.73333 2 7.99999 2C8.26666 2 8.4611 2.11111 8.58333 2.33333L14.75 13C14.8722 13.2222 14.8722 13.4444 14.75 13.6667C14.6278 13.8889 14.4389 14 14.1833 14H1.81666ZM7.99999 6.66667C7.8111 6.66667 7.65288 6.73044 7.52533 6.858C7.39733 6.986 7.33333 7.14444 7.33333 7.33333V9.33333C7.33333 9.52222 7.39733 9.68044 7.52533 9.808C7.65288 9.936 7.8111 10 7.99999 10C8.18888 10 8.34733 9.936 8.47533 9.808C8.60288 9.68044 8.66666 9.52222 8.66666 9.33333V7.33333C8.66666 7.14444 8.60288 6.986 8.47533 6.858C8.34733 6.73044 8.18888 6.66667 7.99999 6.66667ZM7.99999 12C8.18888 12 8.34733 11.936 8.47533 11.808C8.60288 11.6804 8.66666 11.5222 8.66666 11.3333C8.66666 11.1444 8.60288 10.9862 8.47533 10.8587C8.34733 10.7307 8.18888 10.6667 7.99999 10.6667C7.8111 10.6667 7.65288 10.7307 7.52533 10.8587C7.39733 10.9862 7.33333 11.1444 7.33333 11.3333C7.33333 11.5222 7.39733 11.6804 7.52533 11.808C7.65288 11.936 7.8111 12 7.99999 12Z", fill: "currentColor" }))), this.size === 24 && (h(Fragment, null, h("path", { d: "M2.72499 21C2.34165 21 2.05832 20.8333 1.87499 20.5C1.69165 20.1667 1.69165 19.8333 1.87499 19.5L11.125 3.5C11.3083 3.16667 11.6 3 12 3C12.4 3 12.6917 3.16667 12.875 3.5L22.125 19.5C22.3083 19.8333 22.3083 20.1667 22.125 20.5C21.9417 20.8333 21.6583 21 21.275 21H2.72499ZM12 10C11.7167 10 11.4793 10.0957 11.288 10.287C11.096 10.479 11 10.7167 11 11V14C11 14.2833 11.096 14.5207 11.288 14.712C11.4793 14.904 11.7167 15 12 15C12.2833 15 12.521 14.904 12.713 14.712C12.9043 14.5207 13 14.2833 13 14V11C13 10.7167 12.9043 10.479 12.713 10.287C12.521 10.0957 12.2833 10 12 10ZM12 18C12.2833 18 12.521 17.904 12.713 17.712C12.9043 17.5207 13 17.2833 13 17C13 16.7167 12.9043 16.4793 12.713 16.288C12.521 16.096 12.2833 16 12 16C11.7167 16 11.4793 16.096 11.288 16.288C11.096 16.4793 11 16.7167 11 17C11 17.2833 11.096 17.5207 11.288 17.712C11.4793 17.904 11.7167 18 12 18Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, null, h("path", { d: "M3.17915 24.5C2.73193 24.5 2.40137 24.3056 2.18749 23.9167C1.9736 23.5278 1.9736 23.1389 2.18749 22.75L12.9792 4.08333C13.193 3.69444 13.5333 3.5 14 3.5C14.4667 3.5 14.8069 3.69444 15.0208 4.08333L25.8125 22.75C26.0264 23.1389 26.0264 23.5278 25.8125 23.9167C25.5986 24.3056 25.268 24.5 24.8208 24.5H3.17915ZM14 11.6667C13.6694 11.6667 13.3925 11.7783 13.1693 12.0015C12.9453 12.2255 12.8333 12.5028 12.8333 12.8333V16.3333C12.8333 16.6639 12.9453 16.9408 13.1693 17.164C13.3925 17.388 13.6694 17.5 14 17.5C14.3305 17.5 14.6078 17.388 14.8318 17.164C15.055 16.9408 15.1667 16.6639 15.1667 16.3333V12.8333C15.1667 12.5028 15.055 12.2255 14.8318 12.0015C14.6078 11.7783 14.3305 11.6667 14 11.6667ZM14 21C14.3305 21 14.6078 20.888 14.8318 20.664C15.055 20.4408 15.1667 20.1639 15.1667 19.8333C15.1667 19.5028 15.055 19.2259 14.8318 19.0027C14.6078 18.7787 14.3305 18.6667 14 18.6667C13.6694 18.6667 13.3925 18.7787 13.1693 19.0027C12.9453 19.2259 12.8333 19.5028 12.8333 19.8333C12.8333 20.1639 12.9453 20.4408 13.1693 20.664C13.3925 20.888 13.6694 21 14 21Z", fill: "currentColor" })))));
+  }
+  static get style() { return flipIconCss; }
+}, [1, "flip-icon-warning", {
+    "size": [2]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["flip-icon-warning"];
+  components.forEach(tagName => { switch (tagName) {
+    case "flip-icon-warning":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, FlipIconWarning$1);
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const FlipIconWarning = FlipIconWarning$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { FlipIconWarning, defineCustomElement };

package/dist/components/flip-inline-error.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface FlipInlineError extends Components.FlipInlineError, HTMLElement {}
+export const FlipInlineError: {
+  prototype: FlipInlineError;
+  new (): FlipInlineError;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/flip-inline-error.js

@@ -0,0 +1,47 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { c as classnames } from './index2.js';
+import { d as defineCustomElement$2 } from './flip-icon-error2.js';
+
+const flipInlineErrorCss = ":host{display:inline-flex}:host *{box-sizing:border-box}.inline-error{display:inline-flex;color:var(--s-text-critical);line-height:var(--s-line-height-base)}.inline-error--size-s{font-size:var(--s-font-size-sm)}.inline-error--size-s .inline-error__icon{padding-top:0.0625rem}.inline-error--size-s .inline-error__message{padding-top:0}.inline-error__icon{display:inline-flex;color:var(--s-icon-critical)}.inline-error__message{margin-left:var(--s-space-4);padding-top:var(--s-space-2)}";
+
+const FlipInlineError$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.size = "m";
+  }
+  render() {
+    const iconSize = this.size === "m" ? 24 : 16;
+    const className = classnames("inline-error", `inline-error--size-${this.size}`);
+    return (h(Host, null, h("span", { class: className }, h("span", { class: "inline-error__icon" }, h("flip-icon-error", { size: iconSize })), h("span", { class: "inline-error__message" }, this.message))));
+  }
+  static get style() { return flipInlineErrorCss; }
+}, [1, "flip-inline-error", {
+    "message": [1],
+    "size": [1]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["flip-inline-error", "flip-icon-error"];
+  components.forEach(tagName => { switch (tagName) {
+    case "flip-inline-error":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, FlipInlineError$1);
+      }
+      break;
+    case "flip-icon-error":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const FlipInlineError = FlipInlineError$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { FlipInlineError, defineCustomElement };

package/dist/components/flip-link.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface FlipLink extends Components.FlipLink, HTMLElement {}
+export const FlipLink: {
+  prototype: FlipLink;
+  new (): FlipLink;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/flip-link.js

@@ -0,0 +1,38 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+
+const flipLinkCss = ":host{display:inline-flex}:host *{box-sizing:border-box}.link{color:var(--s-interactive-primary-default);line-height:var(--s-line-height-base);text-underline-offset:var(--s-space-4)}.link:hover{color:var(--s-interactive-primary-hovered)}.link:active{color:var(--s-interactive-primary-pressed)}";
+
+const FlipLink$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+  }
+  render() {
+    return (h(Host, null, h("a", { class: "link", href: this.href, target: this.target }, this.label)));
+  }
+  static get style() { return flipLinkCss; }
+}, [1, "flip-link", {
+    "href": [1],
+    "label": [1],
+    "target": [1]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["flip-link"];
+  components.forEach(tagName => { switch (tagName) {
+    case "flip-link":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, FlipLink$1);
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const FlipLink = FlipLink$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { FlipLink, defineCustomElement };

package/dist/components/flip-popover.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface FlipPopover extends Components.FlipPopover, HTMLElement {}
+export const FlipPopover: {
+  prototype: FlipPopover;
+  new (): FlipPopover;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;