@getflip/swirl-components 0.1.0

package/dist/esm/flip-dialog.entry.js

@@ -0,0 +1,472 @@
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-36517fab.js';
+import { c as classnames } from './index-3c78bcaf.js';
+
+var focusableSelectors = [
+  'a[href]:not([tabindex^="-"])',
+  'area[href]:not([tabindex^="-"])',
+  'input:not([type="hidden"]):not([type="radio"]):not([disabled]):not([tabindex^="-"])',
+  'input[type="radio"]:not([disabled]):not([tabindex^="-"])',
+  'select:not([disabled]):not([tabindex^="-"])',
+  'textarea:not([disabled]):not([tabindex^="-"])',
+  'button:not([disabled]):not([tabindex^="-"])',
+  'iframe:not([tabindex^="-"])',
+  'audio[controls]:not([tabindex^="-"])',
+  'video[controls]:not([tabindex^="-"])',
+  '[contenteditable]:not([tabindex^="-"])',
+  '[tabindex]:not([tabindex^="-"])',
+];
+
+var TAB_KEY = 'Tab';
+var ESCAPE_KEY = 'Escape';
+
+/**
+ * Define the constructor to instantiate a dialog
+ *
+ * @constructor
+ * @param {Element} element
+ */
+function A11yDialog(element) {
+  // Prebind the functions that will be bound in addEventListener and
+  // removeEventListener to avoid losing references
+  this._show = this.show.bind(this);
+  this._hide = this.hide.bind(this);
+  this._maintainFocus = this._maintainFocus.bind(this);
+  this._bindKeypress = this._bindKeypress.bind(this);
+
+  this.$el = element;
+  this.shown = false;
+  this._id = this.$el.getAttribute('data-a11y-dialog') || this.$el.id;
+  this._previouslyFocused = null;
+  this._listeners = {};
+
+  // Initialise everything needed for the dialog to work properly
+  this.create();
+}
+
+/**
+ * Set up everything necessary for the dialog to be functioning
+ *
+ * @param {(NodeList | Element | string)} targets
+ * @return {this}
+ */
+A11yDialog.prototype.create = function () {
+  this.$el.setAttribute('aria-hidden', true);
+  this.$el.setAttribute('aria-modal', true);
+  this.$el.setAttribute('tabindex', -1);
+
+  if (!this.$el.hasAttribute('role')) {
+    this.$el.setAttribute('role', 'dialog');
+  }
+
+  // Keep a collection of dialog openers, each of which will be bound a click
+  // event listener to open the dialog
+  this._openers = $$('[data-a11y-dialog-show="' + this._id + '"]');
+  this._openers.forEach(
+    function (opener) {
+      opener.addEventListener('click', this._show);
+    }.bind(this)
+  );
+
+  // Keep a collection of dialog closers, each of which will be bound a click
+  // event listener to close the dialog
+  const $el = this.$el;
+
+  this._closers = $$('[data-a11y-dialog-hide]', this.$el)
+    // This filter is necessary in case there are nested dialogs, so that
+    // only closers from the current dialog are retrieved and effective
+    .filter(function (closer) {
+      // Testing for `[aria-modal="true"]` is not enough since this attribute
+      // and the collect of closers is done at instantation time, when nested
+      // dialogs might not have yet been instantiated. Note that if the dialogs
+      // are manually instantiated, this could still fail because none of these
+      // selectors would match; this would cause closers to close all parent
+      // dialogs instead of just the current one
+      return closer.closest('[aria-modal="true"], [data-a11y-dialog]') === $el
+    })
+    .concat($$('[data-a11y-dialog-hide="' + this._id + '"]'));
+
+  this._closers.forEach(
+    function (closer) {
+      closer.addEventListener('click', this._hide);
+    }.bind(this)
+  );
+
+  // Execute all callbacks registered for the `create` event
+  this._fire('create');
+
+  return this
+};
+
+/**
+ * Show the dialog element, disable all the targets (siblings), trap the
+ * current focus within it, listen for some specific key presses and fire all
+ * registered callbacks for `show` event
+ *
+ * @param {CustomEvent} event
+ * @return {this}
+ */
+A11yDialog.prototype.show = function (event) {
+  // If the dialog is already open, abort
+  if (this.shown) {
+    return this
+  }
+
+  // Keep a reference to the currently focused element to be able to restore
+  // it later
+  this._previouslyFocused = document.activeElement;
+  this.$el.removeAttribute('aria-hidden');
+  this.shown = true;
+
+  // Set the focus to the dialog element
+  moveFocusToDialog(this.$el);
+
+  // Bind a focus event listener to the body element to make sure the focus
+  // stays trapped inside the dialog while open, and start listening for some
+  // specific key presses (TAB and ESC)
+  document.body.addEventListener('focus', this._maintainFocus, true);
+  document.addEventListener('keydown', this._bindKeypress);
+
+  // Execute all callbacks registered for the `show` event
+  this._fire('show', event);
+
+  return this
+};
+
+/**
+ * Hide the dialog element, enable all the targets (siblings), restore the
+ * focus to the previously active element, stop listening for some specific
+ * key presses and fire all registered callbacks for `hide` event
+ *
+ * @param {CustomEvent} event
+ * @return {this}
+ */
+A11yDialog.prototype.hide = function (event) {
+  // If the dialog is already closed, abort
+  if (!this.shown) {
+    return this
+  }
+
+  this.shown = false;
+  this.$el.setAttribute('aria-hidden', 'true');
+
+  // If there was a focused element before the dialog was opened (and it has a
+  // `focus` method), restore the focus back to it
+  // See: https://github.com/KittyGiraudel/a11y-dialog/issues/108
+  if (this._previouslyFocused && this._previouslyFocused.focus) {
+    this._previouslyFocused.focus();
+  }
+
+  // Remove the focus event listener to the body element and stop listening
+  // for specific key presses
+  document.body.removeEventListener('focus', this._maintainFocus, true);
+  document.removeEventListener('keydown', this._bindKeypress);
+
+  // Execute all callbacks registered for the `hide` event
+  this._fire('hide', event);
+
+  return this
+};
+
+/**
+ * Destroy the current instance (after making sure the dialog has been hidden)
+ * and remove all associated listeners from dialog openers and closers
+ *
+ * @return {this}
+ */
+A11yDialog.prototype.destroy = function () {
+  // Hide the dialog to avoid destroying an open instance
+  this.hide();
+
+  // Remove the click event listener from all dialog openers
+  this._openers.forEach(
+    function (opener) {
+      opener.removeEventListener('click', this._show);
+    }.bind(this)
+  );
+
+  // Remove the click event listener from all dialog closers
+  this._closers.forEach(
+    function (closer) {
+      closer.removeEventListener('click', this._hide);
+    }.bind(this)
+  );
+
+  // Execute all callbacks registered for the `destroy` event
+  this._fire('destroy');
+
+  // Keep an object of listener types mapped to callback functions
+  this._listeners = {};
+
+  return this
+};
+
+/**
+ * Register a new callback for the given event type
+ *
+ * @param {string} type
+ * @param {Function} handler
+ */
+A11yDialog.prototype.on = function (type, handler) {
+  if (typeof this._listeners[type] === 'undefined') {
+    this._listeners[type] = [];
+  }
+
+  this._listeners[type].push(handler);
+
+  return this
+};
+
+/**
+ * Unregister an existing callback for the given event type
+ *
+ * @param {string} type
+ * @param {Function} handler
+ */
+A11yDialog.prototype.off = function (type, handler) {
+  var index = (this._listeners[type] || []).indexOf(handler);
+
+  if (index > -1) {
+    this._listeners[type].splice(index, 1);
+  }
+
+  return this
+};
+
+/**
+ * Iterate over all registered handlers for given type and call them all with
+ * the dialog element as first argument, event as second argument (if any). Also
+ * dispatch a custom event on the DOM element itself to make it possible to
+ * react to the lifecycle of auto-instantiated dialogs.
+ *
+ * @access private
+ * @param {string} type
+ * @param {CustomEvent} event
+ */
+A11yDialog.prototype._fire = function (type, event) {
+  var listeners = this._listeners[type] || [];
+  var domEvent = new CustomEvent(type, { detail: event });
+
+  this.$el.dispatchEvent(domEvent);
+
+  listeners.forEach(
+    function (listener) {
+      listener(this.$el, event);
+    }.bind(this)
+  );
+};
+
+/**
+ * Private event handler used when listening to some specific key presses
+ * (namely ESCAPE and TAB)
+ *
+ * @access private
+ * @param {Event} event
+ */
+A11yDialog.prototype._bindKeypress = function (event) {
+  // This is an escape hatch in case there are nested dialogs, so the keypresses
+  // are only reacted to for the most recent one
+  const focused = document.activeElement;
+  if (focused && focused.closest('[aria-modal="true"]') !== this.$el) return
+
+  // If the dialog is shown and the ESCAPE key is being pressed, prevent any
+  // further effects from the ESCAPE key and hide the dialog, unless its role
+  // is 'alertdialog', which should be modal
+  if (
+    this.shown &&
+    event.key === ESCAPE_KEY &&
+    this.$el.getAttribute('role') !== 'alertdialog'
+  ) {
+    event.preventDefault();
+    this.hide(event);
+  }
+
+  // If the dialog is shown and the TAB key is being pressed, make sure the
+  // focus stays trapped within the dialog element
+  if (this.shown && event.key === TAB_KEY) {
+    trapTabKey(this.$el, event);
+  }
+};
+
+/**
+ * Private event handler used when making sure the focus stays within the
+ * currently open dialog
+ *
+ * @access private
+ * @param {Event} event
+ */
+A11yDialog.prototype._maintainFocus = function (event) {
+  // If the dialog is shown and the focus is not within a dialog element (either
+  // this one or another one in case of nested dialogs) or within an element
+  // with the `data-a11y-dialog-focus-trap-ignore` attribute, move it back to
+  // its first focusable child.
+  // See: https://github.com/KittyGiraudel/a11y-dialog/issues/177
+  if (
+    this.shown &&
+    !event.target.closest('[aria-modal="true"]') &&
+    !event.target.closest('[data-a11y-dialog-ignore-focus-trap]')
+  ) {
+    moveFocusToDialog(this.$el);
+  }
+};
+
+/**
+ * Convert a NodeList into an array
+ *
+ * @param {NodeList} collection
+ * @return {Array<Element>}
+ */
+function toArray(collection) {
+  return Array.prototype.slice.call(collection)
+}
+
+/**
+ * Query the DOM for nodes matching the given selector, scoped to context (or
+ * the whole document)
+ *
+ * @param {String} selector
+ * @param {Element} [context = document]
+ * @return {Array<Element>}
+ */
+function $$(selector, context) {
+  return toArray((context || document).querySelectorAll(selector))
+}
+
+/**
+ * Set the focus to the first element with `autofocus` with the element or the
+ * element itself
+ *
+ * @param {Element} node
+ */
+function moveFocusToDialog(node) {
+  var focused = node.querySelector('[autofocus]') || node;
+
+  focused.focus();
+}
+
+/**
+ * Get the focusable children of the given element
+ *
+ * @param {Element} node
+ * @return {Array<Element>}
+ */
+function getFocusableChildren(node) {
+  return $$(focusableSelectors.join(','), node).filter(function (child) {
+    return !!(
+      child.offsetWidth ||
+      child.offsetHeight ||
+      child.getClientRects().length
+    )
+  })
+}
+
+/**
+ * Trap the focus inside the given element
+ *
+ * @param {Element} node
+ * @param {Event} event
+ */
+function trapTabKey(node, event) {
+  var focusableChildren = getFocusableChildren(node);
+  var focusedItemIndex = focusableChildren.indexOf(document.activeElement);
+
+  // If the SHIFT key is being pressed while tabbing (moving backwards) and
+  // the currently focused item is the first one, move the focus to the last
+  // focusable item from the dialog element
+  if (event.shiftKey && focusedItemIndex === 0) {
+    focusableChildren[focusableChildren.length - 1].focus();
+    event.preventDefault();
+    // If the SHIFT key is not being pressed (moving forwards) and the currently
+    // focused item is the last one, move the focus to the first focusable item
+    // from the dialog element
+  } else if (
+    !event.shiftKey &&
+    focusedItemIndex === focusableChildren.length - 1
+  ) {
+    focusableChildren[0].focus();
+    event.preventDefault();
+  }
+}
+
+function instantiateDialogs() {
+  $$('[data-a11y-dialog]').forEach(function (node) {
+    new A11yDialog(node);
+  });
+}
+
+if (typeof document !== 'undefined') {
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', instantiateDialogs);
+  } else {
+    if (window.requestAnimationFrame) {
+      window.requestAnimationFrame(instantiateDialogs);
+    } else {
+      window.setTimeout(instantiateDialogs, 16);
+    }
+  }
+}
+
+const flipDialogCss = ":host{--flip-ghost-button-background-default:var(--s-surface-overlay-default);--flip-ghost-button-background-hovered:var(--s-surface-overlay-hovered);--flip-ghost-button-background-pressed:var(--s-surface-overlay-pressed);display:block}:host *{box-sizing:border-box}.dialog{position:fixed;z-index:var(--s-z-40);display:flex;justify-content:center;align-items:center;inset:0}.dialog[aria-hidden=\"true\"]{display:none}.dialog:not(.dialog--closing) .dialog__backdrop{-webkit-animation:0.15s dialog-backdrop-fade-in;animation:0.15s dialog-backdrop-fade-in}@media (prefers-reduced-motion){.dialog:not(.dialog--closing) .dialog__backdrop{-webkit-animation:none;animation:none}}.dialog:not(.dialog--closing) .dialog__body{-webkit-animation:0.15s dialog-scale-in;animation:0.15s dialog-scale-in}@media (prefers-reduced-motion){.dialog:not(.dialog--closing) .dialog__body{-webkit-animation:none;animation:none}}.dialog--closing{-webkit-animation:0.15s dialog-fade-out;animation:0.15s dialog-fade-out;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards}@media (prefers-reduced-motion){.dialog--closing{-webkit-animation:none;animation:none}}.dialog__backdrop{position:fixed;background-color:rgba(0, 0, 0, 0.2);inset:0}.dialog__body{z-index:var(--s-z-40);overflow-x:hidden;overflow-y:auto;width:18.5rem;max-height:90vh;padding-top:var(--s-space-24);padding-right:var(--s-space-8);padding-bottom:var(--s-space-8);padding-left:var(--s-space-8);border-radius:var(--s-border-radius-xl);background-color:var(--s-surface-overlay-default);text-align:center;box-shadow:0.125rem 0.25rem 1rem rgba(0, 0, 0, 0.14)}.dialog__heading{margin:0;margin-bottom:var(--s-space-8);font-size:var(--s-font-size-lg);font-weight:var(--s-font-weight-semibold);line-height:var(--s-line-height-lg)}.dialog__content{margin-bottom:var(--s-space-24);line-height:var(--s-line-height-base)}.dialog__content ::slotted(*){margin:0}@-webkit-keyframes dialog-scale-in{from{transform:scale(0)}to{transform:scale(1)}}@keyframes dialog-scale-in{from{transform:scale(0)}to{transform:scale(1)}}@-webkit-keyframes dialog-backdrop-fade-in{from{opacity:0}to{opacity:1}}@keyframes dialog-backdrop-fade-in{from{opacity:0}to{opacity:1}}@-webkit-keyframes dialog-fade-out{from{opacity:1}to{opacity:0}}@keyframes dialog-fade-out{from{opacity:1}to{opacity:0}}";
+
+const FlipDialog = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.primaryAction = createEvent(this, "primaryAction", 7);
+    this.secondaryAction = createEvent(this, "secondaryAction", 7);
+    this.intent = "primary";
+    this.closing = false;
+    this.onKeyDown = (event) => {
+      if (event.code === "Escape") {
+        this.close();
+      }
+    };
+    this.onBackdropClick = () => {
+      this.close();
+    };
+    this.onPrimaryAction = (event) => {
+      this.primaryAction.emit(event);
+      this.close();
+    };
+    this.onSecondaryAction = (event) => {
+      this.secondaryAction.emit(event);
+      this.close();
+    };
+  }
+  componentDidLoad() {
+    this.dialog = new A11yDialog(this.dialogEl);
+    this.dialog.on("show", () => {
+      var _a;
+      (_a = this.controlsContainerEl
+        .querySelector("flip-button button")) === null || _a === void 0 ? void 0 : _a.focus();
+    });
+  }
+  disconnectedCallback() {
+    var _a;
+    (_a = this.dialog) === null || _a === void 0 ? void 0 : _a.destroy();
+  }
+  /**
+   * Open the dialog.
+   */
+  async open() {
+    this.dialog.show();
+  }
+  /**
+   * Close the dialog.
+   */
+  async close() {
+    if (this.closing) {
+      return;
+    }
+    this.closing = true;
+    setTimeout(() => {
+      this.dialog.hide();
+      this.closing = false;
+    }, 150);
+  }
+  render() {
+    const className = classnames("dialog", { "dialog--closing": this.closing });
+    return (h(Host, null, h("div", { "aria-describedby": "content", "aria-hidden": "true", "aria-labelledby": this.hideLabel ? undefined : "label", "aria-label": this.hideLabel ? this.label : undefined, "aria-modal": "true", class: className, onKeyDown: this.onKeyDown, ref: (el) => (this.dialogEl = el), role: "alertdialog" }, h("div", { class: "dialog__backdrop", onClick: this.onBackdropClick }), h("div", { class: "dialog__body", role: "document" }, !this.hideLabel && (h("h2", { class: "dialog__heading", id: "label" }, this.label)), h("div", { class: "dialog__content", id: "content" }, h("slot", null)), h("flip-button-group", { class: "dialog__controls", ref: (el) => (this.controlsContainerEl = el), stretch: true, wrap: true }, this.secondaryActionLabel && (h("flip-button", { label: this.secondaryActionLabel, onClick: this.onSecondaryAction })), this.primaryActionLabel && (h("flip-button", { intent: this.intent, label: this.primaryActionLabel, onClick: this.onPrimaryAction, variant: this.intent === "critical" ? "ghost" : "flat" })))))));
+  }
+};
+FlipDialog.style = flipDialogCss;
+
+export { FlipDialog as flip_dialog };

