@emuanalytics/flow-rdf-ui 0.0.33 → 0.0.35

package/dist/index.mjs

@@ -26,6 +26,7 @@ import { OverlayScrollbars } from 'overlayscrollbars';
 import { unsafeHTML } from 'lit/directives/unsafe-html.js';
 import { when } from 'lit/directives/when.js';
 import { choose } from 'lit/directives/choose.js';
+export * from '@emuanalytics/flow-rdf-core';
 
 function animateTo(el, keyframes, options) {
   return new Promise((resolve) => {
@@ -3237,8 +3238,11 @@ const buttonStyles = css`
     white-space: nowrap;
     vertical-align: middle;
     padding: 0;
-    transition: var(--flow-ui-transition-x-fast) background-color, var(--flow-ui-transition-x-fast) color,
-      var(--flow-ui-transition-x-fast) border, var(--flow-ui-transition-x-fast) box-shadow;
+    transition:
+      var(--flow-ui-transition-x-fast) background-color,
+      var(--flow-ui-transition-x-fast) color,
+      var(--flow-ui-transition-x-fast) border,
+      var(--flow-ui-transition-x-fast) box-shadow;
     cursor: inherit;
   }
 
@@ -3622,35 +3626,51 @@ const buttonStyles = css`
   }
 
   /*
-   * Circle modifier
+   * FAB modifier
    */
 
-  .button--circle {
+  .button--fab {
     padding-left: 0;
     padding-right: 0;
   }
 
-  .button--circle.button--small {
+  .button--fab.button--small {
     width: var(--flow-ui-input-height-small);
-    border-radius: 50%;
+    box-shadow: var(--flow-ui-shadow-small);
   }
 
-  .button--circle.button--medium {
+  .button--fab.button--medium {
     width: var(--flow-ui-input-height-medium);
-    border-radius: 50%;
+    box-shadow: var(--flow-ui-shadow-medium);
   }
 
-  .button--circle.button--large {
+  .button--fab.button--large {
     width: var(--flow-ui-input-height-large);
-    border-radius: 50%;
+    box-shadow: var(--flow-ui-shadow-large);
   }
 
-  .button--circle .button__prefix,
-  .button--circle .button__suffix,
-  .button--circle .button__caret {
+  .button--fab .button__prefix,
+  .button--fab .button__suffix,
+  .button--fab .button__caret {
     display: none;
   }
 
+  .button--circle {
+    border-radius: 50%;
+  }
+
+  .button--square.button--small {
+    border-radius: var(--flow-ui-border-radius-small);
+  }
+
+  .button--square.button--medium {
+    border-radius: var(--flow-ui-border-radius-medium);
+  }
+
+  .button--square.button--large {
+    border-radius: var(--flow-ui-border-radius-large);
+  }
+
   /*
    * Caret modifier
    */
@@ -3784,7 +3804,12 @@ const buttonStyles = css`
    * buttons and we style them here instead.
    */
 
-  :host(.flow-ui-button-group__button--first:not(.flow-ui-button-group__button--last):not(.flow-ui-button-group__button--vertical)) .button {
+  :host(
+      .flow-ui-button-group__button--first:not(.flow-ui-button-group__button--last):not(
+          .flow-ui-button-group__button--vertical
+        )
+    )
+    .button {
     border-start-end-radius: 0;
     border-end-end-radius: 0;
   }
@@ -3793,13 +3818,21 @@ const buttonStyles = css`
     border-radius: 0;
   }
 
-  :host(.flow-ui-button-group__button--last:not(.flow-ui-button-group__button--vertical, .flow-ui-button-group__button--first)) .button {
+  :host(
+      .flow-ui-button-group__button--last:not(
+          .flow-ui-button-group__button--vertical,
+          .flow-ui-button-group__button--first
+        )
+    )
+    .button {
     border-start-start-radius: 0;
     border-end-start-radius: 0;
   }
 
   /* All except the first */
-  :host(.flow-ui-button-group__button:not(.flow-ui-button-group__button--vertical, .flow-ui-button-group__button--first)) {
+  :host(
+      .flow-ui-button-group__button:not(.flow-ui-button-group__button--vertical, .flow-ui-button-group__button--first)
+    ) {
     margin-inline-start: calc(-1 * var(--flow-ui-input-border-width));
   }
 
@@ -3809,8 +3842,7 @@ const buttonStyles = css`
           .flow-ui-button-group__button--first,
           .flow-ui-button-group__button--radio,
           .flow-ui-button-group__button--tool,
-          .flow-ui-button-group__button--vertical
-          [variant='default']
+          .flow-ui-button-group__button--vertical [variant='default']
         ):not(:hover)
     )
     .button:after {
@@ -3824,7 +3856,12 @@ const buttonStyles = css`
   }
 
   /* Variants for vertical layout of button group */
-  :host(.flow-ui-button-group__button--vertical.flow-ui-button-group__button--first:not(.flow-ui-button-group__button--last)) .button {
+  :host(
+      .flow-ui-button-group__button--vertical.flow-ui-button-group__button--first:not(
+          .flow-ui-button-group__button--last
+        )
+    )
+    .button {
     border-end-start-radius: 0;
     border-end-end-radius: 0;
   }
@@ -3838,7 +3875,6 @@ const buttonStyles = css`
     margin-block-start: calc(-1 * var(--flow-ui-input-border-width));
   }
 
-
   /* Bump hovered, focused, and checked buttons up so their focus ring isn't clipped */
   :host(.flow-ui-button-group__button--hover) {
     z-index: 1;
@@ -3849,7 +3885,8 @@ const buttonStyles = css`
     z-index: 2;
   }
 
-  :host(.flow-ui-button-group__button--focus), :host(.flow-ui-button-group__button--focus[checked]) {
+  :host(.flow-ui-button-group__button--focus),
+  :host(.flow-ui-button-group__button--focus[checked]) {
     z-index: 3;
   }
 `;
@@ -3865,7 +3902,7 @@ var __decorateClass$R = (decorators, target, key, kind) => {
     __defProp$R(target, key, result);
   return result;
 };
-let FlowButton = class extends FlowRdfElement {
+let FlowButton$1 = class FlowButton extends FlowRdfElement {
   constructor() {
     super(...arguments);
     this.formControlController = new FormControlController(this, {
@@ -3891,7 +3928,8 @@ let FlowButton = class extends FlowRdfElement {
     this.loading = false;
     this.outline = false;
     this.pill = false;
-    this.circle = false;
+    this.fabCircle = false;
+    this.fabSquare = false;
     this.type = "button";
     this.name = "";
     this.value = "";
@@ -4020,7 +4058,9 @@ let FlowButton = class extends FlowRdfElement {
       "button--medium": this.size === "medium",
       "button--large": this.size === "large",
       "button--caret": this.caret,
-      "button--circle": this.circle,
+      "button--fab": this.fabCircle || this.fabSquare,
+      "button--circle": this.fabCircle,
+      "button--square": this.fabSquare,
       "button--disabled": this.disabled,
       "button--focused": this.hasFocus,
       "button--loading": this.loading,
@@ -4062,88 +4102,94 @@ let FlowButton = class extends FlowRdfElement {
     `;
   }
 };
-FlowButton.styles = buttonStyles;
+FlowButton$1.styles = buttonStyles;
 __decorateClass$R([
   query(".button")
-], FlowButton.prototype, "button", 2);
+], FlowButton$1.prototype, "button", 2);
 __decorateClass$R([
   state()
-], FlowButton.prototype, "hasFocus", 2);
+], FlowButton$1.prototype, "hasFocus", 2);
 __decorateClass$R([
   state()
-], FlowButton.prototype, "invalid", 2);
+], FlowButton$1.prototype, "invalid", 2);
 __decorateClass$R([
   property()
-], FlowButton.prototype, "title", 2);
+], FlowButton$1.prototype, "title", 2);
 __decorateClass$R([
   property({ reflect: true })
-], FlowButton.prototype, "variant", 2);
+], FlowButton$1.prototype, "variant", 2);
 __decorateClass$R([
   property({ reflect: true })
-], FlowButton.prototype, "size", 2);
+], FlowButton$1.prototype, "size", 2);
 __decorateClass$R([
   property({ type: Boolean, reflect: true })
-], FlowButton.prototype, "caret", 2);
+], FlowButton$1.prototype, "caret", 2);
 __decorateClass$R([
   property({ type: Boolean, reflect: true })
-], FlowButton.prototype, "disabled", 2);
+], FlowButton$1.prototype, "disabled", 2);
 __decorateClass$R([
   property({ type: Boolean, reflect: true })
-], FlowButton.prototype, "loading", 2);
+], FlowButton$1.prototype, "loading", 2);
 __decorateClass$R([
   property({ type: Boolean, reflect: true })
-], FlowButton.prototype, "outline", 2);
+], FlowButton$1.prototype, "outline", 2);
 __decorateClass$R([
   property({ type: Boolean, reflect: true })
-], FlowButton.prototype, "pill", 2);
+], FlowButton$1.prototype, "pill", 2);
 __decorateClass$R([
-  property({ type: Boolean, reflect: true })
-], FlowButton.prototype, "circle", 2);
+  property({ type: Boolean, reflect: true, attribute: "fab-circle" })
+], FlowButton$1.prototype, "fabCircle", 2);
+__decorateClass$R([
+  property({ type: Boolean, reflect: true, attribute: "fab-square" })
+], FlowButton$1.prototype, "fabSquare", 2);
 __decorateClass$R([
   property()
-], FlowButton.prototype, "type", 2);
+], FlowButton$1.prototype, "type", 2);
 __decorateClass$R([
   property()
-], FlowButton.prototype, "name", 2);
+], FlowButton$1.prototype, "name", 2);
 __decorateClass$R([
   property()
-], FlowButton.prototype, "value", 2);
+], FlowButton$1.prototype, "value", 2);
 __decorateClass$R([
   property()
-], FlowButton.prototype, "href", 2);
+], FlowButton$1.prototype, "href", 2);
 __decorateClass$R([
   property()
-], FlowButton.prototype, "target", 2);
+], FlowButton$1.prototype, "target", 2);
 __decorateClass$R([
   property()
-], FlowButton.prototype, "rel", 2);
+], FlowButton$1.prototype, "rel", 2);
 __decorateClass$R([
   property()
-], FlowButton.prototype, "download", 2);
+], FlowButton$1.prototype, "download", 2);
 __decorateClass$R([
   property()
-], FlowButton.prototype, "form", 2);
+], FlowButton$1.prototype, "form", 2);
 __decorateClass$R([
   property({ attribute: "formaction" })
-], FlowButton.prototype, "formAction", 2);
+], FlowButton$1.prototype, "formAction", 2);
 __decorateClass$R([
   property({ attribute: "formenctype" })
-], FlowButton.prototype, "formEnctype", 2);
+], FlowButton$1.prototype, "formEnctype", 2);
 __decorateClass$R([
   property({ attribute: "formmethod" })
-], FlowButton.prototype, "formMethod", 2);
+], FlowButton$1.prototype, "formMethod", 2);
 __decorateClass$R([
   property({ attribute: "formnovalidate", type: Boolean })
-], FlowButton.prototype, "formNoValidate", 2);
+], FlowButton$1.prototype, "formNoValidate", 2);
 __decorateClass$R([
   property({ attribute: "formtarget" })
-], FlowButton.prototype, "formTarget", 2);
+], FlowButton$1.prototype, "formTarget", 2);
 __decorateClass$R([
   watch("disabled", { waitUntilFirstUpdate: true })
-], FlowButton.prototype, "handleDisabledChange", 1);
-FlowButton = __decorateClass$R([
+], FlowButton$1.prototype, "handleDisabledChange", 1);
+FlowButton$1 = __decorateClass$R([
   customElement("flow-ui-button")
-], FlowButton);
+], FlowButton$1);
+
+const FlowButton = FlowButton$1;
+FlowButton$1.define("flow-ui-button");
 
 const isUndefined = (val) => typeof val === "undefined";
 const isNull = (val) => val === null;
