@vibe/core 4.6.0-alpha-3c271.0 → 4.6.0-alpha-5c1da.0

package/dist/components/StrokeSpotlight/StrokeSpotlight.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { type StrokeSpotlightProps } from "./StrokeSpotlight.types";
+declare const StrokeSpotlight: React.ForwardRefExoticComponent<StrokeSpotlightProps & React.RefAttributes<HTMLDivElement>>;
+export default StrokeSpotlight;

package/dist/components/StrokeSpotlight/StrokeSpotlight.types.d.ts

@@ -0,0 +1,15 @@
+import { type ReactNode } from "react";
+import { type VibeComponentProps } from "../../types";
+import { type StrokeSpotlightOptions } from "./useStrokeSpotlight";
+export type StrokeSpotlightPalette = "default" | "sidekick" | "vibe";
+export interface StrokeSpotlightProps extends VibeComponentProps, StrokeSpotlightOptions {
+    children: ReactNode;
+    /** Border stroke width in px; mirrored to CSS `--border`. */
+    borderWidth?: number;
+    /** Blur radius in px of the halo bleeding outward from the stroke. */
+    glowBlur?: number;
+    /** Stroke/glow color palette. Default matches agents cyan→blue→violet. */
+    palette?: StrokeSpotlightPalette;
+    /** Corner radius in px (unitless CSS var `--radius`). */
+    radius?: number;
+}

package/dist/components/StrokeSpotlight/index.d.ts

@@ -0,0 +1,3 @@
+export { default as StrokeSpotlight } from "./StrokeSpotlight";
+export type { StrokeSpotlightProps, StrokeSpotlightPalette } from "./StrokeSpotlight.types";
+export { STROKE_NO_PULSE_ATTR, type StrokeSpotlightOptions } from "./useStrokeSpotlight";

package/dist/components/StrokeSpotlight/useStrokeSpotlight.d.ts

@@ -0,0 +1,24 @@
+import { type RefObject } from "react";
+export interface StrokeSpotlightOptions {
+    /** How far outside the box (px) the glow still responds. */
+    proximity?: number;
+    /** Fraction of half-min-side; inside this radius from center, glow is off. */
+    inactiveZone?: number;
+    /**
+     * Outward distance from the outer margins (px) over which the stroke fades
+     * from full to off. Inside the box stays full strength.
+     */
+    edgeFade?: number;
+    /** Angular width of the glowing arc (degrees). */
+    spread?: number;
+    /** Seconds for angle interpolation. */
+    movementDuration?: number;
+}
+/** Mark controls that should not trigger the click pulse (e.g. attach, model picker). */
+export declare const STROKE_NO_PULSE_ATTR = "data-stroke-no-pulse";
+/**
+ * Pointer-following conic border glow via `--start` / `--active`, plus one-shot
+ * click pulse. Traveling stroke is suppressed while the box is `:focus-within`
+ * and resumes on hover after focus leaves.
+ */
+export declare function useStrokeSpotlight(ref: RefObject<HTMLElement | null>, activeClassName: string, clickPulsingClassName: string, options?: StrokeSpotlightOptions): void;

package/dist/components/index.d.ts

@@ -50,6 +50,7 @@ export * from "./Skeleton";
 export * from "./Slider";
 export * from "./SplitButton";
 export * from "./Steps";
+export * from "./StrokeSpotlight";
 export * from "./Table";
 export * from "./Tabs";
 export { Text, type TextProps, type TextType, type TextWeight } from "@vibe/typography";

package/dist/metadata/components.json

@@ -15801,6 +15801,175 @@
     "storyUrl": "https://vibe.monday.com/?path=/docs/components-steps--docs",
     "previewUrl": "https://vibe.monday.com/iframe.html?id=components-steps--overview&viewMode=story&shortcuts=false&singleStory=true"
   },