package/dist/esm/flip-icon-add-photo.entry.js

@@ -0,0 +1,16 @@
+import { r as registerInstance, h, F as Fragment } from './index-36517fab.js';
+
+const flipIconCss = ":host{display:inline-flex}";
+
+const FlipIconAddPhoto = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    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.99999 14.6666C1.63332 14.6666 1.31955 14.5362 1.05866 14.2753C0.797323 14.014 0.666656 13.7 0.666656 13.3333V5.33331C0.666656 4.96665 0.797323 4.65287 1.05866 4.39198C1.31955 4.13065 1.63332 3.99998 1.99999 3.99998H4.09999L4.93332 3.09998C5.05555 2.96665 5.20266 2.86109 5.37466 2.78331C5.5471 2.70554 5.72777 2.66665 5.91666 2.66665H8.66666C8.85555 2.66665 9.01399 2.73042 9.14199 2.85798C9.26955 2.98598 9.33332 3.14442 9.33332 3.33331V4.66665C9.33332 4.85553 9.39732 5.01398 9.52532 5.14198C9.65288 5.26953 9.8111 5.33331 9.99999 5.33331H11.3333V6.66665C11.3333 6.85553 11.3973 7.01376 11.5253 7.14131C11.6529 7.26931 11.8111 7.33331 12 7.33331H13.3333C13.5222 7.33331 13.6804 7.39709 13.808 7.52465C13.936 7.65265 14 7.81109 14 7.99998V13.3333C14 13.7 13.8695 14.014 13.6087 14.2753C13.3473 14.5362 13.0333 14.6666 12.6667 14.6666H1.99999ZM7.33332 12.3333C8.16666 12.3333 8.8751 12.0418 9.45866 11.4586C10.0418 10.8751 10.3333 10.1666 10.3333 9.33331C10.3333 8.49998 10.0418 7.79153 9.45866 7.20798C8.8751 6.62487 8.16666 6.33331 7.33332 6.33331C6.49999 6.33331 5.79155 6.62487 5.20799 7.20798C4.62488 7.79153 4.33332 8.49998 4.33332 9.33331C4.33332 10.1666 4.62488 10.8751 5.20799 11.4586C5.79155 12.0418 6.49999 12.3333 7.33332 12.3333ZM12.6667 3.99998H12C11.8111 3.99998 11.6529 3.9362 11.5253 3.80865C11.3973 3.68065 11.3333 3.5222 11.3333 3.33331C11.3333 3.14442 11.3973 2.98598 11.5253 2.85798C11.6529 2.73042 11.8111 2.66665 12 2.66665H12.6667V1.99998C12.6667 1.81109 12.7307 1.65265 12.8587 1.52465C12.9862 1.39709 13.1444 1.33331 13.3333 1.33331C13.5222 1.33331 13.6804 1.39709 13.808 1.52465C13.936 1.65265 14 1.81109 14 1.99998V2.66665H14.6667C14.8555 2.66665 15.0138 2.73042 15.1413 2.85798C15.2693 2.98598 15.3333 3.14442 15.3333 3.33331C15.3333 3.5222 15.2693 3.68065 15.1413 3.80865C15.0138 3.9362 14.8555 3.99998 14.6667 3.99998H14V4.66665C14 4.85553 13.936 5.01398 13.808 5.14198C13.6804 5.26953 13.5222 5.33331 13.3333 5.33331C13.1444 5.33331 12.9862 5.26953 12.8587 5.14198C12.7307 5.01398 12.6667 4.85553 12.6667 4.66665V3.99998Z", fill: "currentColor" }))), this.size === 24 && (h(Fragment, null, h("path", { d: "M3 22C2.45 22 1.97933 21.8043 1.588 21.413C1.196 21.021 1 20.55 1 20V8C1 7.45 1.196 6.97933 1.588 6.588C1.97933 6.196 2.45 6 3 6H6.15L7.4 4.65C7.58333 4.45 7.804 4.29167 8.062 4.175C8.32067 4.05833 8.59167 4 8.875 4H13C13.2833 4 13.521 4.09567 13.713 4.287C13.9043 4.479 14 4.71667 14 5V7C14 7.28333 14.096 7.521 14.288 7.713C14.4793 7.90433 14.7167 8 15 8H17V10C17 10.2833 17.096 10.5207 17.288 10.712C17.4793 10.904 17.7167 11 18 11H20C20.2833 11 20.5207 11.0957 20.712 11.287C20.904 11.479 21 11.7167 21 12V20C21 20.55 20.8043 21.021 20.413 21.413C20.021 21.8043 19.55 22 19 22H3ZM11 18.5C12.25 18.5 13.3127 18.0627 14.188 17.188C15.0627 16.3127 15.5 15.25 15.5 14C15.5 12.75 15.0627 11.6873 14.188 10.812C13.3127 9.93733 12.25 9.5 11 9.5C9.75 9.5 8.68733 9.93733 7.812 10.812C6.93733 11.6873 6.5 12.75 6.5 14C6.5 15.25 6.93733 16.3127 7.812 17.188C8.68733 18.0627 9.75 18.5 11 18.5ZM19 6H18C17.7167 6 17.4793 5.90433 17.288 5.713C17.096 5.521 17 5.28333 17 5C17 4.71667 17.096 4.479 17.288 4.287C17.4793 4.09567 17.7167 4 18 4H19V3C19 2.71667 19.096 2.479 19.288 2.287C19.4793 2.09567 19.7167 2 20 2C20.2833 2 20.5207 2.09567 20.712 2.287C20.904 2.479 21 2.71667 21 3V4H22C22.2833 4 22.5207 4.09567 22.712 4.287C22.904 4.479 23 4.71667 23 5C23 5.28333 22.904 5.521 22.712 5.713C22.5207 5.90433 22.2833 6 22 6H21V7C21 7.28333 20.904 7.521 20.712 7.713C20.5207 7.90433 20.2833 8 20 8C19.7167 8 19.4793 7.90433 19.288 7.713C19.096 7.521 19 7.28333 19 7V6Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, null, h("path", { d: "M3.49999 25.6666C2.85832 25.6666 2.30921 25.4384 1.85266 24.9818C1.39532 24.5245 1.16666 23.975 1.16666 23.3333V9.33331C1.16666 8.69165 1.39532 8.14254 1.85266 7.68598C2.30921 7.22865 2.85832 6.99998 3.49999 6.99998H7.17499L8.63332 5.42498C8.84721 5.19165 9.10466 5.00692 9.40566 4.87081C9.70743 4.7347 10.0236 4.66665 10.3542 4.66665H15.1667C15.4972 4.66665 15.7745 4.77826 15.9985 5.00148C16.2217 5.22548 16.3333 5.50276 16.3333 5.83331V8.16665C16.3333 8.4972 16.4453 8.77448 16.6693 8.99848C16.8925 9.2217 17.1694 9.33331 17.5 9.33331H19.8333V11.6666C19.8333 11.9972 19.9453 12.2741 20.1693 12.4973C20.3925 12.7213 20.6694 12.8333 21 12.8333H23.3333C23.6639 12.8333 23.9408 12.9449 24.164 13.1681C24.388 13.3921 24.5 13.6694 24.5 14V23.3333C24.5 23.975 24.2717 24.5245 23.8152 24.9818C23.3578 25.4384 22.8083 25.6666 22.1667 25.6666H3.49999ZM12.8333 21.5833C14.2917 21.5833 15.5314 21.0731 16.5527 20.0526C17.5731 19.0314 18.0833 17.7916 18.0833 16.3333C18.0833 14.875 17.5731 13.6352 16.5527 12.614C15.5314 11.5935 14.2917 11.0833 12.8333 11.0833C11.375 11.0833 10.1352 11.5935 9.11399 12.614C8.09354 13.6352 7.58332 14.875 7.58332 16.3333C7.58332 17.7916 8.09354 19.0314 9.11399 20.0526C10.1352 21.0731 11.375 21.5833 12.8333 21.5833ZM22.1667 6.99998H21C20.6694 6.99998 20.3925 6.88837 20.1693 6.66515C19.9453 6.44115 19.8333 6.16387 19.8333 5.83331C19.8333 5.50276 19.9453 5.22548 20.1693 5.00148C20.3925 4.77826 20.6694 4.66665 21 4.66665H22.1667V3.49998C22.1667 3.16942 22.2787 2.89215 22.5027 2.66815C22.7259 2.44492 23.0028 2.33331 23.3333 2.33331C23.6639 2.33331 23.9408 2.44492 24.164 2.66815C24.388 2.89215 24.5 3.16942 24.5 3.49998V4.66665H25.6667C25.9972 4.66665 26.2741 4.77826 26.4973 5.00148C26.7213 5.22548 26.8333 5.50276 26.8333 5.83331C26.8333 6.16387 26.7213 6.44115 26.4973 6.66515C26.2741 6.88837 25.9972 6.99998 25.6667 6.99998H24.5V8.16665C24.5 8.4972 24.388 8.77448 24.164 8.99848C23.9408 9.2217 23.6639 9.33331 23.3333 9.33331C23.0028 9.33331 22.7259 9.2217 22.5027 8.99848C22.2787 8.77448 22.1667 8.4972 22.1667 8.16665V6.99998Z", fill: "currentColor" })))));
+  }
+};
+FlipIconAddPhoto.style = flipIconCss;
+
+export { FlipIconAddPhoto as flip_icon_add_photo };

