@floegence/floe-webapp-core 0.66.1 → 0.67.1

package/dist/components/icons/refreshPaths.d.ts

@@ -0,0 +1 @@
+export declare const refreshIconPaths: readonly ["M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8", "M21 3v5h-5", "M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16", "M8 16H3v5"];

package/dist/components/icons/refreshPaths.js

@@ -0,0 +1,9 @@
+const M = [
+  "M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8",
+  "M21 3v5h-5",
+  "M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16",
+  "M8 16H3v5"
+];
+export {
+  M as refreshIconPaths
+};

package/dist/floe.css

@@ -1,3 +1,4 @@
+@import './progress-shimmer.css';
 @import './primitives.css';
 @import './input-focus.css';
 @import './surface.css';

package/dist/progress-shimmer.css

@@ -0,0 +1,106 @@
+@layer components {
+  /* Opt-in progress only: text keeps one accessible copy and surface paint
+   * sits below content. The host owns operation state and removes the attribute
+   * on settlement. Both published CSS entries expose this contract. */
+  @keyframes floe-progress-shimmer {
+    0% {
+      background-position: 100% center;
+    }
+    100% {
+      background-position: 0% center;
+    }
+  }
+
+  :is([data-floe-progress-shimmer='text'], .processing-text-shimmer) {
+    color: var(--floe-progress-text-base);
+  }
+
+  :is([data-floe-progress-shimmer='text'], .processing-text-shimmer)::selection,
+  :is([data-floe-progress-shimmer='text'], .processing-text-shimmer) ::selection {
+    -webkit-text-fill-color: var(--selection-fg);
+  }
+
+  @supports (background-clip: text) {
+    :is([data-floe-progress-shimmer='text'], .processing-text-shimmer) {
+      background-image: linear-gradient(
+        90deg in srgb,
+        var(--floe-progress-text-base) 43%,
+        var(--floe-progress-text-peak) 46%,
+        var(--floe-progress-text-peak) 54%,
+        var(--floe-progress-text-base) 57%
+      );
+      background-size: 250% 100%;
+      -webkit-background-clip: text;
+      background-clip: text;
+      -webkit-text-fill-color: transparent;
+      animation: floe-progress-shimmer 2.4s linear infinite;
+    }
+  }
+
+  [data-floe-progress-shimmer='surface'] {
+    --floe-progress-surface-base: var(
+      --floe-progress-surface-background,
+      var(--floe-progress-primary-base)
+    );
+    /* The calibrated busy fill reserves contrast for an additive white reflection. */
+    --floe-progress-surface-peak: color-mix(
+      in srgb,
+      var(--floe-progress-surface-base),
+      white var(--floe-progress-primary-white-mix)
+    );
+    position: relative;
+    isolation: isolate;
+  }
+
+  /* A busy control can be unavailable for a second submission while its
+   * progress remains fully legible. Disabled input semantics still apply. */
+  [data-floe-progress-shimmer='surface']:disabled {
+    opacity: 1 !important;
+  }
+
+  [data-floe-progress-shimmer='surface']::before {
+    content: '';
+    position: absolute;
+    inset: 0;
+    z-index: -1;
+    border-radius: inherit;
+    pointer-events: none;
+    background-image: linear-gradient(
+      100deg in srgb,
+      var(--floe-progress-surface-base) 46%,
+      var(--floe-progress-surface-peak) 50%,
+      var(--floe-progress-surface-base) 54%
+    );
+    background-size: 250% 100%;
+    animation: floe-progress-shimmer 2.4s linear infinite;
+  }
+
+  @media (prefers-reduced-motion: reduce), (forced-colors: active) {
+    :is([data-floe-progress-shimmer='text'], .processing-text-shimmer) {
+      animation: none;
+      background-image: none;
+      -webkit-text-fill-color: currentColor;
+    }
+
+    [data-floe-progress-shimmer='surface']::before {
+      animation: none;
+      background-image: none;
+      background-color: var(--floe-progress-surface-base);
+    }
+  }
+
+  @media (forced-colors: active) {
+    [data-floe-progress-shimmer='surface']::before {
+      content: none;
+    }
+
+    :is([data-floe-progress-shimmer='text'], .processing-text-shimmer) {
+      color: CanvasText;
+    }
+
+    :is([data-floe-progress-shimmer='text'], .processing-text-shimmer)::selection,
+    :is([data-floe-progress-shimmer='text'], .processing-text-shimmer) ::selection {
+      -webkit-text-fill-color: HighlightText;
+    }
+  }
+}

package/dist/standalone.css

@@ -1,3 +1,4 @@
+@import './progress-shimmer.css';
 /* First-party standalone documents: the same themes, geometry tokens and
  * material as Floe, without the shell, Tailwind utilities or renderer runtime.
  * Set .light/.dark, data-floe-shell-theme and data-floe-surface-style on <html>.