+  {
+    "filePath": "src/components/StrokeSpotlight/StrokeSpotlight.tsx",
+    "aggregator": "core",
+    "symbols": [
+      "default as StrokeSpotlight",
+      "StrokeSpotlightProps",
+      "StrokeSpotlightPalette"
+    ],
+    "displayName": "StrokeSpotlight",
+    "description": "",
+    "props": {
+      "borderWidth": {
+        "defaultValue": {
+          "value": "2"
+        },
+        "description": "Border stroke width in px; mirrored to CSS `--border`.",
+        "name": "borderWidth",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "glowBlur": {
+        "defaultValue": {
+          "value": "12"
+        },
+        "description": "Blur radius in px of the halo bleeding outward from the stroke.",
+        "name": "glowBlur",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "palette": {
+        "defaultValue": {
+          "value": "default"
+        },
+        "description": "Stroke/glow color palette. Default matches agents cyan→blue→violet.",
+        "name": "palette",
+        "required": false,
+        "type": {
+          "name": "enum",
+          "raw": "StrokeSpotlightPalette",
+          "value": [
+            {
+              "value": "\"default\""
+            },
+            {
+              "value": "\"sidekick\""
+            },
+            {
+              "value": "\"vibe\""
+            }
+          ]
+        }
+      },
+      "radius": {
+        "defaultValue": {
+          "value": "16"
+        },
+        "description": "Corner radius in px (unitless CSS var `--radius`).",
+        "name": "radius",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "className": {
+        "defaultValue": null,
+        "description": "A CSS class name to apply to the component.",
+        "name": "className",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "data-testid": {
+        "defaultValue": null,
+        "description": "A unique identifier for testing purposes.",
+        "name": "data-testid",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "id": {
+        "defaultValue": null,
+        "description": "An HTML id attribute for the component.",
+        "name": "id",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "proximity": {
+        "defaultValue": null,
+        "description": "How far outside the box (px) the glow still responds.",
+        "name": "proximity",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "inactiveZone": {
+        "defaultValue": null,
+        "description": "Fraction of half-min-side; inside this radius from center, glow is off.",
+        "name": "inactiveZone",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "edgeFade": {
+        "defaultValue": null,
+        "description": "Outward distance from the outer margins (px) over which the stroke fades\nfrom full to off. Inside the box stays full strength.",
+        "name": "edgeFade",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "spread": {
+        "defaultValue": null,
+        "description": "Angular width of the glowing arc (degrees).",
+        "name": "spread",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "movementDuration": {
+        "defaultValue": null,
+        "description": "Seconds for angle interpolation.",
+        "name": "movementDuration",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      }
+    },
+    "import": "import { StrokeSpotlight } from \"@vibe/core\"",
+    "subComponents": []
+  },
+  {
+    "filePath": "src/components/StrokeSpotlight/useStrokeSpotlight.ts",
+    "aggregator": "core",
+    "symbols": [
+      "STROKE_NO_PULSE_ATTR",
+      "type StrokeSpotlightOptions"
+    ],
+    "displayName": "useStrokeSpotlight",
+    "description": "Pointer-following conic border glow via `--start` / `--active`, plus one-shot\nclick pulse. Traveling stroke is suppressed while the box is `:focus-within`\nand resumes on hover after focus leaves.",
+    "props": {},
+    "import": "import { useStrokeSpotlight } from \"@vibe/core\"",
+    "subComponents": []
+  },
+  {
+    "filePath": "src/components/StrokeSpotlight/useStrokeSpotlight.ts",
+    "aggregator": "core",
+    "symbols": [
+      "STROKE_NO_PULSE_ATTR",
+      "type StrokeSpotlightOptions"
+    ],
+    "displayName": "STROKE_NO_PULSE_ATTR",
+    "description": "Mark controls that should not trigger the click pulse (e.g. attach, model picker).",
+    "props": {},
+    "import": "import { STROKE_NO_PULSE_ATTR } from \"@vibe/core\"",
+    "subComponents": []
+  },
   {
     "filePath": "src/components/Table/Table/Table.tsx",
     "aggregator": "core",

package/dist/metadata/examples/StrokeSpotlight.md

@@ -0,0 +1,41 @@
+# Storybook Code Examples
+
+## Overview
+
+```tsx
+<div className={styles.stage}>
+      <div className={styles.shell}>
+        <StrokeSpotlight {...args}>
+          <ChatComposer />
+        </StrokeSpotlight>
+      </div>
+    </div>
+```
+
+## Palettes
+
+```tsx
+<div className={styles.paletteGrid}>
+      {([["default", "Default (Agents)"], ["sidekick", "Sidekick"], ["vibe", "Vibe"]] as const).map(([palette, label]) => <div key={palette} className={styles.paletteItem}>
+          <Text type="text2" weight="medium" className={styles.paletteLabel}>
+            {label}
+          </Text>
+          <StrokeSpotlight palette={palette} borderWidth={1.5} glowBlur={12} spread={40}>
+            <ChatComposer placeholder={`Compose with ${label} palette…`} />
+          </StrokeSpotlight>
+        </div>)}
+    </div>
+```
+
+## Chat composer
+
+```tsx
+<div className={styles.stage}>
+      <div className={styles.shell}>
+        <StrokeSpotlight palette="sidekick" borderWidth={1.5} glowBlur={12} spread={40} proximity={64}>
+          <ChatComposer placeholder="@ Mention boards and docs..." />
+        </StrokeSpotlight>
+      </div>
+    </div>
+```
+

package/dist/metadata.json

@@ -15801,6 +15801,175 @@
     "storyUrl": "https://vibe.monday.com/?path=/docs/components-steps--docs",
     "previewUrl": "https://vibe.monday.com/iframe.html?id=components-steps--overview&viewMode=story&shortcuts=false&singleStory=true"
   },
+  {
+    "filePath": "src/components/StrokeSpotlight/StrokeSpotlight.tsx",
+    "aggregator": "core",
+    "symbols": [
+      "default as StrokeSpotlight",
+      "StrokeSpotlightProps",
+      "StrokeSpotlightPalette"
+    ],
+    "displayName": "StrokeSpotlight",
+    "description": "",
+    "props": {
+      "borderWidth": {
+        "defaultValue": {
+          "value": "2"
+        },
+        "description": "Border stroke width in px; mirrored to CSS `--border`.",
+        "name": "borderWidth",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "glowBlur": {
+        "defaultValue": {
+          "value": "12"
+        },
+        "description": "Blur radius in px of the halo bleeding outward from the stroke.",
+        "name": "glowBlur",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "palette": {
+        "defaultValue": {
+          "value": "default"
+        },
+        "description": "Stroke/glow color palette. Default matches agents cyan→blue→violet.",
+        "name": "palette",
+        "required": false,
+        "type": {
+          "name": "enum",
+          "raw": "StrokeSpotlightPalette",
+          "value": [
+            {
+              "value": "\"default\""
+            },
+            {
+              "value": "\"sidekick\""
+            },
+            {
+              "value": "\"vibe\""
+            }
+          ]
+        }
+      },
+      "radius": {
+        "defaultValue": {
+          "value": "16"
+        },
+        "description": "Corner radius in px (unitless CSS var `--radius`).",
+        "name": "radius",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "className": {
+        "defaultValue": null,
+        "description": "A CSS class name to apply to the component.",
+        "name": "className",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "data-testid": {
+        "defaultValue": null,
+        "description": "A unique identifier for testing purposes.",
+        "name": "data-testid",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "id": {
+        "defaultValue": null,
+        "description": "An HTML id attribute for the component.",
+        "name": "id",
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "proximity": {
+        "defaultValue": null,
+        "description": "How far outside the box (px) the glow still responds.",
+        "name": "proximity",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "inactiveZone": {
+        "defaultValue": null,
+        "description": "Fraction of half-min-side; inside this radius from center, glow is off.",
+        "name": "inactiveZone",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "edgeFade": {
+        "defaultValue": null,
+        "description": "Outward distance from the outer margins (px) over which the stroke fades\nfrom full to off. Inside the box stays full strength.",
+        "name": "edgeFade",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "spread": {
+        "defaultValue": null,
+        "description": "Angular width of the glowing arc (degrees).",
+        "name": "spread",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      },
+      "movementDuration": {
+        "defaultValue": null,
+        "description": "Seconds for angle interpolation.",
+        "name": "movementDuration",
+        "required": false,
+        "type": {
+          "name": "number"
+        }
+      }
+    },
+    "import": "import { StrokeSpotlight } from \"@vibe/core\"",
+    "subComponents": []
+  },
+  {
+    "filePath": "src/components/StrokeSpotlight/useStrokeSpotlight.ts",
+    "aggregator": "core",
+    "symbols": [
+      "STROKE_NO_PULSE_ATTR",
+      "type StrokeSpotlightOptions"
+    ],
+    "displayName": "useStrokeSpotlight",
+    "description": "Pointer-following conic border glow via `--start` / `--active`, plus one-shot\nclick pulse. Traveling stroke is suppressed while the box is `:focus-within`\nand resumes on hover after focus leaves.",
+    "props": {},
+    "import": "import { useStrokeSpotlight } from \"@vibe/core\"",
+    "subComponents": []
+  },
+  {
+    "filePath": "src/components/StrokeSpotlight/useStrokeSpotlight.ts",
+    "aggregator": "core",
+    "symbols": [
+      "STROKE_NO_PULSE_ATTR",
+      "type StrokeSpotlightOptions"
+    ],
+    "displayName": "STROKE_NO_PULSE_ATTR",
+    "description": "Mark controls that should not trigger the click pulse (e.g. attach, model picker).",
+    "props": {},
+    "import": "import { STROKE_NO_PULSE_ATTR } from \"@vibe/core\"",
+    "subComponents": []
+  },
   {
     "filePath": "src/components/Table/Table/Table.tsx",
     "aggregator": "core",

package/dist/mocked_classnames/components/StrokeSpotlight/StrokeSpotlight.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { type StrokeSpotlightProps } from "./StrokeSpotlight.types";
+declare const StrokeSpotlight: React.ForwardRefExoticComponent<StrokeSpotlightProps & React.RefAttributes<HTMLDivElement>>;
+export default StrokeSpotlight;

package/dist/mocked_classnames/components/StrokeSpotlight/StrokeSpotlight.types.d.ts

@@ -0,0 +1,15 @@
+import { type ReactNode } from "react";
+import { type VibeComponentProps } from "../../types";
+import { type StrokeSpotlightOptions } from "./useStrokeSpotlight";
+export type StrokeSpotlightPalette = "default" | "sidekick" | "vibe";
+export interface StrokeSpotlightProps extends VibeComponentProps, StrokeSpotlightOptions {
+    children: ReactNode;
+    /** Border stroke width in px; mirrored to CSS `--border`. */
+    borderWidth?: number;
+    /** Blur radius in px of the halo bleeding outward from the stroke. */
+    glowBlur?: number;
+    /** Stroke/glow color palette. Default matches agents cyan→blue→violet. */
+    palette?: StrokeSpotlightPalette;
+    /** Corner radius in px (unitless CSS var `--radius`). */
+    radius?: number;
+}

package/dist/mocked_classnames/components/StrokeSpotlight/index.d.ts

@@ -0,0 +1,3 @@
+export { default as StrokeSpotlight } from "./StrokeSpotlight";
+export type { StrokeSpotlightProps, StrokeSpotlightPalette } from "./StrokeSpotlight.types";
+export { STROKE_NO_PULSE_ATTR, type StrokeSpotlightOptions } from "./useStrokeSpotlight";

package/dist/mocked_classnames/components/StrokeSpotlight/useStrokeSpotlight.d.ts

@@ -0,0 +1,24 @@
+import { type RefObject } from "react";
+export interface StrokeSpotlightOptions {
+    /** How far outside the box (px) the glow still responds. */
+    proximity?: number;
+    /** Fraction of half-min-side; inside this radius from center, glow is off. */
+    inactiveZone?: number;
+    /**
+     * Outward distance from the outer margins (px) over which the stroke fades
+     * from full to off. Inside the box stays full strength.
+     */
+    edgeFade?: number;
+    /** Angular width of the glowing arc (degrees). */
+    spread?: number;
+    /** Seconds for angle interpolation. */
+    movementDuration?: number;
+}
+/** Mark controls that should not trigger the click pulse (e.g. attach, model picker). */
+export declare const STROKE_NO_PULSE_ATTR = "data-stroke-no-pulse";
+/**
+ * Pointer-following conic border glow via `--start` / `--active`, plus one-shot
+ * click pulse. Traveling stroke is suppressed while the box is `:focus-within`
+ * and resumes on hover after focus leaves.
+ */
+export declare function useStrokeSpotlight(ref: RefObject<HTMLElement | null>, activeClassName: string, clickPulsingClassName: string, options?: StrokeSpotlightOptions): void;

package/dist/mocked_classnames/components/index.d.ts

@@ -50,6 +50,7 @@ export * from "./Skeleton";
 export * from "./Slider";
 export * from "./SplitButton";
 export * from "./Steps";
+export * from "./StrokeSpotlight";
 export * from "./Table";
 export * from "./Tabs";
 export { Text, type TextProps, type TextType, type TextWeight } from "@vibe/typography";

package/dist/mocked_classnames/src/components/ListItem/ListItem.module.scss.js

@@ -1,2 +1,2 @@
-var e={listItem:"listItem","focus-visible":"focus-visible",disabled:"disabled",selected:"selected",small:"small",medium:"medium",large:"large"};!function(e){const n="s_id-8402a299d384_4_5_10";if("undefined"!=typeof document){const l=document.head||document.getElementsByTagName("head")[0];if(l.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,l.firstChild?l.insertBefore(t,l.firstChild):l.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable selector-class-pattern */\n/* stylelint-disable */\n/* stylelint-enable */\n.listItem {\n  display: flex;\n  align-items: center;\n  padding: 8px 16px;\n  border-radius: 4px;\n  cursor: pointer;\n}\n.listItem:focus-visible, .listItem.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5) inset, 0 0 0 1px var(--primary-hover-color) inset;\n}\n.listItem:focus:not(.focus-visible) {\n  outline: none;\n}\n\n.listItem:hover {\n  background-color: var(--primary-background-hover-color);\n}\n\n.disabled {\n  cursor: not-allowed;\n}\n\n.disabled:hover {\n  background-color: transparent;\n}\n\n.selected {\n  background-color: var(--primary-selected-color);\n}\n\n.selected:hover {\n  background-color: var(--primary-selected-color);\n}\n\n.small {\n  height: 32px;\n}\n\n.medium {\n  height: 40px;\n}\n\n.large {\n  height: 48px;\n}");export{e as default};
+var e={listItem:"listItem","focus-visible":"focus-visible",disabled:"disabled",selected:"selected",small:"small",medium:"medium",large:"large"};!function(e){const n="s_id-875a4db0e337_4_5_10";if("undefined"!=typeof document){const l=document.head||document.getElementsByTagName("head")[0];if(l.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,l.firstChild?l.insertBefore(t,l.firstChild):l.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable selector-class-pattern */\n/* stylelint-disable */\n/* stylelint-enable */\n.listItem {\n  display: flex;\n  align-items: center;\n  padding: 8px 16px;\n  border-radius: var(--border-radius-small);\n  cursor: pointer;\n}\n.listItem:focus-visible, .listItem.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5) inset, 0 0 0 1px var(--primary-hover-color) inset;\n}\n.listItem:focus:not(.focus-visible) {\n  outline: none;\n}\n\n.listItem:hover {\n  background-color: var(--primary-background-hover-color);\n}\n\n.disabled {\n  cursor: not-allowed;\n}\n\n.disabled:hover {\n  background-color: transparent;\n}\n\n.selected {\n  background-color: var(--primary-selected-color);\n}\n\n.selected:hover {\n  background-color: var(--primary-selected-color);\n}\n\n.small {\n  height: 32px;\n}\n\n.medium {\n  height: 40px;\n}\n\n.large {\n  height: 48px;\n}");export{e as default};
 //# sourceMappingURL=ListItem.module.scss.js.map

package/dist/mocked_classnames/src/components/Menu/MenuItem/components/BaseMenuItem/BaseMenuItem.module.scss.js

@@ -1,2 +1,2 @@
-var e={item:"item",splitMenuItem:"splitMenuItem",disabled:"disabled",focused:"focused",initialSelected:"initialSelected",selected:"selected"};!function(e){const n="s_id-8562a1149ca1_4_5_10";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+n))return;const o=document.createElement("style");o.id=n,t.firstChild?t.insertBefore(o,t.firstChild):t.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable selector-class-pattern */\n.item {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  margin: unset;\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n  box-sizing: border-box;\n  padding: var(--space-4) var(--space-8);\n  cursor: pointer;\n  user-select: none;\n  align-items: center;\n  overflow: visible;\n  border: 1px solid transparent;\n  border-radius: 8px;\n  outline: none;\n}\n.item.splitMenuItem {\n  padding: 0 0 0 var(--space-8);\n}\n.item.disabled {\n  cursor: not-allowed;\n  color: var(--disabled-text-color);\n}\n.item.focused:not(.disabled) {\n  background-color: var(--primary-background-hover-color);\n}\n.item.focused:not(.disabled):not(:hover):not(.initialSelected) {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.item:hover:not(.disabled) {\n  background-color: var(--primary-background-hover-color);\n}\n.item.selected:not(.disabled) {\n  background-color: var(--primary-background-hover-color);\n}");export{e as default};
+var e={item:"item",splitMenuItem:"splitMenuItem",disabled:"disabled",focused:"focused",initialSelected:"initialSelected",selected:"selected"};!function(e){const n="s_id-a4f779bce409_4_5_10";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+n))return;const t=document.createElement("style");t.id=n,o.firstChild?o.insertBefore(t,o.firstChild):o.appendChild(t),t.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=e)}("/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable */\n/* stylelint-enable */\n/* stylelint-disable selector-class-pattern */\n.item {\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n  margin: unset;\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n  box-sizing: border-box;\n  padding: var(--space-4) var(--space-8);\n  cursor: pointer;\n  user-select: none;\n  align-items: center;\n  overflow: visible;\n  border: 1px solid transparent;\n  border-radius: var(--border-radius-small);\n  outline: none;\n}\n.item.splitMenuItem {\n  padding: 0 0 0 var(--space-8);\n}\n.item.disabled {\n  cursor: not-allowed;\n  color: var(--disabled-text-color);\n}\n.item.focused:not(.disabled) {\n  background-color: var(--primary-background-hover-color);\n}\n.item.focused:not(.disabled):not(:hover):not(.initialSelected) {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.item:hover:not(.disabled) {\n  background-color: var(--primary-background-hover-color);\n}\n.item.selected:not(.disabled) {\n  background-color: var(--primary-background-hover-color);\n}");export{e as default};
 //# sourceMappingURL=BaseMenuItem.module.scss.js.map

package/dist/mocked_classnames/src/components/SegmentedControl/SegmentedControl.module.scss.js

@@ -1,2 +1,2 @@
-var n={segmentedControl:"segmentedControl",fullWidth:"fullWidth",disabled:"disabled",thumb:"thumb",thumbHidden:"thumbHidden",segment:"segment",segmentContent:"segmentContent",segmentIcon:"segmentIcon",sizeXs:"sizeXs",sizeSmall:"sizeSmall",sizeMedium:"sizeMedium",sizeLarge:"sizeLarge"};!function(n){const e="s_id-72704adb4ec4_4_5_10";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const r=document.createElement("style");r.id=e,t.firstChild?t.insertBefore(r,t.firstChild):t.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".segmentedControl {\n  --track-padding: var(--space-2);\n  --segment-radius: var(--border-radius-small);\n  position: relative;\n  display: inline-grid;\n  grid-template-columns: repeat(var(--segment-count), 1fr);\n  gap: var(--space-2);\n  align-items: stretch;\n  padding: var(--track-padding);\n  background: var(--allgrey-background-color);\n  border-radius: calc(var(--segment-radius) + var(--track-padding));\n  isolation: isolate;\n}\n\n.fullWidth {\n  width: 100%;\n}\n\n.disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.thumb {\n  position: absolute;\n  z-index: 0;\n  inset-block: var(--track-padding);\n  inset-inline-start: var(--track-padding);\n  width: calc((100% - var(--track-padding) * 2) / var(--segment-count));\n  transform: translateX(calc(var(--selected-index) * 100%));\n  background: var(--primary-background-color);\n  border-radius: var(--segment-radius);\n  box-shadow: var(--box-shadow-xs), 0 0 3px 1px var(--ui-border-color);\n  transition: transform var(--motion-expressive-short) cubic-bezier(0.22, 1, 0.36, 1);\n}\n\n.thumbHidden {\n  opacity: 0;\n}\n\n.segment {\n  position: relative;\n  z-index: 1;\n  gap: var(--space-4);\n  padding-inline: var(--space-12);\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  background-color: transparent;\n  border: none;\n  border-radius: var(--segment-radius);\n  color: var(--primary-text-color);\n  font: inherit;\n  white-space: nowrap;\n  transition: color var(--motion-productive-long) var(--motion-timing-transition), background var(--motion-productive-short) var(--motion-timing-transition), scale var(--motion-productive-short) var(--motion-timing-transition);\n  cursor: pointer;\n  user-select: none;\n}\n.segment:hover {\n  color: var(--primary-text-color);\n  background: color-mix(in srgb, currentColor 8%, transparent);\n}\n.segment:active {\n  color: var(--primary-text-color);\n  background: color-mix(in srgb, currentColor 10%, transparent);\n  scale: 0.98;\n}\n\n.segment:focus-visible {\n  outline: 2px solid var(--primary-color);\n  outline-offset: -2px;\n}\n\n.segment[aria-checked=true] {\n  color: var(--primary-text-color);\n}\n.segment[aria-checked=true]:hover, .segment[aria-checked=true]:active {\n  background: transparent;\n  scale: 1;\n}\n\n.segment[aria-disabled=true] {\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n}\n.segment[aria-disabled=true]:hover, .segment[aria-disabled=true]:active {\n  color: var(--disabled-text-color);\n  background: transparent;\n  scale: 1;\n}\n\n.segmentContent {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--space-4);\n}\n\n.segmentIcon {\n  color: var(--icon-color);\n}\n\n.segment:hover .segmentIcon,\n.segment:active .segmentIcon,\n.segment[aria-checked=true] .segmentIcon {\n  color: var(--primary-text-color);\n}\n\n.segment[aria-disabled=true] .segmentIcon {\n  color: var(--disabled-text-color);\n}\n\n.sizeXs {\n  height: 24px;\n  font-size: 12px;\n}\n\n.sizeSmall {\n  height: 32px;\n  font-size: 14px;\n}\n\n.sizeMedium {\n  height: 40px;\n  font-size: 14px;\n}\n\n.sizeLarge {\n  height: 48px;\n  font-size: 16px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .thumb,\n  .segment {\n    transition: none;\n  }\n}");export{n as default};
+var n={segmentedControl:"segmentedControl",fullWidth:"fullWidth",disabled:"disabled",thumb:"thumb",thumbHidden:"thumbHidden",segment:"segment",segmentContent:"segmentContent",segmentIcon:"segmentIcon",sizeXs:"sizeXs",sizeSmall:"sizeSmall",sizeMedium:"sizeMedium",sizeLarge:"sizeLarge"};!function(n){const e="s_id-30b75998bfd3_4_5_10";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+e))return;const r=document.createElement("style");r.id=e,t.firstChild?t.insertBefore(r,t.firstChild):t.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=n)}(".segmentedControl {\n  --track-padding: var(--space-2);\n  --segment-radius: var(--border-radius-small);\n  position: relative;\n  display: inline-grid;\n  grid-template-columns: repeat(var(--segment-count), 1fr);\n  gap: var(--space-2);\n  align-items: stretch;\n  padding: var(--track-padding);\n  background: var(--allgrey-background-color);\n  border-radius: calc(var(--segment-radius) + var(--track-padding));\n  isolation: isolate;\n}\n\n.fullWidth {\n  width: 100%;\n}\n\n.disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.thumb {\n  position: absolute;\n  z-index: 0;\n  inset-block: var(--track-padding);\n  inset-inline-start: var(--track-padding);\n  width: calc((100% - var(--track-padding) * 2) / var(--segment-count));\n  transform: translateX(calc(var(--selected-index) * 100%));\n  background: var(--primary-background-color);\n  border-radius: var(--segment-radius);\n  box-shadow: var(--box-shadow-xs), 0 0 0 1px var(--layout-border-color);\n  transition: transform var(--motion-expressive-short) cubic-bezier(0.22, 1, 0.36, 1);\n}\n\n.thumbHidden {\n  opacity: 0;\n}\n\n.segment {\n  position: relative;\n  z-index: 1;\n  gap: var(--space-4);\n  padding-inline: var(--space-12);\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  background-color: transparent;\n  border: none;\n  border-radius: var(--segment-radius);\n  color: var(--primary-text-color);\n  font: inherit;\n  white-space: nowrap;\n  transition: color var(--motion-productive-long) var(--motion-timing-transition), background var(--motion-productive-short) var(--motion-timing-transition), scale var(--motion-productive-short) var(--motion-timing-transition);\n  cursor: pointer;\n  user-select: none;\n}\n.segment:hover {\n  color: var(--primary-text-color);\n  background: color-mix(in srgb, currentColor 8%, transparent);\n}\n.segment:active {\n  color: var(--primary-text-color);\n  background: color-mix(in srgb, currentColor 10%, transparent);\n  scale: 0.98;\n}\n\n.segment:focus-visible {\n  outline: 2px solid var(--primary-color);\n  outline-offset: -2px;\n}\n\n.segment[aria-checked=true] {\n  color: var(--primary-text-color);\n}\n.segment[aria-checked=true]:hover, .segment[aria-checked=true]:active {\n  background: transparent;\n  scale: 1;\n}\n\n.segment[aria-disabled=true] {\n  color: var(--disabled-text-color);\n  cursor: not-allowed;\n}\n.segment[aria-disabled=true]:hover, .segment[aria-disabled=true]:active {\n  color: var(--disabled-text-color);\n  background: transparent;\n  scale: 1;\n}\n\n.segmentContent {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--space-4);\n}\n\n.segmentIcon {\n  color: var(--icon-color);\n}\n\n.segment:hover .segmentIcon,\n.segment:active .segmentIcon,\n.segment[aria-checked=true] .segmentIcon {\n  color: var(--primary-text-color);\n}\n\n.segment[aria-disabled=true] .segmentIcon {\n  color: var(--disabled-text-color);\n}\n\n.sizeXs {\n  height: 24px;\n  font-size: 12px;\n}\n\n.sizeSmall {\n  height: 32px;\n  font-size: 14px;\n}\n\n.sizeMedium {\n  height: 40px;\n  font-size: 14px;\n}\n\n.sizeLarge {\n  height: 48px;\n  font-size: 16px;\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .thumb,\n  .segment {\n    transition: none;\n  }\n}");export{n as default};
 //# sourceMappingURL=SegmentedControl.module.scss.js.map

package/dist/mocked_classnames/src/components/StrokeSpotlight/StrokeSpotlight.js

@@ -0,0 +1,2 @@
+import e,{forwardRef as t,useRef as i}from"react";import a from"classnames";import r from"./StrokeSpotlight.module.scss.js";import{useStrokeSpotlight as o}from"./useStrokeSpotlight.js";import{getTestId as s,ComponentDefaultTestId as d}from"../../tests/testIds.js";import{ComponentVibeId as l}from"../../tests/constants.js";var c=t((function(t,c){var n=t.children,m=t.className,p=t.proximity,u=t.inactiveZone,v=t.edgeFade,f=t.spread,k=t.movementDuration,g=t.borderWidth,S=void 0===g?2:g,h=t.glowBlur,b=void 0===h?12:h,E=t.palette,T=void 0===E?"default":E,N=t.radius,j=void 0===N?16:N,x=t.id,y=t["data-testid"],O=i(null);o(O,"is-spotlight-active","is-click-pulsing",{proximity:p,inactiveZone:u,edgeFade:v,spread:f,movementDuration:k});var w={"--border":S,"--glow-blur":"".concat(b,"px"),"--radius":j};return e.createElement("div",{ref:function(e){O.current=e,"function"==typeof c?c(e):c&&(c.current=e)},className:a(r.root,"sidekick"===T?r.paletteSidekick:"vibe"===T?r.paletteVibe:void 0,m),style:w,id:x,"data-testid":y||s(d.STROKE_SPOTLIGHT,x),"data-vibe":l.STROKE_SPOTLIGHT},e.createElement("div",{"aria-hidden":!0,className:r.glow}),e.createElement("div",{"aria-hidden":!0,"data-stroke-click-pulse":!0,className:r.clickPulse}),e.createElement("div",{className:r.surface},n))}));export{c as default};
+//# sourceMappingURL=StrokeSpotlight.js.map

package/dist/mocked_classnames/src/components/StrokeSpotlight/StrokeSpotlight.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StrokeSpotlight.js","sources":["../../../../../src/components/StrokeSpotlight/StrokeSpotlight.tsx"],"sourcesContent":["import React, { forwardRef, useRef, type CSSProperties } from \"react\";\nimport cx from \"classnames\";\nimport { type StrokeSpotlightProps } from \"./StrokeSpotlight.types\";\nimport styles from \"./StrokeSpotlight.module.scss\";\nimport { useStrokeSpotlight } from \"./useStrokeSpotlight\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nconst SPOTLIGHT_ACTIVE_CLASS = \"is-spotlight-active\";\nconst CLICK_PULSING_CLASS = \"is-click-pulsing\";\n\nconst StrokeSpotlight = forwardRef<HTMLDivElement, StrokeSpotlightProps>(\n  (\n    {\n      children,\n      className,\n      proximity,\n      inactiveZone,\n      edgeFade,\n      spread,\n      movementDuration,\n      borderWidth = 2,\n      glowBlur = 12,\n      palette = \"default\",\n      radius = 16,\n      id,\n      \"data-testid\": dataTestId\n    },\n    forwardedRef\n  ) => {\n    const localRef = useRef<HTMLDivElement>(null);\n\n    useStrokeSpotlight(localRef, SPOTLIGHT_ACTIVE_CLASS, CLICK_PULSING_CLASS, {\n      proximity,\n      inactiveZone,\n      edgeFade,\n      spread,\n      movementDuration\n    });\n\n    const setRefs = (node: HTMLDivElement | null) => {\n      localRef.current = node;\n      if (typeof forwardedRef === \"function\") {\n        forwardedRef(node);\n      } else if (forwardedRef) {\n        (forwardedRef as React.MutableRefObject<HTMLDivElement | null>).current = node;\n      }\n    };\n\n    const style = {\n      \"--border\": borderWidth,\n      \"--glow-blur\": `${glowBlur}px`,\n      \"--radius\": radius\n    } as CSSProperties;\n\n    const paletteClass =\n      palette === \"sidekick\" ? styles.paletteSidekick : palette === \"vibe\" ? styles.paletteVibe : undefined;\n\n    return (\n      <div\n        ref={setRefs}\n        className={cx(styles.root, paletteClass, className)}\n        style={style}\n        id={id}\n        data-testid={dataTestId || getTestId(ComponentDefaultTestId.STROKE_SPOTLIGHT, id)}\n        data-vibe={ComponentVibeId.STROKE_SPOTLIGHT}\n      >\n        <div aria-hidden className={styles.glow} />\n        <div aria-hidden data-stroke-click-pulse className={styles.clickPulse} />\n        <div className={styles.surface}>{children}</div>\n      </div>\n    );\n  }\n);\n\nexport default StrokeSpotlight;\n"],"names":["StrokeSpotlight","forwardRef","_ref","forwardedRef","children","className","proximity","inactiveZone","edgeFade","spread","movementDuration","_ref$borderWidth","borderWidth","_ref$glowBlur","glowBlur","_ref$palette","palette","_ref$radius","radius","id","dataTestId","localRef","useRef","useStrokeSpotlight","style","concat","React","createElement","ref","node","current","cx","styles","root","paletteSidekick","paletteVibe","undefined","getTestId","ComponentDefaultTestId","STROKE_SPOTLIGHT","ComponentVibeId","glow","clickPulse","surface"],"mappings":"mUAQA,IAGMA,EAAkBC,GACtB,SAAAC,EAgBEC,GACE,IAfAC,EAAQF,EAARE,SACAC,EAASH,EAATG,UACAC,EAASJ,EAATI,UACAC,EAAYL,EAAZK,aACAC,EAAQN,EAARM,SACAC,EAAMP,EAANO,OACAC,EAAgBR,EAAhBQ,iBAAgBC,EAAAT,EAChBU,YAAAA,OAAc,IAAHD,EAAG,EAACA,EAAAE,EAAAX,EACfY,SAAAA,OAAW,IAAHD,EAAG,GAAEA,EAAAE,EAAAb,EACbc,QAAAA,OAAU,IAAHD,EAAG,UAASA,EAAAE,EAAAf,EACnBgB,OAAAA,OAAS,IAAHD,EAAG,GAAEA,EACXE,EAAEjB,EAAFiB,GACeC,EAAUlB,EAAzB,eAIImB,EAAWC,EAAuB,MAExCC,EAAmBF,EAxBQ,sBACH,mBAuBkD,CACxEf,UAAAA,EACAC,aAAAA,EACAC,SAAAA,EACAC,OAAAA,EACAC,iBAAAA,IAGF,IASMc,EAAQ,CACZ,WAAYZ,EACZ,cAAaa,GAAAA,OAAKX,EAAY,MAC9B,WAAYI,GAMd,OACEQ,EACEC,cAAA,MAAA,CAAAC,IApBY,SAACC,GACfR,EAASS,QAAUD,EACS,mBAAjB1B,EACTA,EAAa0B,GACJ1B,IACRA,EAA+D2B,QAAUD,IAgB1ExB,UAAW0B,EAAGC,EAAOC,KALX,aAAZjB,EAAyBgB,EAAOE,gBAA8B,SAAZlB,EAAqBgB,EAAOG,iBAAcC,EAKjD/B,GACzCmB,MAAOA,EACPL,GAAIA,EACS,cAAAC,GAAciB,EAAUC,EAAuBC,iBAAkBpB,GACnE,YAAAqB,EAAgBD,kBAE3Bb,EAAAC,cAAA,MAAA,CAAA,eAAA,EAAiBtB,UAAW2B,EAAOS,OACnCf,EAAAC,cAAA,MAAA,CAAA,eAAA,EAAA,2BAAA,EAAyCtB,UAAW2B,EAAOU,aAC3DhB,EAAKC,cAAA,MAAA,CAAAtB,UAAW2B,EAAOW,SAAUvC,GAGvC"}

package/dist/mocked_classnames/src/components/StrokeSpotlight/StrokeSpotlight.module.scss.js

@@ -0,0 +1,2 @@
+var e={root:"root",paletteSidekick:"paletteSidekick",paletteVibe:"paletteVibe",surface:"surface",clickPulse:"clickPulse",glow:"glow","stroke-spotlight-scale-grow":"stroke-spotlight-scale-grow","stroke-spotlight-click-expand":"stroke-spotlight-click-expand","stroke-spotlight-click-blur":"stroke-spotlight-click-blur","stroke-spotlight-click-fade":"stroke-spotlight-click-fade","stroke-spotlight-click-fade-reduced":"stroke-spotlight-click-fade-reduced"};!function(e){const r="s_id-cb48ec090904_4_5_10";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+r))return;const n=document.createElement("style");n.id=r,t.firstChild?t.insertBefore(n,t.firstChild):t.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=e)}('@charset "UTF-8";\n/* stylelint-disable monday-ui-style/use-defined-css-var-when-available -- brand stroke stops are product palettes, not semantic tokens */\n@keyframes stroke-spotlight-scale-grow {\n  0% {\n    transform: scale(1);\n  }\n  60% {\n    transform: scale(0.98);\n  }\n  100% {\n    transform: scale(1);\n  }\n}\n.root {\n  /* Stroke palette defaults — Sidekick / Vibe override via modifiers. */\n  --stroke-stop-1: #04f7fb;\n  --stroke-stop-2: #0074fd;\n  --stroke-stop-3: #9450fd;\n  --stroke-stop-4: #04f7fb;\n  --stroke-stop-2-at: 120deg;\n  --stroke-stop-3-at: 240deg;\n  --stroke-stop-4-at: 300deg;\n  --radius: 16;\n  --border: 2;\n  --border-size: calc(var(--border, 2) * 1px);\n  --start: 0;\n  --active: 0;\n  --spread: 22;\n  --outer-radius: calc((var(--radius) + var(--border)) * 1px);\n  --glow-blur: 12px;\n  --glow-strength: 0.25;\n  --glow-saturation: 0.55;\n  --stroke-strength: 0.8;\n  --click-pulse-blur: 32px;\n  --click-pulse-blur-spread: 96px;\n  --click-pulse-strength: 0.2;\n  --click-pulse-end-scale-x: 3.2;\n  --click-pulse-end-scale-y: 4.5;\n  --stroke-duration-short: 20ms;\n  --stroke-duration-scale: var(--motion-productive-long, 150ms);\n  --stroke-duration-wash: 650ms;\n  --stroke-duration-fade: var(--motion-expressive-short, 250ms);\n  --stroke-duration-reduced: var(--motion-productive-short, 70ms);\n  --stroke-ease: var(--motion-timing-transition, cubic-bezier(0.4, 0, 0.2, 1));\n  position: relative;\n  isolation: isolate;\n  display: block;\n  width: 100%;\n  height: 100%;\n  overflow: visible;\n  transform-origin: center center;\n  border-radius: var(--outer-radius);\n  background-color: transparent;\n  border: var(--border-size) solid transparent;\n  touch-action: none;\n  box-sizing: border-box;\n}\n\n/* Sidekick home: lilac → teal → green */\n.paletteSidekick {\n  --stroke-stop-1: #8181ff;\n  --stroke-stop-2: #33dbdb;\n  --stroke-stop-3: #33d58e;\n  --stroke-stop-4: #8181ff;\n  --stroke-stop-2-at: 120deg;\n  --stroke-stop-3-at: 240deg;\n  --stroke-stop-4-at: 300deg;\n}\n\n/* Vibe home: gold → orange → pink → orchid */\n.paletteVibe {\n  --stroke-stop-1: #f0c020;\n  --stroke-stop-2: #ff9e52;\n  --stroke-stop-3: #ff74cd;\n  --stroke-stop-4: #ff92e8;\n  --stroke-stop-2-at: 90deg;\n  --stroke-stop-3-at: 180deg;\n  --stroke-stop-4-at: 270deg;\n}\n\n.surface {\n  position: relative;\n  z-index: 0;\n  width: 100%;\n  height: 100%;\n  transform-origin: center center;\n}\n\n.clickPulse {\n  pointer-events: none;\n  position: absolute;\n  inset: 0;\n  border-radius: calc(var(--radius) * 1px);\n  z-index: 0;\n  opacity: 0;\n  background: conic-gradient(from 0deg at 57.6% 61.3%, var(--stroke-stop-1) 0deg, var(--stroke-stop-2) var(--stroke-stop-2-at), var(--stroke-stop-3) var(--stroke-stop-3-at), var(--stroke-stop-4) var(--stroke-stop-4-at), var(--stroke-stop-1) 1turn);\n  filter: blur(var(--click-pulse-blur));\n  transform-origin: center center;\n}\n\n.root::after {\n  content: "";\n  position: absolute;\n  inset: calc(var(--border-size) * -1);\n  box-sizing: border-box;\n  border-radius: calc(var(--radius) * 1px + var(--border-size));\n  border: var(--border-size) solid transparent;\n  background: conic-gradient(from 0deg at 57.6% 61.3%, var(--stroke-stop-1) 0deg, var(--stroke-stop-2) var(--stroke-stop-2-at), var(--stroke-stop-3) var(--stroke-stop-3-at), var(--stroke-stop-4) var(--stroke-stop-4-at), var(--stroke-stop-1) 1turn);\n  mask-clip: padding-box, border-box;\n  mask-composite: intersect;\n  mask-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), conic-gradient(from calc((var(--start) - var(--spread)) * 1deg), rgba(0, 0, 0, 0) 0deg, #fff, rgba(0, 0, 0, 0) calc(var(--spread) * 2deg));\n  pointer-events: none;\n  opacity: calc(var(--active) * var(--stroke-strength));\n  transition: opacity var(--stroke-duration-fade) linear;\n  z-index: 2;\n}\n\n.glow {\n  --glow-band: var(--border-size);\n  --halo: calc(var(--glow-band) + var(--glow-blur) * 3);\n  pointer-events: none;\n  position: absolute;\n  inset: calc(var(--halo) * -1);\n  box-sizing: border-box;\n  border: var(--halo) solid transparent;\n  border-radius: calc(var(--radius) * 1px + var(--halo));\n  z-index: 1;\n  filter: blur(var(--glow-blur)) saturate(var(--glow-saturation));\n  mask-image: linear-gradient(#fff 0 0), linear-gradient(#fff 0 0);\n  mask-clip: border-box, padding-box;\n  mask-composite: exclude;\n  opacity: calc(var(--active) * var(--glow-strength));\n  transition: opacity var(--stroke-duration-fade) linear;\n}\n\n.glow::after {\n  content: "";\n  position: absolute;\n  inset: calc(var(--glow-band) * -1);\n  box-sizing: border-box;\n  border-radius: calc(var(--radius) * 1px + var(--glow-band));\n  border: var(--glow-band) solid transparent;\n  background: conic-gradient(from 0deg at 57.6% 61.3%, var(--stroke-stop-1) 0deg, var(--stroke-stop-2) var(--stroke-stop-2-at), var(--stroke-stop-3) var(--stroke-stop-3-at), var(--stroke-stop-4) var(--stroke-stop-4-at), var(--stroke-stop-1) 1turn);\n  mask-clip: padding-box, border-box;\n  mask-composite: intersect;\n  mask-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), conic-gradient(from calc((var(--start) - var(--spread)) * 1deg), rgba(0, 0, 0, 0) 0deg, #fff, rgba(0, 0, 0, 0) calc(var(--spread) * 2deg));\n  pointer-events: none;\n}\n\n.root.is-click-pulsing {\n  animation: stroke-spotlight-scale-grow var(--stroke-duration-scale) var(--stroke-ease) forwards;\n}\n.root.is-click-pulsing .clickPulse {\n  animation: stroke-spotlight-click-expand var(--stroke-duration-wash) var(--stroke-ease) both, stroke-spotlight-click-blur var(--stroke-duration-wash) var(--stroke-ease) both, stroke-spotlight-click-fade var(--stroke-duration-wash) linear var(--stroke-duration-short) both;\n}\n\n@keyframes stroke-spotlight-click-expand {\n  0% {\n    transform: scale(1, 1);\n  }\n  100% {\n    transform: scale(var(--click-pulse-end-scale-x), var(--click-pulse-end-scale-y));\n  }\n}\n@keyframes stroke-spotlight-click-blur {\n  0% {\n    filter: blur(var(--click-pulse-blur));\n  }\n  100% {\n    filter: blur(var(--click-pulse-blur-spread));\n  }\n}\n@keyframes stroke-spotlight-click-fade {\n  0% {\n    opacity: var(--click-pulse-strength);\n  }\n  100% {\n    opacity: 0;\n  }\n}\n@media (prefers-reduced-motion: reduce) {\n  .root::after,\n  .glow {\n    transition: none;\n    opacity: 0;\n  }\n  .root.is-click-pulsing {\n    animation: none;\n    transform: scale(1);\n  }\n  .root.is-click-pulsing .clickPulse {\n    animation: stroke-spotlight-click-fade-reduced var(--stroke-duration-reduced) linear forwards;\n  }\n  .clickPulse {\n    opacity: 0;\n  }\n}\n@keyframes stroke-spotlight-click-fade-reduced {\n  0% {\n    opacity: var(--click-pulse-strength);\n  }\n  100% {\n    opacity: 0;\n  }\n}');export{e as default};
+//# sourceMappingURL=StrokeSpotlight.module.scss.js.map

package/dist/mocked_classnames/src/components/StrokeSpotlight/StrokeSpotlight.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StrokeSpotlight.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/mocked_classnames/src/components/StrokeSpotlight/useStrokeSpotlight.js

@@ -0,0 +1,2 @@
+import{useEffect as e}from"react";var t=64,n=.01,i=48,o=40,r=1.5,a="data-stroke-no-pulse",s="[".concat(a,"]");function l(a,l,c){var d,u,v,m,h,f=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{},w=null!==(d=f.proximity)&&void 0!==d?d:t,p=null!==(u=f.inactiveZone)&&void 0!==u?u:n,L=null!==(v=f.edgeFade)&&void 0!==v?v:i,g=null!==(m=f.spread)&&void 0!==m?m:o,y=null!==(h=f.movementDuration)&&void 0!==h?h:r;e((function(){var e=a.current;if(e&&l&&c){var t=e.querySelector("[data-stroke-click-pulse]"),n=window.matchMedia("(prefers-reduced-motion: reduce)"),i=n.matches,o=!1,r=e.getBoundingClientRect(),d=null,u=0,v=0,m=!1,h=null,f=0,E=0,M=0;e.style.setProperty("--spread",g+""),e.style.setProperty("--start","0"),e.style.setProperty("--active","0");var P=function(){e.classList.remove(c)},F=function(){null!==h&&(cancelAnimationFrame(h),h=null)},q=function t(n){var i=Math.min(1,(n-M)/(1e3*y)),o=f+(E-f)*function(e){return 1>e?1-Math.pow(2,-10*e):1}(i);e.style.setProperty("--start",o+""),h=1>i?requestAnimationFrame(t):null},A=function(){e.style.setProperty("--active","0"),e.classList.remove(l),F()},C=function(t,n,i){if(e.matches(":focus-within"))A();else if(i.width>0&&i.height>0){var o=i.left+.5*i.width,r=i.top+.5*i.height;if(Math.hypot(t-o,n-r)<.5*Math.min(i.width,i.height)*p)A();else if(t>i.left-w&&i.left+i.width+w>t&&n>i.top-w&&i.top+i.height+w>n){var a=t-i.left,s=n-i.top,c=Math.max(0-a,0,a-i.width),d=Math.max(0-s,0,s-i.height),u=Math.sqrt(c*c+d*d);e.style.setProperty("--active",(u>0?Math.max(0,Math.min(1,1-u/(L>0?L:w))):1)+""),e.classList.add(l);var v,m,g=parseFloat(e.style.getPropertyValue("--start"))||0;v=g,m=g+((180*Math.atan2(n-r,t-o)/Math.PI+90-g+180)%360-180),F(),f=v,E=m,M=performance.now(),h=requestAnimationFrame(q)}else A()}},x=function(){(i=n.matches)&&(A(),P())};n.addEventListener("change",x);var B=function(){r=e.getBoundingClientRect()},R=function(t){if(!i&&e.isConnected)return 0>t.clientX||0>t.clientY||t.clientX>window.innerWidth||t.clientY>window.innerHeight?(e.matches(":focus-within")||(o=!1),m=!1,void A()):(u=t.clientX,v=t.clientY,m=!0,void(null===d&&(d=requestAnimationFrame((function(){d=null,r=e.getBoundingClientRect(),C(u,v,r)})))));A()},k=function(){o=!1,m=!1,A()},X=function(e){e.target===t&&P()},Y=function(){o=!0,A()},b=function(){requestAnimationFrame((function(){e.isConnected&&!e.matches(":focus-within")&&(o=!1,m&&(r=e.getBoundingClientRect(),C(u,v,r)))}))},z=function(t){if(!i){var n=t.target;n instanceof Element&&n.closest(s)||(o||e.matches(":focus-within")?A():(o=!0,A(),e.classList.remove(c),e.classList.add(c)))}};return window.addEventListener("pointermove",R,{passive:!0}),window.addEventListener("blur",k),window.addEventListener("scroll",B,{passive:!0}),window.addEventListener("resize",B,{passive:!0}),e.addEventListener("pointerdown",z),e.addEventListener("focusin",Y),e.addEventListener("focusout",b),null==t||t.addEventListener("animationend",X),function(){n.removeEventListener("change",x),null!==d&&cancelAnimationFrame(d),F(),e.classList.remove(l),P(),e.style.setProperty("--active","0"),window.removeEventListener("pointermove",R),window.removeEventListener("blur",k),window.removeEventListener("scroll",B),window.removeEventListener("resize",B),e.removeEventListener("pointerdown",z),e.removeEventListener("focusin",Y),e.removeEventListener("focusout",b),null==t||t.removeEventListener("animationend",X)}}}),[a,l,c,w,p,L,g,y])}export{a as STROKE_NO_PULSE_ATTR,l as useStrokeSpotlight};
+//# sourceMappingURL=useStrokeSpotlight.js.map