@@ -23358,7 +23404,7 @@ const translation = {
 };
 registerTranslation(translation);
 
-const version = "0.0.33";
+const version = "0.0.34";
 
 const CONSOLE_HIGHLIGHT_STYLE = `
   padding: 2px 4px;

package/dist/themes/dark.css

@@ -544,6 +544,11 @@
 
   --flow-ui-chart-stroke-color-9: var(--flow-ui-color-yellow-500);
   --flow-ui-chart-fill-color-9: var(--flow-ui-color-yellow-300);
+
+  --flow-ui-map-background-color: var(--flow-ui-color-neutral-0);
+  --flow-ui-map-busy-track-size: var(--flow-ui-spacing-2x-small);
+  --flow-ui-map-busy-track-color: transparent;
+  --flow-ui-map-busy-indicator-color: var(--flow-ui-color-primary-500);
 }
 
 .flow-ui-scroll-lock {

package/dist/themes/dark.styles.js

@@ -553,6 +553,11 @@ export default css`
 
     --flow-ui-chart-stroke-color-9: var(--flow-ui-color-yellow-500);
     --flow-ui-chart-fill-color-9: var(--flow-ui-color-yellow-300);
+
+    --flow-ui-map-background-color: var(--flow-ui-color-neutral-0);
+    --flow-ui-map-busy-track-size: var(--flow-ui-spacing-2x-small);
+    --flow-ui-map-busy-track-color: transparent;
+    --flow-ui-map-busy-indicator-color: var(--flow-ui-color-primary-500);
   }
 
   .flow-ui-scroll-lock {

package/dist/themes/light.css

@@ -545,6 +545,11 @@
 
   --flow-ui-chart-stroke-color-9: var(--flow-ui-color-yellow-500);
   --flow-ui-chart-fill-color-9: var(--flow-ui-color-yellow-300);
+
+  --flow-ui-map-background-color: var(--flow-ui-color-neutral-0);
+  --flow-ui-map-busy-track-size: var(--flow-ui-spacing-2x-small);
+  --flow-ui-map-busy-track-color: transparent;
+  --flow-ui-map-busy-indicator-color: var(--flow-ui-color-primary-500);
 }
 
 .flow-ui-scroll-lock {

package/dist/themes/light.styles.js

@@ -554,6 +554,11 @@ export default css`
 
     --flow-ui-chart-stroke-color-9: var(--flow-ui-color-yellow-500);
     --flow-ui-chart-fill-color-9: var(--flow-ui-color-yellow-300);
+
+    --flow-ui-map-background-color: var(--flow-ui-color-neutral-0);
+    --flow-ui-map-busy-track-size: var(--flow-ui-spacing-2x-small);
+    --flow-ui-map-busy-track-color: transparent;
+    --flow-ui-map-busy-indicator-color: var(--flow-ui-color-primary-500);
   }
 
   .flow-ui-scroll-lock {