package/dist/esm/flip-icon-add.entry.js

@@ -0,0 +1,16 @@
+import { r as registerInstance, h, F as Fragment } from './index-36517fab.js';
+
+const flipIconCss = ":host{display:inline-flex}";
+
+const FlipIconAdd = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    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: "M8 12.7666C7.78889 12.7666 7.60845 12.6915 7.45867 12.5413C7.30845 12.3915 7.23334 12.2111 7.23334 11.9999V8.76661H4C3.78889 8.76661 3.60845 8.6915 3.45867 8.54128C3.30845 8.3915 3.23334 8.21105 3.23334 7.99994C3.23334 7.78883 3.30845 7.60839 3.45867 7.45861C3.60845 7.30839 3.78889 7.23328 4 7.23328H7.23334V3.99994C7.23334 3.78883 7.30845 3.60817 7.45867 3.45794C7.60845 3.30817 7.78889 3.23328 8 3.23328C8.21112 3.23328 8.39156 3.30817 8.54134 3.45794C8.69156 3.60817 8.76667 3.78883 8.76667 3.99994V7.23328H12C12.2111 7.23328 12.3916 7.30839 12.5413 7.45861C12.6916 7.60839 12.7667 7.78883 12.7667 7.99994C12.7667 8.21105 12.6916 8.3915 12.5413 8.54128C12.3916 8.6915 12.2111 8.76661 12 8.76661H8.76667V11.9999C8.76667 12.2111 8.69156 12.3915 8.54134 12.5413C8.39156 12.6915 8.21112 12.7666 8 12.7666V12.7666Z", fill: "currentColor" }))), this.size === 24 && (h(Fragment, null, h("path", { d: "M12 19.15C11.6833 19.15 11.4127 19.0373 11.188 18.812C10.9627 18.5873 10.85 18.3166 10.85 18V13.15H6.00001C5.68334 13.15 5.41267 13.0373 5.18801 12.812C4.96267 12.5873 4.85001 12.3166 4.85001 12C4.85001 11.6833 4.96267 11.4126 5.18801 11.188C5.41267 10.9626 5.68334 10.85 6.00001 10.85H10.85V5.99998C10.85 5.68331 10.9627 5.41231 11.188 5.18698C11.4127 4.96231 11.6833 4.84998 12 4.84998C12.3167 4.84998 12.5873 4.96231 12.812 5.18698C13.0373 5.41231 13.15 5.68331 13.15 5.99998V10.85H18C18.3167 10.85 18.5873 10.9626 18.812 11.188C19.0373 11.4126 19.15 11.6833 19.15 12C19.15 12.3166 19.0373 12.5873 18.812 12.812C18.5873 13.0373 18.3167 13.15 18 13.15H13.15V18C13.15 18.3166 13.0373 18.5873 12.812 18.812C12.5873 19.0373 12.3167 19.15 12 19.15Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, null, h("path", { d: "M14 22.3417C13.6305 22.3417 13.3148 22.2102 13.0527 21.9473C12.7898 21.6852 12.6583 21.3694 12.6583 21V15.3417H6.99999C6.63055 15.3417 6.31477 15.2102 6.05266 14.9473C5.78977 14.6852 5.65833 14.3694 5.65833 14C5.65833 13.6305 5.78977 13.3148 6.05266 13.0527C6.31477 12.7898 6.63055 12.6583 6.99999 12.6583H12.6583V6.99999C12.6583 6.63055 12.7898 6.31438 13.0527 6.05149C13.3148 5.78938 13.6305 5.65833 14 5.65833C14.3694 5.65833 14.6852 5.78938 14.9473 6.05149C15.2102 6.31438 15.3417 6.63055 15.3417 6.99999V12.6583H21C21.3694 12.6583 21.6852 12.7898 21.9473 13.0527C22.2102 13.3148 22.3417 13.6305 22.3417 14C22.3417 14.3694 22.2102 14.6852 21.9473 14.9473C21.6852 15.2102 21.3694 15.3417 21 15.3417H15.3417V21C15.3417 21.3694 15.2102 21.6852 14.9473 21.9473C14.6852 22.2102 14.3694 22.3417 14 22.3417V22.3417Z", fill: "currentColor" })))));
+  }
+};
+FlipIconAdd.style = flipIconCss;
+
+export { FlipIconAdd as flip_icon_add };

package/dist/esm/flip-icon-admin-panel-settings.entry.js

@@ -0,0 +1,16 @@
+import { r as registerInstance, h, F as Fragment } from './index-36517fab.js';
+
+const flipIconCss = ":host{display:inline-flex}";
+
+const FlipIconAdminPanelSettings = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    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: "M11.3333 7.27165C11.56 7.27165 11.78 7.29831 12 7.33165V4.99165C12 4.45831 11.6867 3.97831 11.2 3.77165L7.53333 2.17165C7.19333 2.02498 6.80667 2.02498 6.46667 2.17165L2.8 3.77165C2.31333 3.98498 2 4.46498 2 4.99165V7.39165C2 10.4183 4.13333 13.2516 7 13.9383C7.36667 13.8516 7.72 13.725 8.06667 13.5716C7.60667 12.9183 7.33333 12.125 7.33333 11.2716C7.33333 9.06498 9.12667 7.27165 11.3333 7.27165Z", fill: "currentColor" }), h("path", { d: "M11.3333 8.60498C9.86 8.60498 8.66667 9.79831 8.66667 11.2716C8.66667 12.745 9.86 13.9383 11.3333 13.9383C12.8067 13.9383 14 12.745 14 11.2716C14 9.79831 12.8067 8.60498 11.3333 8.60498ZM11.3333 9.52498C11.7467 9.52498 12.08 9.86498 12.08 10.2716C12.08 10.6783 11.74 11.0183 11.3333 11.0183C10.9267 11.0183 10.5867 10.6783 10.5867 10.2716C10.5867 9.86498 10.92 9.52498 11.3333 9.52498ZM11.3333 13.105C10.7133 13.105 10.1733 12.7983 9.84 12.325C9.87333 11.845 10.8467 11.605 11.3333 11.605C11.82 11.605 12.7933 11.845 12.8267 12.325C12.4933 12.7983 11.9533 13.105 11.3333 13.105Z", fill: "currentColor" }))), this.size === 24 && (h(Fragment, null, h("path", { d: "M17 10.9075C17.34 10.9075 17.67 10.9475 18 10.9975V7.48753C18 6.68753 17.53 5.96753 16.8 5.65753L11.3 3.25753C10.79 3.03753 10.21 3.03753 9.7 3.25753L4.2 5.65753C3.47 5.97753 3 6.69753 3 7.48753V11.0875C3 15.6275 6.2 19.8775 10.5 20.9075C11.05 20.7775 11.58 20.5875 12.1 20.3575C11.41 19.3775 11 18.1875 11 16.9075C11 13.5975 13.69 10.9075 17 10.9075Z", fill: "currentColor" }), h("path", { d: "M17 12.9075C14.79 12.9075 13 14.6975 13 16.9075C13 19.1175 14.79 20.9075 17 20.9075C19.21 20.9075 21 19.1175 21 16.9075C21 14.6975 19.21 12.9075 17 12.9075ZM17 14.2875C17.62 14.2875 18.12 14.7975 18.12 15.4075C18.12 16.0175 17.61 16.5275 17 16.5275C16.39 16.5275 15.88 16.0175 15.88 15.4075C15.88 14.7975 16.38 14.2875 17 14.2875ZM17 19.6575C16.07 19.6575 15.26 19.1975 14.76 18.4875C14.81 17.7675 16.27 17.4075 17 17.4075C17.73 17.4075 19.19 17.7675 19.24 18.4875C18.74 19.1975 17.93 19.6575 17 19.6575Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, null, h("path", { d: "M19.8333 12.7254C20.23 12.7254 20.615 12.7721 21 12.8304V8.73541C21 7.80208 20.4517 6.96208 19.6 6.60041L13.1833 3.80041C12.5883 3.54374 11.9117 3.54374 11.3167 3.80041L4.9 6.60041C4.04833 6.97374 3.5 7.81374 3.5 8.73541V12.9354C3.5 18.2321 7.23333 23.1904 12.25 24.3921C12.8917 24.2404 13.51 24.0187 14.1167 23.7504C13.3117 22.6071 12.8333 21.2187 12.8333 19.7254C12.8333 15.8637 15.9717 12.7254 19.8333 12.7254Z", fill: "currentColor" }), h("path", { d: "M19.8333 15.0587C17.255 15.0587 15.1667 17.1471 15.1667 19.7254C15.1667 22.3037 17.255 24.3921 19.8333 24.3921C22.4117 24.3921 24.5 22.3037 24.5 19.7254C24.5 17.1471 22.4117 15.0587 19.8333 15.0587ZM19.8333 16.6687C20.5567 16.6687 21.14 17.2637 21.14 17.9754C21.14 18.6871 20.545 19.2821 19.8333 19.2821C19.1217 19.2821 18.5267 18.6871 18.5267 17.9754C18.5267 17.2637 19.11 16.6687 19.8333 16.6687ZM19.8333 22.9337C18.7483 22.9337 17.8033 22.3971 17.22 21.5687C17.2783 20.7287 18.9817 20.3087 19.8333 20.3087C20.685 20.3087 22.3883 20.7287 22.4467 21.5687C21.8633 22.3971 20.9183 22.9337 19.8333 22.9337Z", fill: "currentColor" })))));
+  }
+};
+FlipIconAdminPanelSettings.style = flipIconCss;
+
+export { FlipIconAdminPanelSettings as flip_icon_admin_panel_settings };

package/dist/esm/flip-icon-arrow-back.entry.js

@@ -0,0 +1,16 @@
+import { r as registerInstance, h, F as Fragment } from './index-36517fab.js';
+
+const flipIconCss = ":host{display:inline-flex}";
+
+const FlipIconArrowBack = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    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: "M9.50758 13.1114L4.83311 8.45076C4.77762 8.38603 4.73601 8.31668 4.70827 8.2427C4.68053 8.16872 4.66666 8.09012 4.66666 8.00689C4.66666 7.92367 4.68053 7.84507 4.70827 7.77109C4.73601 7.69711 4.77762 7.62776 4.83311 7.56303L9.50758 2.88856C9.65553 2.7406 9.83826 2.66663 10.0558 2.66663C10.2729 2.66663 10.4554 2.74523 10.6034 2.90243C10.7606 3.05039 10.8392 3.2283 10.8392 3.43618C10.8392 3.64443 10.7606 3.82715 10.6034 3.98435L6.58083 8.00689L10.6034 12.0294C10.7513 12.1774 10.8253 12.3553 10.8253 12.5632C10.8253 12.7714 10.7467 12.9542 10.5895 13.1114C10.4415 13.2593 10.2634 13.3333 10.0552 13.3333C9.84732 13.3333 9.66478 13.2593 9.50758 13.1114V13.1114Z", fill: "currentColor" }))), this.size === 24 && (h(Fragment, null, h("path", { d: "M14.2614 19.6671L7.24967 12.6762C7.16645 12.5791 7.10403 12.4751 7.06242 12.3641C7.02081 12.2531 7 12.1352 7 12.0104C7 11.8856 7.02081 11.7677 7.06242 11.6567C7.10403 11.5457 7.16645 11.4417 7.24967 11.3446L14.2614 4.3329C14.4833 4.11097 14.7574 4 15.0836 4C15.4093 4 15.6831 4.1179 15.9051 4.35371C16.1409 4.57564 16.2588 4.84251 16.2588 5.15433C16.2588 5.4667 16.1409 5.74079 15.9051 5.97659L9.87126 12.0104L15.9051 18.0442C16.127 18.2661 16.238 18.533 16.238 18.8448C16.238 19.1572 16.1201 19.4313 15.8843 19.6671C15.6623 19.889 15.3952 20 15.0828 20C14.771 20 14.4972 19.889 14.2614 19.6671Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, null, h("path", { d: "M16.6383 22.9449L8.45794 14.7889C8.36085 14.6756 8.28803 14.5542 8.23948 14.4248C8.19093 14.2953 8.16666 14.1577 8.16666 14.0121C8.16666 13.8665 8.19093 13.7289 8.23948 13.5994C8.28803 13.47 8.36085 13.3486 8.45794 13.2353L16.6383 5.05501C16.8972 4.79609 17.217 4.66663 17.5976 4.66663C17.9775 4.66663 18.297 4.80418 18.5559 5.07928C18.831 5.33821 18.9686 5.64956 18.9686 6.01334C18.9686 6.37778 18.831 6.69755 18.5559 6.97265L11.5165 14.0121L18.5559 21.0515C18.8148 21.3105 18.9443 21.6218 18.9443 21.9856C18.9443 22.35 18.8067 22.6698 18.5316 22.9449C18.2727 23.2038 17.961 23.3333 17.5966 23.3333C17.2328 23.3333 16.9134 23.2038 16.6383 22.9449V22.9449Z", fill: "currentColor" })))));
+  }
+};
+FlipIconArrowBack.style = flipIconCss;
+
+export { FlipIconArrowBack as flip_icon_arrow_back };

package/dist/esm/flip-icon-arrow-forward.entry.js

@@ -0,0 +1,16 @@
+import { r as registerInstance, h, F as Fragment } from './index-36517fab.js';
+
+const flipIconCss = ":host{display:inline-flex}";
+
+const FlipIconArrowForward = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    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: "M6.4916 13.1114L11.1661 8.45076C11.2216 8.38603 11.2632 8.31668 11.2909 8.2427C11.3187 8.16872 11.3325 8.09012 11.3325 8.00689C11.3325 7.92367 11.3187 7.84507 11.2909 7.77109C11.2632 7.69711 11.2216 7.62776 11.1661 7.56303L6.4916 2.88856C6.34365 2.7406 6.16092 2.66663 5.94343 2.66663C5.7263 2.66663 5.54376 2.74523 5.39581 2.90243C5.2386 3.05039 5.16 3.2283 5.16 3.43618C5.16 3.64443 5.2386 3.82715 5.39581 3.98435L9.41835 8.00689L5.39581 12.0294C5.24785 12.1774 5.17387 12.3553 5.17387 12.5632C5.17387 12.7714 5.25248 12.9542 5.40968 13.1114C5.55763 13.2593 5.73574 13.3333 5.94398 13.3333C6.15186 13.3333 6.3344 13.2593 6.4916 13.1114Z", fill: "currentColor" }))), this.size === 24 && (h(Fragment, null, h("path", { d: "M9.73739 19.6671L16.7491 12.6762C16.8323 12.5791 16.8947 12.4751 16.9363 12.3641C16.978 12.2531 16.9988 12.1352 16.9988 12.0104C16.9988 11.8856 16.978 11.7677 16.9363 11.6567C16.8947 11.5457 16.8323 11.4417 16.7491 11.3446L9.73739 4.3329C9.51546 4.11097 9.24137 4 8.91513 4C8.58944 4 8.31563 4.1179 8.0937 4.35371C7.85789 4.57564 7.73999 4.84251 7.73999 5.15433C7.73999 5.4667 7.85789 5.74079 8.0937 5.97659L14.1275 12.0104L8.0937 18.0442C7.87176 18.2661 7.7608 18.533 7.7608 18.8448C7.7608 19.1572 7.8787 19.4313 8.1145 19.6671C8.33643 19.889 8.60359 20 8.91596 20C9.22778 20 9.50159 19.889 9.73739 19.6671Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, null, h("path", { d: "M11.3603 22.9449L19.5406 14.7889C19.6377 14.6756 19.7105 14.5542 19.7591 14.4248C19.8076 14.2953 19.8319 14.1577 19.8319 14.0121C19.8319 13.8665 19.8076 13.7289 19.7591 13.5994C19.7105 13.47 19.6377 13.3486 19.5406 13.2353L11.3603 5.05501C11.1014 4.79609 10.7816 4.66663 10.401 4.66663C10.021 4.66663 9.70158 4.80418 9.44266 5.07928C9.16755 5.33821 9.03 5.64956 9.03 6.01334C9.03 6.37778 9.16755 6.69755 9.44266 6.97265L16.4821 14.0121L9.44266 21.0515C9.18373 21.3105 9.05427 21.6218 9.05427 21.9856C9.05427 22.35 9.19182 22.6698 9.46693 22.9449C9.72585 23.2038 10.0375 23.3333 10.402 23.3333C10.7657 23.3333 11.0852 23.2038 11.3603 22.9449Z", fill: "currentColor" })))));
+  }
+};
+FlipIconArrowForward.style = flipIconCss;
+
+export { FlipIconArrowForward as flip_icon_arrow_forward };

package/dist/esm/flip-icon-arrow-right-small.entry.js

@@ -0,0 +1,16 @@
+import { r as registerInstance, h, F as Fragment } from './index-36517fab.js';
+
+const flipIconCss = ":host{display:inline-flex}";
+
+const FlipIconArrowRightSmall = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    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: "M7.60918 10.1958L9.33584 8.46918C9.59584 8.20918 9.59584 7.78918 9.33584 7.52918L7.60918 5.80251C7.18918 5.38251 6.46918 5.68251 6.46918 6.27584L6.46918 9.72918C6.46918 10.3225 7.18918 10.6158 7.60918 10.1958Z", fill: "currentColor" }))), this.size === 24 && (h(Fragment, null, h("path", { d: "M11.4137 15.2938L14.0037 12.7038C14.3937 12.3138 14.3937 11.6838 14.0037 11.2938L11.4137 8.70379C10.7837 8.07379 9.70374 8.52379 9.70374 9.41379L9.70374 14.5938C9.70374 15.4838 10.7837 15.9238 11.4137 15.2938Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, null, h("path", { d: "M13.316 17.8427L16.3377 14.821C16.7927 14.366 16.7927 13.631 16.3377 13.176L13.316 10.1544C12.581 9.41938 11.321 9.94438 11.321 10.9827L11.321 17.026C11.321 18.0644 12.581 18.5777 13.316 17.8427Z", fill: "currentColor" })))));
+  }
+};
+FlipIconArrowRightSmall.style = flipIconCss;
+
+export { FlipIconArrowRightSmall as flip_icon_arrow_right_small };

package/dist/esm/flip-icon-attachment.entry.js

@@ -0,0 +1,16 @@
+import { r as registerInstance, h, F as Fragment } from './index-36517fab.js';
+
+const flipIconCss = ":host{display:inline-flex}";
+
+const FlipIconAttachment = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    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: "M8.57157 12.8796C7.81732 13.6338 6.91584 14.0089 5.86712 14.0048C4.81809 14.0011 3.92038 13.626 3.17399 12.8796C2.41974 12.1253 2.04073 11.2237 2.03696 10.1747C2.03287 9.12594 2.40795 8.22446 3.1622 7.47021L8.15909 2.47333C8.7012 1.93121 9.35913 1.66204 10.1329 1.66581C10.9069 1.6699 11.565 1.943 12.1071 2.48511C12.6492 3.02723 12.9203 3.68327 12.9203 4.45323C12.9203 5.22319 12.6492 5.87922 12.1071 6.42134L7.60519 10.9233C7.25949 11.2689 6.84513 11.4438 6.3621 11.4479C5.87875 11.4517 5.46423 11.2807 5.11853 10.935C4.76498 10.5815 4.59024 10.1632 4.59433 9.68016C4.5981 9.19681 4.77283 8.78229 5.11853 8.43659L9.21975 4.33537C9.32974 4.22538 9.46127 4.16834 9.61432 4.16425C9.76768 4.16048 9.90329 4.21752 10.0211 4.33537C10.1311 4.44537 10.1842 4.57705 10.1805 4.73041C10.1764 4.88346 10.1193 5.01498 10.0094 5.12498L5.90813 9.2262C5.78243 9.3519 5.71957 9.50118 5.71957 9.67403C5.71957 9.84688 5.78635 10.0001 5.91992 10.1337C6.04563 10.2594 6.1949 10.3222 6.36775 10.3222C6.5406 10.3222 6.68988 10.2594 6.81559 10.1337L11.3175 5.63174C11.6475 5.30175 11.8125 4.90892 11.8125 4.45323C11.8125 3.99753 11.6475 3.6047 11.3175 3.27471C10.9875 2.94473 10.5947 2.77974 10.139 2.77974C9.6833 2.77974 9.29046 2.94473 8.96048 3.27471L3.96359 8.2716C3.43719 8.798 3.17399 9.43424 3.17399 10.1803C3.17399 10.927 3.43719 11.5636 3.96359 12.09C4.48999 12.6164 5.1245 12.8775 5.86712 12.8735C6.60943 12.8697 7.24378 12.6046 7.77018 12.0782L12.3664 7.482C12.4764 7.372 12.6099 7.31701 12.7671 7.31701C12.9242 7.31701 13.0578 7.372 13.1678 7.482C13.2856 7.59985 13.3425 7.7353 13.3384 7.88835C13.3346 8.04171 13.2778 8.17339 13.1678 8.28339L8.57157 12.8796Z", fill: "currentColor" }))), this.size === 24 && (h(Fragment, null, h("path", { d: "M12.8574 19.3194C11.726 20.4507 10.3738 21.0134 8.80068 21.0072C7.22713 21.0016 5.88057 20.439 4.76098 19.3194C3.62961 18.188 3.0611 16.8355 3.05544 15.262C3.04931 13.6889 3.61193 12.3367 4.7433 11.2053L12.2386 3.70999C13.0518 2.89682 14.0387 2.49306 15.1993 2.49872C16.3604 2.50484 17.3475 2.91449 18.1607 3.72767C18.9738 4.54084 19.3804 5.5249 19.3804 6.67984C19.3804 7.83478 18.9738 8.81884 18.1607 9.63201L11.4078 16.3849C10.8892 16.9034 10.2677 17.1658 9.54314 17.1719C8.81812 17.1775 8.19634 16.9211 7.6778 16.4026C7.14747 15.8722 6.88536 15.2448 6.89149 14.5202C6.89715 13.7952 7.15925 13.1734 7.6778 12.6549L13.8296 6.50306C13.9946 6.33807 14.1919 6.25251 14.4215 6.24638C14.6515 6.24072 14.8549 6.32628 15.0317 6.50306C15.1967 6.66805 15.2764 6.86557 15.2707 7.09562C15.2646 7.32519 15.179 7.52247 15.014 7.68747L8.8622 13.8393C8.67364 14.0279 8.57936 14.2518 8.57936 14.511C8.57936 14.7703 8.67953 15.0001 8.87988 15.2005C9.06844 15.389 9.29236 15.4833 9.55163 15.4833C9.8109 15.4833 10.0348 15.389 10.2234 15.2005L16.9762 8.4476C17.4712 7.95263 17.7187 7.36337 17.7187 6.67984C17.7187 5.9963 17.4712 5.40704 16.9762 4.91207C16.4813 4.4171 15.892 4.16961 15.2085 4.16961C14.5249 4.16961 13.9357 4.4171 13.4407 4.91207L5.94538 12.4074C5.15578 13.197 4.76098 14.1514 4.76098 15.2705C4.76098 16.3905 5.15578 17.3454 5.94538 18.135C6.73499 18.9246 7.68675 19.3163 8.80068 19.3102C9.91414 19.3045 10.8657 18.9069 11.6553 18.1173L18.5496 11.223C18.7146 11.058 18.9149 10.9755 19.1506 10.9755C19.3863 10.9755 19.5867 11.058 19.7516 11.223C19.9284 11.3998 20.0137 11.603 20.0076 11.8325C20.002 12.0626 19.9166 12.2601 19.7516 12.4251L12.8574 19.3194Z", fill: "currentColor" }))), this.size === 28 && (h(Fragment, null, h("path", { d: "M15.0003 22.5393C13.6803 23.8593 12.1027 24.5157 10.2675 24.5085C8.43167 24.5019 6.86068 23.8455 5.55449 22.5393C4.23456 21.2194 3.57129 19.6415 3.56469 17.8057C3.55754 15.9705 4.21394 14.3929 5.53387 13.0729L14.2784 4.32838C15.2271 3.37968 16.3785 2.90863 17.7325 2.91523C19.0871 2.92238 20.2387 3.4003 21.1874 4.34901C22.1361 5.29771 22.6105 6.44578 22.6105 7.79321C22.6105 9.14064 22.1361 10.2887 21.1874 11.2374L13.3091 19.1158C12.7041 19.7207 11.979 20.0268 11.1337 20.0339C10.2878 20.0405 9.56241 19.7413 8.95744 19.1364C8.33873 18.5177 8.03294 17.7856 8.04009 16.9403C8.04669 16.0945 8.35247 15.3691 8.95744 14.7641L16.1346 7.58697C16.3271 7.39448 16.5572 7.29466 16.8251 7.28751C17.0935 7.28091 17.3308 7.38073 17.537 7.58697C17.7295 7.77946 17.8224 8.00989 17.8158 8.27828C17.8087 8.54612 17.7089 8.77628 17.5164 8.96877L10.3392 16.1459C10.1193 16.3659 10.0093 16.6271 10.0093 16.9296C10.0093 17.2321 10.1261 17.5002 10.3599 17.7339C10.5799 17.9539 10.8411 18.0639 11.1436 18.0639C11.4461 18.0639 11.7073 17.9539 11.9273 17.7339L19.8056 9.8556C20.3831 9.27813 20.6718 8.59066 20.6718 7.79321C20.6718 6.99575 20.3831 6.30828 19.8056 5.73081C19.2282 5.15334 18.5407 4.8646 17.7432 4.8646C16.9458 4.8646 16.2583 5.15334 15.6808 5.73081L6.9363 14.4754C6.01509 15.3966 5.55449 16.51 5.55449 17.8156C5.55449 19.1224 6.01509 20.2363 6.9363 21.1575C7.8575 22.0787 8.96789 22.5358 10.2675 22.5286C11.5665 22.522 12.6766 22.0581 13.5978 21.1369L21.6412 13.0936C21.8337 12.9011 22.0674 12.8048 22.3424 12.8048C22.6174 12.8048 22.8511 12.9011 23.0436 13.0936C23.2498 13.2998 23.3494 13.5368 23.3422 13.8047C23.3356 14.0731 23.2361 14.3035 23.0436 14.496L15.0003 22.5393Z", fill: "currentColor" })))));
+  }
+};
+FlipIconAttachment.style = flipIconCss;
+
+export { FlipIconAttachment as flip_icon_attachment };