@noodleseed/one 0.32.1 → 0.34.0

package/dist/widget-showcase-template.js

@@ -0,0 +1,478 @@
+/** Generated source files for the developer-facing React design-system showcase. */
+export const widgetShowcaseHelpers = `import type { ServerDefinition } from '@noodleseed/one';
+import { generateHelpers } from '@noodleseed/one/react';
+
+export type { CallToolState, HandoffController } from '@noodleseed/one/react';
+export {
+  Action,
+  ActionBar,
+  AppShell,
+  AsyncBoundary,
+  Avatar,
+  AvatarGroup,
+  Checkbox,
+  ChoiceGroup,
+  Collection,
+  DataCard,
+  DataList,
+  EmptyState,
+  ErrorState,
+  ExpandButton,
+  Fact,
+  Feedback,
+  Field,
+  Flow,
+  Frame,
+  FullscreenShell,
+  HandoffButton,
+  InlineCard,
+  InlineCarousel,
+  InlineList,
+  Input,
+  LoadingState,
+  Menu,
+  Overlay,
+  Popover,
+  QuantityStepper,
+  RadioGroup,
+  Region,
+  SegmentedControl,
+  Select,
+  ShellHeader,
+  ShellNav,
+  Slider,
+  Spinner,
+  StatusBadge,
+  SubmitButton,
+  Switch,
+  Textarea,
+  Tooltip,
+  View,
+  ViewNav,
+  ViewStack,
+} from '@noodleseed/one/react';
+
+export type AppType = ServerDefinition;
+
+export const {
+  useAppFlow,
+  useCallTool,
+  useHandoff,
+  useLayout,
+  useToolInfo,
+  useViewState,
+} = generateHelpers<AppType>();
+`;
+export const widgetShowcaseView = `import '@noodleseed/one/react/styles.css';
+import { useState } from 'react';
+import {
+  AppShell,
+  Frame,
+  FullscreenShell,
+  SegmentedControl,
+  StatusBadge,
+  View,
+  ViewNav,
+  ViewStack,
+  useAppFlow,
+  useLayout,
+  useToolInfo,
+} from '../helpers.js';
+import {
+  DataSection,
+  FeedbackSection,
+  FormsSection,
+  FoundationsSection,
+  LayoutSection,
+  OverlaysSection,
+} from './showcase-sections.js';
+
+type GalleryView = 'foundations' | 'forms' | 'data' | 'feedback' | 'overlays' | 'layouts';
+type ShellPreview = 'frame' | 'app-shell' | 'fullscreen';
+
+const galleryViews: readonly GalleryView[] = [
+  'foundations',
+  'forms',
+  'data',
+  'feedback',
+  'overlays',
+  'layouts',
+];
+
+const navigation = [
+  { view: 'foundations' as const, label: 'Foundations' },
+  { view: 'forms' as const, label: 'Forms' },
+  { view: 'data' as const, label: 'Data display' },
+  { view: 'feedback' as const, label: 'Feedback' },
+  { view: 'overlays' as const, label: 'Overlays' },
+  { view: 'layouts' as const, label: 'Layouts' },
+];
+
+type ShowcaseInfo = {
+  readonly title?: string;
+  readonly version?: string;
+  readonly description?: string;
+};
+
+export default function DesignSystemShowcase() {
+  const layout = useLayout();
+  const info = (useToolInfo('show_design_system').structuredContent ?? {}) as ShowcaseInfo;
+  const flow = useAppFlow<GalleryView>({
+    key: 'design_system_showcase',
+    initialView: 'foundations',
+    views: galleryViews,
+  });
+  const [shell, setShell] = useState<ShellPreview>('frame');
+
+  const content = (
+    <>
+      <SegmentedControl
+        aria-label="Preview shell"
+        name="preview-shell"
+        value={shell}
+        onValueChange={(value) => setShell(value as ShellPreview)}
+        options={[
+          { value: 'frame', label: 'Frame' },
+          { value: 'app-shell', label: 'AppShell' },
+          { value: 'fullscreen', label: 'FullscreenShell' },
+        ]}
+      />
+
+      <ViewNav
+        activeView={flow.activeView}
+        items={navigation}
+        onNavigate={flow.navigate}
+        variant="segmented"
+        aria-label="Design-system categories"
+      />
+
+      <ViewStack flow={flow}>
+        <View name="foundations"><FoundationsSection /></View>
+        <View name="forms"><FormsSection /></View>
+        <View name="data"><DataSection /></View>
+        <View name="feedback"><FeedbackSection /></View>
+        <View name="overlays"><OverlaysSection /></View>
+        <View name="layouts"><LayoutSection /></View>
+      </ViewStack>
+    </>
+  );
+
+  const title = info.title ?? 'Noodle React design system';
+  const subtitle = info.description ?? 'Interactive reference for every public component family.';
+  const badge = <StatusBadge tone="info">v{info.version ?? 'local'}</StatusBadge>;
+  const common = {
+    className: layout.theme === 'dark' ? 'dark' : '',
+    'data-llm': 'Developer-facing Noodle React design-system component showcase',
+  };
+
+  if (shell === 'app-shell') {
+    return <AppShell {...common} title={title} subtitle={subtitle} badge={badge} displayMode="auto" footer="Host-neutral MCP Apps components">{content}</AppShell>;
+  }
+  if (shell === 'fullscreen') {
+    return <FullscreenShell {...common} title={title} subtitle={subtitle} toolbar={badge} footer="Use the shell switcher to return to an inline preview.">{content}</FullscreenShell>;
+  }
+  return <Frame {...common} title={title} subtitle={subtitle} status={badge} footer="Reference implementation, not a product UX prescription.">{content}</Frame>;
+}
+`;
+export const widgetShowcaseSections = `import { useState } from 'react';
+import {
+  Action,
+  ActionBar,
+  AsyncBoundary,
+  Avatar,
+  AvatarGroup,
+  Checkbox,
+  ChoiceGroup,
+  Collection,
+  DataCard,
+  DataList,
+  EmptyState,
+  ErrorState,
+  ExpandButton,
+  Fact,
+  Feedback,
+  Field,
+  Flow,
+  HandoffButton,
+  InlineCard,
+  InlineCarousel,
+  InlineList,
+  Input,
+  LoadingState,
+  Menu,
+  Overlay,
+  Popover,
+  QuantityStepper,
+  RadioGroup,
+  Region,
+  SegmentedControl,
+  Select,
+  ShellHeader,
+  ShellNav,
+  Slider,
+  Spinner,
+  StatusBadge,
+  SubmitButton,
+  Switch,
+  Textarea,
+  Tooltip,
+  useCallTool,
+  useHandoff,
+  useViewState,
+} from '../helpers.js';
+
+export function FoundationsSection() {
+  const handoff = useHandoff();
+  return (
+    <Flow variant="stack">
+      <Region title="Actions" description="Button, link, pending, disabled, handoff, and display-mode actions.">
+        <ActionBar>
+          <Action variant="primary">Primary</Action>
+          <Action variant="secondary">Secondary</Action>
+          <Action variant="quiet">Quiet</Action>
+          <Action variant="danger">Danger</Action>
+          <Action pending pendingLabel="Working…">Pending</Action>
+          <Action disabled>Disabled</Action>
+          <Action as="a" href="https://modelcontextprotocol.io" external>External link</Action>
+          <ExpandButton>Request fullscreen</ExpandButton>
+          <HandoffButton handoff={handoff} target="https://example.com" disabled>Handoff</HandoffButton>
+        </ActionBar>
+      </Region>
+
+      <Region title="Status badges" description="Semantic tones remain host-adaptive.">
+        <Flow variant="cluster">
+          <StatusBadge>Neutral</StatusBadge>
+          <StatusBadge tone="success">Success</StatusBadge>
+          <StatusBadge tone="warning">Warning</StatusBadge>
+          <StatusBadge tone="danger">Danger</StatusBadge>
+          <StatusBadge tone="info">Info</StatusBadge>
+        </Flow>
+      </Region>
+
+      <Region title="Avatars" description="Image-free fallbacks and overflow grouping.">
+        <AvatarGroup max={3}>
+          <Avatar name="Ada Lovelace" size={40} />
+          <Avatar name="Grace Hopper" size={40} />
+          <Avatar name="Alan Turing" size={40} />
+          <Avatar name="Katherine Johnson" size={40} />
+        </AvatarGroup>
+      </Region>
+    </Flow>
+  );
+}
+
+export function FormsSection() {
+  const demo = useCallTool('run_component_demo');
+  const [email, setEmail] = useViewState('showcase_email', 'ada@example.com');
+  const [notes, setNotes] = useState('Host-neutral controls with native semantics.');
+  const [selectValue, setSelectValue] = useState('comfortable');
+  const [radioValue, setRadioValue] = useState('daily');
+  const [switchValue, setSwitchValue] = useState(true);
+  const [sliderValue, setSliderValue] = useState(60);
+  const [segmentValue, setSegmentValue] = useState('preview');
+  const [choices, setChoices] = useState<readonly string[]>(['forms']);
+  const [quantity, setQuantity] = useState(2);
+
+  return (
+    <form onSubmit={(event) => {
+      event.preventDefault();
+      void demo.callTool({ component: 'Form controls', value: email }).catch(() => undefined);
+    }}>
+      <Flow variant="stack">
+        <Region title="Text controls" description="Labels, descriptions, errors, refs, and native form behavior.">
+          <Flow variant="grid">
+            <Field label="Email" detail="Field connects every accessible relationship." required>
+              <Input name="email" type="email" value={email} onChange={(event) => setEmail(event.currentTarget.value)} />
+            </Field>
+            <Field label="Notes">
+              <Textarea name="notes" value={notes} onChange={(event) => setNotes(event.currentTarget.value)} />
+            </Field>
+            <Field label="Density">
+              <Select name="density" value={selectValue} onChange={(event) => setSelectValue(event.currentTarget.value)} options={[
+                { value: 'compact', label: 'Compact' },
+                { value: 'comfortable', label: 'Comfortable' },
+              ]} />
+            </Field>
+          </Flow>
+        </Region>
+
+        <Region title="Choice controls" description="Native checkbox, radio, switch, range, and segmented interaction.">
+          <Flow variant="grid">
+            <Checkbox name="updates" defaultChecked label="Checkbox" />
+            <Switch name="enabled" checked={switchValue} onCheckedChange={setSwitchValue} label="Switch" />
+            <Field label="Cadence" group required>
+              <RadioGroup name="cadence" value={radioValue} onValueChange={setRadioValue} options={[
+                { value: 'daily', label: 'Daily' },
+                { value: 'weekly', label: 'Weekly' },
+              ]} />
+            </Field>
+            <Field label="Volume">
+              <Slider aria-label="Volume" name="volume" min={0} max={100} value={sliderValue} onChange={(event) => setSliderValue(Number(event.currentTarget.value))} />
+            </Field>
+            <Field label="Mode" group>
+              <SegmentedControl name="mode" value={segmentValue} onValueChange={setSegmentValue} options={[
+                { value: 'preview', label: 'Preview' },
+                { value: 'code', label: 'Code' },
+              ]} />
+            </Field>
+          </Flow>
+        </Region>
+
+        <Region title="Composite controls" description="Controlled multi-choice and quantity patterns.">
+          <Flow variant="cluster">
+            <ChoiceGroup values={['forms', 'data', 'overlays']} selected={choices} onChange={setChoices} labelFor={(value) => value} />
+            <QuantityStepper value={quantity} min={0} max={5} onChange={setQuantity} />
+          </Flow>
+        </Region>
+
+        <ActionBar>
+          <SubmitButton pending={demo.isPending} pendingLabel="Running demo…">Run form demo</SubmitButton>
+          <Action type="reset" variant="quiet">Native reset</Action>
+        </ActionBar>
+      </Flow>
+    </form>
+  );
+}
+
+export function DataSection() {
+  const cards = [
+    { id: 'alpha', title: 'Alpha', description: 'Ready for review', meta: '12 items' },
+    { id: 'beta', title: 'Beta', description: 'Needs attention', meta: '4 items' },
+    { id: 'gamma', title: 'Gamma', description: 'Recently updated', meta: '8 items' },
+  ];
+  return (
+    <Flow variant="stack">
+      <Region title="Facts" description="Compact label/value summaries with semantic tone.">
+        <Flow variant="grid">
+          <Fact label="Latency" value="42 ms" detail="p95" />
+          <Fact label="Success" value="99.9%" tone="success" trend="+0.4%" />
+          <Fact label="Budget" value="72%" tone="warning" detail="monthly" />
+          <Fact label="Errors" value="3" tone="danger" detail="last hour" />
+        </Flow>
+      </Region>
+
+      <Region title="Collections" description="List, grid, and selected repeated-data treatments.">
+        <Collection variant="grid" selectionMode="single">
+          {cards.map((card, index) => <Collection.Item key={card.id} as="button" type="button" selected={index === 0} title={card.title} description={card.description} meta={card.meta} badge={<StatusBadge tone={index === 1 ? 'warning' : 'success'}>{index === 1 ? 'Review' : 'Ready'}</StatusBadge>} />)}
+        </Collection>
+      </Region>
+
+      <Region title="DataCard and DataList">
+        <DataList>
+          <DataCard as="article"><strong>DataCard</strong><p>Low-level content card for application-specific composition.</p></DataCard>
+          <DataCard as="button" type="button"><strong>Interactive DataCard</strong><p>Uses native button behavior.</p></DataCard>
+        </DataList>
+      </Region>
+    </Flow>
+  );
+}
+
+export function FeedbackSection() {
+  const demo = useCallTool('run_component_demo');
+  return (
+    <Flow variant="stack">
+      <Region title="Feedback states" description="Loading, empty, error, success, partial, permission, and unsupported.">
+        <Flow variant="grid">
+          <Feedback status="loading" description="Fetching the latest result…" />
+          <Feedback status="empty" description="Try changing the filters." />
+          <Feedback status="error" description="The request could not be completed." />
+          <Feedback status="success" description="Everything is up to date." />
+          <Feedback status="partial" description="Some sources are still pending." />
+          <Feedback status="permission-denied" description="Reconnect the required account." />
+          <Feedback status="unsupported" description="This host does not expose that capability." />
+        </Flow>
+      </Region>
+
+      <Region title="State wrappers">
+        <Flow variant="grid">
+          <LoadingState><Spinner label="Loading state" /> LoadingState</LoadingState>
+          <EmptyState>EmptyState</EmptyState>
+          <ErrorState>ErrorState</ErrorState>
+        </Flow>
+      </Region>
+
+      <Region title="AsyncBoundary" actions={<Action onClick={() => void demo.callTool({ component: 'AsyncBoundary', value: 'demo' }).catch(() => undefined)}>Run tool</Action>}>
+        <AsyncBoundary state={demo} loading="Calling the app-only demo tool…" error={(error) => error.message} empty="No tool result yet" isEmpty={demo.isIdle}>
+          <Feedback status="success" description={String(demo.structuredContent ? 'The demo tool returned structured content.' : 'Complete.')} />
+        </AsyncBoundary>
+      </Region>
+    </Flow>
+  );
+}
+
+export function OverlaysSection() {
+  const [overlay, setOverlay] = useState<'modal' | 'sheet' | undefined>();
+  const [activity, setActivity] = useState('No overlay action selected.');
+  return (
+    <Flow variant="stack">
+      <Region title="Anchored overlays" description="Focus, keyboard behavior, dismissal, portals, and collision are Radix-backed.">
+        <ActionBar>
+          <Tooltip content="Tooltip content"><Action>Tooltip</Action></Tooltip>
+          <Popover trigger="Popover" triggerLabel="Open popover"><Flow variant="stack"><strong>Popover content</strong><Action onClick={() => setActivity('Popover action selected.')}>Select</Action></Flow></Popover>
+          <Menu trigger="Menu" triggerLabel="Open menu" items={[
+            { label: 'Rename', onSelect: () => setActivity('Rename selected.') },
+            { label: 'Archive', onSelect: () => setActivity('Archive selected.') },
+            'separator',
+            { label: 'Delete', danger: true, onSelect: () => setActivity('Delete selected.') },
+          ]} />
+        </ActionBar>
+        <Feedback status="partial" title="Interaction log" description={activity} />
+      </Region>
+
+      <Region title="Dialog and sheet">
+        <ActionBar>
+          <Action onClick={() => setOverlay('modal')}>Open modal</Action>
+          <Action onClick={() => setOverlay('sheet')}>Open sheet</Action>
+        </ActionBar>
+        <Overlay open={overlay !== undefined} onOpenChange={(open) => { if (!open) setOverlay(undefined); }} mode={overlay ?? 'modal'} title={overlay === 'sheet' ? 'Sheet example' : 'Modal example'} description="Escape, outside click, and the close button dismiss this surface.">
+          <Action variant="primary" onClick={() => setOverlay(undefined)}>Complete</Action>
+          <Menu trigger="Nested menu" items={[{ label: 'Nested action' }]} />
+        </Overlay>
+      </Region>
+
+      <Overlay mode="detail" open title="Detail overlay" description="Detail mode remains an inline named region.">
+        Use detail mode when content belongs in the document flow rather than a modal layer.
+      </Overlay>
+    </Flow>
+  );
+}
+
+export function LayoutSection() {
+  const [shellView, setShellView] = useState('overview');
+  const carouselItems = [
+    { id: 'one', title: 'First card' },
+    { id: 'two', title: 'Second card' },
+    { id: 'three', title: 'Third card' },
+  ];
+  return (
+    <Flow variant="stack">
+      <Region title="ShellHeader and ShellNav">
+        <ShellHeader title="Application shell" subtitle="Header composition" badge={<StatusBadge tone="success">Live</StatusBadge>} />
+        <ShellNav activeView={shellView} onNavigate={setShellView} items={[
+          { view: 'overview', label: 'Overview' },
+          { view: 'activity', label: 'Activity' },
+          { view: 'settings', label: 'Settings' },
+        ]} />
+      </Region>
+
+      <Region title="Flow variants" description="Stack, cluster, split, grid, and sidebar compositions share one primitive.">
+        <Flow variant="split"><InlineCard title="Split A" description="First column" /><InlineCard title="Split B" description="Second column" /></Flow>
+        <Flow variant="sidebar"><InlineCard title="Sidebar" description="Supporting rail" /><InlineCard title="Content" description="Primary area" /></Flow>
+      </Region>
+
+      <Region title="InlineCard">
+        <InlineCard title="Compact inline surface" description="A host-blending card with two actions." primaryAction={<Action variant="primary">Primary</Action>} secondaryAction={<Action variant="quiet">Secondary</Action>}>InlineCard content</InlineCard>
+      </Region>
+
+      <Region title="InlineList">
+        <InlineList items={carouselItems.map((item, index) => ({ id: item.id, title: item.title, description: 'List item description', meta: String(index + 1), action: <Action variant="quiet">Open</Action> }))} />
+      </Region>
+
+      <Region title="InlineCarousel">
+        <InlineCarousel items={carouselItems}>{(item) => <InlineCard title={item.title} description="Horizontally scrollable item" />}</InlineCarousel>
+      </Region>
+    </Flow>
+  );
+}
+`;
+//# sourceMappingURL=widget-showcase-template.js.map

package/dist/widget-showcase-template.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"widget-showcase-template.js","sourceRoot":"","sources":["../src/widget-showcase-template.ts"],"names":[],"mappings":"AAAA,oFAAoF;AAEpF,MAAM,CAAC,MAAM,qBAAqB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+DpC,CAAC;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8GjC,CAAC;AAEF,MAAM,CAAC,MAAM,sBAAsB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4SrC,CAAC"}

package/node_modules/@floating-ui/core/LICENSE

@@ -0,0 +1,20 @@
+MIT License
+
+Copyright (c) 2021-present Floating UI contributors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of
+this software and associated documentation files (the "Software"), to deal in
+the Software without restriction, including without limitation the rights to
+use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
+the Software, and to permit persons to whom the Software is furnished to do so,
+subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
+IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/node_modules/@floating-ui/core/README.md

@@ -0,0 +1,4 @@
+# @floating-ui/core
+
+This is the platform-agnostic core of Floating UI, exposing the main
+`computePosition` function but no platform interface logic.

package/node_modules/@floating-ui/core/dist/floating-ui.core.browser.min.mjs

@@ -0,0 +1 @@
+const t=["top","right","bottom","left"],e=["start","end"],n=t.reduce(((t,n)=>t.concat(n,n+"-"+e[0],n+"-"+e[1])),[]),r=Math.min,i=Math.max,o={left:"right",right:"left",bottom:"top",top:"bottom"};function a(t,e,n){return i(t,r(e,n))}function l(t,e){return"function"==typeof t?t(e):t}function s(t){return t.split("-")[0]}function c(t){return t.split("-")[1]}function f(t){return"x"===t?"y":"x"}function m(t){return"y"===t?"height":"width"}function u(t){const e=t[0];return"t"===e||"b"===e?"y":"x"}function d(t){return f(u(t))}function g(t,e,n){void 0===n&&(n=!1);const r=c(t),i=d(t),o=m(i);let a="x"===i?r===(n?"end":"start")?"right":"left":"start"===r?"bottom":"top";return e.reference[o]>e.floating[o]&&(a=b(a)),[a,b(a)]}function p(t){return t.includes("start")?t.replace("start","end"):t.replace("end","start")}const h=["left","right"],y=["right","left"],w=["top","bottom"],x=["bottom","top"];function v(t,e,n,r){const i=c(t);let o=function(t,e,n){switch(t){case"top":case"bottom":return n?e?y:h:e?h:y;case"left":case"right":return e?w:x;default:return[]}}(s(t),"start"===n,r);return i&&(o=o.map((t=>t+"-"+i)),e&&(o=o.concat(o.map(p)))),o}function b(t){const e=s(t);return o[e]+t.slice(e.length)}function A(t){return"number"!=typeof t?function(t){return{top:0,right:0,bottom:0,left:0,...t}}(t):{top:t,right:t,bottom:t,left:t}}function R(t){const{x:e,y:n,width:r,height:i}=t;return{width:r,height:i,top:n,left:e,right:e+r,bottom:n+i,x:e,y:n}}function O(t,e,n){let{reference:r,floating:i}=t;const o=u(e),a=d(e),l=m(a),f=s(e),g="y"===o,p=r.x+r.width/2-i.width/2,h=r.y+r.height/2-i.height/2,y=r[l]/2-i[l]/2;let w;switch(f){case"top":w={x:p,y:r.y-i.height};break;case"bottom":w={x:p,y:r.y+r.height};break;case"right":w={x:r.x+r.width,y:h};break;case"left":w={x:r.x-i.width,y:h};break;default:w={x:r.x,y:r.y}}switch(c(e)){case"start":w[a]-=y*(n&&g?-1:1);break;case"end":w[a]+=y*(n&&g?-1:1)}return w}async function D(t,e){var n;void 0===e&&(e={});const{x:r,y:i,platform:o,rects:a,elements:s,strategy:c}=t,{boundary:f="clippingAncestors",rootBoundary:m="viewport",elementContext:u="floating",altBoundary:d=!1,padding:g=0}=l(e,t),p=A(g),h=s[d?"floating"===u?"reference":"floating":u],y=R(await o.getClippingRect({element:null==(n=await(null==o.isElement?void 0:o.isElement(h)))||n?h:h.contextElement||await(null==o.getDocumentElement?void 0:o.getDocumentElement(s.floating)),boundary:f,rootBoundary:m,strategy:c})),w="floating"===u?{x:r,y:i,width:a.floating.width,height:a.floating.height}:a.reference,x=await(null==o.getOffsetParent?void 0:o.getOffsetParent(s.floating)),v=await(null==o.isElement?void 0:o.isElement(x))&&await(null==o.getScale?void 0:o.getScale(x))||{x:1,y:1},b=R(o.convertOffsetParentRelativeRectToViewportRelativeRect?await o.convertOffsetParentRelativeRectToViewportRelativeRect({elements:s,rect:w,offsetParent:x,strategy:c}):w);return{top:(y.top-b.top+p.top)/v.y,bottom:(b.bottom-y.bottom+p.bottom)/v.y,left:(y.left-b.left+p.left)/v.x,right:(b.right-y.right+p.right)/v.x}}const P=async(t,e,n)=>{const{placement:r="bottom",strategy:i="absolute",middleware:o=[],platform:a}=n,l=a.detectOverflow?a:{...a,detectOverflow:D},s=await(null==a.isRTL?void 0:a.isRTL(e));let c=await a.getElementRects({reference:t,floating:e,strategy:i}),{x:f,y:m}=O(c,r,s),u=r,d=0;const g={};for(let n=0;n<o.length;n++){const p=o[n];if(!p)continue;const{name:h,fn:y}=p,{x:w,y:x,data:v,reset:b}=await y({x:f,y:m,initialPlacement:r,placement:u,strategy:i,middlewareData:g,rects:c,platform:l,elements:{reference:t,floating:e}});f=null!=w?w:f,m=null!=x?x:m,g[h]={...g[h],...v},b&&d<50&&(d++,"object"==typeof b&&(b.placement&&(u=b.placement),b.rects&&(c=!0===b.rects?await a.getElementRects({reference:t,floating:e,strategy:i}):b.rects),({x:f,y:m}=O(c,u,s))),n=-1)}return{x:f,y:m,placement:u,strategy:i,middlewareData:g}},E=t=>({name:"arrow",options:t,async fn(e){const{x:n,y:i,placement:o,rects:s,platform:f,elements:u,middlewareData:g}=e,{element:p,padding:h=0}=l(t,e)||{};if(null==p)return{};const y=A(h),w={x:n,y:i},x=d(o),v=m(x),b=await f.getDimensions(p),R="y"===x,O=R?"top":"left",D=R?"bottom":"right",P=R?"clientHeight":"clientWidth",E=s.reference[v]+s.reference[x]-w[x]-s.floating[v],T=w[x]-s.reference[x],L=await(null==f.getOffsetParent?void 0:f.getOffsetParent(p));let k=L?L[P]:0;k&&await(null==f.isElement?void 0:f.isElement(L))||(k=u.floating[P]||s.floating[v]);const C=E/2-T/2,H=k/2-b[v]/2-1,B=r(y[O],H),S=r(y[D],H),F=B,M=k-b[v]-S,V=k/2-b[v]/2+C,W=a(F,V,M),j=!g.arrow&&null!=c(o)&&V!==W&&s.reference[v]/2-(V<F?B:S)-b[v]/2<0,z=j?V<F?V-F:V-M:0;return{[x]:w[x]+z,data:{[x]:W,centerOffset:V-W-z,...j&&{alignmentOffset:z}},reset:j}}});const T=function(t){return void 0===t&&(t={}),{name:"autoPlacement",options:t,async fn(e){var r,i,o;const{rects:a,middlewareData:f,placement:m,platform:u,elements:d}=e,{crossAxis:h=!1,alignment:y,allowedPlacements:w=n,autoAlignment:x=!0,...v}=l(t,e),b=void 0!==y||w===n?function(t,e,n){return(t?[...n.filter((e=>c(e)===t)),...n.filter((e=>c(e)!==t))]:n.filter((t=>s(t)===t))).filter((n=>!t||c(n)===t||!!e&&p(n)!==n))}(y||null,x,w):w,A=await u.detectOverflow(e,v),R=(null==(r=f.autoPlacement)?void 0:r.index)||0,O=b[R];if(null==O)return{};const D=g(O,a,await(null==u.isRTL?void 0:u.isRTL(d.floating)));if(m!==O)return{reset:{placement:b[0]}};const P=[A[s(O)],A[D[0]],A[D[1]]],E=[...(null==(i=f.autoPlacement)?void 0:i.overflows)||[],{placement:O,overflows:P}],T=b[R+1];if(T)return{data:{index:R+1,overflows:E},reset:{placement:T}};const L=E.map((t=>{const e=c(t.placement);return[t.placement,e&&h?t.overflows.slice(0,2).reduce(((t,e)=>t+e),0):t.overflows[0],t.overflows]})).sort(((t,e)=>t[1]-e[1])),k=(null==(o=L.filter((t=>t[2].slice(0,c(t[0])?2:3).every((t=>t<=0))))[0])?void 0:o[0])||L[0][0];return k!==m?{data:{index:R+1,overflows:E},reset:{placement:k}}:{}}}},L=function(t){return void 0===t&&(t={}),{name:"flip",options:t,async fn(e){var n,r;const{placement:i,middlewareData:o,rects:a,initialPlacement:c,platform:f,elements:m}=e,{mainAxis:d=!0,crossAxis:h=!0,fallbackPlacements:y,fallbackStrategy:w="bestFit",fallbackAxisSideDirection:x="none",flipAlignment:A=!0,...R}=l(t,e);if(null!=(n=o.arrow)&&n.alignmentOffset)return{};const O=s(i),D=u(c),P=s(c)===c,E=await(null==f.isRTL?void 0:f.isRTL(m.floating)),T=y||(P||!A?[b(c)]:function(t){const e=b(t);return[p(t),e,p(e)]}(c)),L="none"!==x;!y&&L&&T.push(...v(c,A,x,E));const k=[c,...T],C=await f.detectOverflow(e,R),H=[];let B=(null==(r=o.flip)?void 0:r.overflows)||[];if(d&&H.push(C[O]),h){const t=g(i,a,E);H.push(C[t[0]],C[t[1]])}if(B=[...B,{placement:i,overflows:H}],!H.every((t=>t<=0))){var S,F;const t=((null==(S=o.flip)?void 0:S.index)||0)+1,e=k[t];if(e){if(!("alignment"===h&&D!==u(e))||B.every((t=>u(t.placement)!==D||t.overflows[0]>0)))return{data:{index:t,overflows:B},reset:{placement:e}}}let n=null==(F=B.filter((t=>t.overflows[0]<=0)).sort(((t,e)=>t.overflows[1]-e.overflows[1]))[0])?void 0:F.placement;if(!n)switch(w){case"bestFit":{var M;const t=null==(M=B.filter((t=>{if(L){const e=u(t.placement);return e===D||"y"===e}return!0})).map((t=>[t.placement,t.overflows.filter((t=>t>0)).reduce(((t,e)=>t+e),0)])).sort(((t,e)=>t[1]-e[1]))[0])?void 0:M[0];t&&(n=t);break}case"initialPlacement":n=c}if(i!==n)return{reset:{placement:n}}}return{}}}};function k(t,e){return{top:t.top-e.height,right:t.right-e.width,bottom:t.bottom-e.height,left:t.left-e.width}}function C(e){return t.some((t=>e[t]>=0))}const H=function(t){return void 0===t&&(t={}),{name:"hide",options:t,async fn(e){const{rects:n,platform:r}=e,{strategy:i="referenceHidden",...o}=l(t,e);switch(i){case"referenceHidden":{const t=k(await r.detectOverflow(e,{...o,elementContext:"reference"}),n.reference);return{data:{referenceHiddenOffsets:t,referenceHidden:C(t)}}}case"escaped":{const t=k(await r.detectOverflow(e,{...o,altBoundary:!0}),n.floating);return{data:{escapedOffsets:t,escaped:C(t)}}}default:return{}}}}};function B(t){const e=r(...t.map((t=>t.left))),n=r(...t.map((t=>t.top)));return{x:e,y:n,width:i(...t.map((t=>t.right)))-e,height:i(...t.map((t=>t.bottom)))-n}}const S=function(t){return void 0===t&&(t={}),{name:"inline",options:t,async fn(e){const{placement:n,elements:o,rects:a,platform:c,strategy:f}=e,{padding:m=2,x:d,y:g}=l(t,e),p=Array.from(await(null==c.getClientRects?void 0:c.getClientRects(o.reference))||[]),h=function(t){const e=t.slice().sort(((t,e)=>t.y-e.y)),n=[];let r=null;for(let t=0;t<e.length;t++){const i=e[t];!r||i.y-r.y>r.height/2?n.push([i]):n[n.length-1].push(i),r=i}return n.map((t=>R(B(t))))}(p),y=R(B(p)),w=A(m);const x=await c.getElementRects({reference:{getBoundingClientRect:function(){if(2===h.length&&h[0].left>h[1].right&&null!=d&&null!=g)return h.find((t=>d>t.left-w.left&&d<t.right+w.right&&g>t.top-w.top&&g<t.bottom+w.bottom))||y;if(h.length>=2){if("y"===u(n)){const t=h[0],e=h[h.length-1],r="top"===s(n),i=t.top,o=e.bottom,a=r?t.left:e.left,l=r?t.right:e.right;return{top:i,bottom:o,left:a,right:l,width:l-a,height:o-i,x:a,y:i}}const t="left"===s(n),e=i(...h.map((t=>t.right))),o=r(...h.map((t=>t.left))),a=h.filter((n=>t?n.left===o:n.right===e)),l=a[0].top,c=a[a.length-1].bottom;return{top:l,bottom:c,left:o,right:e,width:e-o,height:c-l,x:o,y:l}}return y}},floating:o.floating,strategy:f});return a.reference.x!==x.reference.x||a.reference.y!==x.reference.y||a.reference.width!==x.reference.width||a.reference.height!==x.reference.height?{reset:{rects:x}}:{}}}},F=new Set(["left","top"]);const M=function(t){return void 0===t&&(t=0),{name:"offset",options:t,async fn(e){var n,r;const{x:i,y:o,placement:a,middlewareData:f}=e,m=await async function(t,e){const{placement:n,platform:r,elements:i}=t,o=await(null==r.isRTL?void 0:r.isRTL(i.floating)),a=s(n),f=c(n),m="y"===u(n),d=F.has(a)?-1:1,g=o&&m?-1:1,p=l(e,t);let{mainAxis:h,crossAxis:y,alignmentAxis:w}="number"==typeof p?{mainAxis:p,crossAxis:0,alignmentAxis:null}:{mainAxis:p.mainAxis||0,crossAxis:p.crossAxis||0,alignmentAxis:p.alignmentAxis};return f&&"number"==typeof w&&(y="end"===f?-1*w:w),m?{x:y*g,y:h*d}:{x:h*d,y:y*g}}(e,t);return a===(null==(n=f.offset)?void 0:n.placement)&&null!=(r=f.arrow)&&r.alignmentOffset?{}:{x:i+m.x,y:o+m.y,data:{...m,placement:a}}}}},V=function(t){return void 0===t&&(t={}),{name:"shift",options:t,async fn(e){const{x:n,y:r,placement:i,platform:o}=e,{mainAxis:c=!0,crossAxis:m=!1,limiter:d={fn:t=>{let{x:e,y:n}=t;return{x:e,y:n}}},...g}=l(t,e),p={x:n,y:r},h=await o.detectOverflow(e,g),y=u(s(i)),w=f(y);let x=p[w],v=p[y];if(c){const t="y"===w?"bottom":"right";x=a(x+h["y"===w?"top":"left"],x,x-h[t])}if(m){const t="y"===y?"bottom":"right";v=a(v+h["y"===y?"top":"left"],v,v-h[t])}const b=d.fn({...e,[w]:x,[y]:v});return{...b,data:{x:b.x-n,y:b.y-r,enabled:{[w]:c,[y]:m}}}}}},W=function(t){return void 0===t&&(t={}),{options:t,fn(e){const{x:n,y:r,placement:i,rects:o,middlewareData:a}=e,{offset:c=0,mainAxis:m=!0,crossAxis:d=!0}=l(t,e),g={x:n,y:r},p=u(i),h=f(p);let y=g[h],w=g[p];const x=l(c,e),v="number"==typeof x?{mainAxis:x,crossAxis:0}:{mainAxis:0,crossAxis:0,...x};if(m){const t="y"===h?"height":"width",e=o.reference[h]-o.floating[t]+v.mainAxis,n=o.reference[h]+o.reference[t]-v.mainAxis;y<e?y=e:y>n&&(y=n)}if(d){var b,A;const t="y"===h?"width":"height",e=F.has(s(i)),n=o.reference[p]-o.floating[t]+(e&&(null==(b=a.offset)?void 0:b[p])||0)+(e?0:v.crossAxis),r=o.reference[p]+o.reference[t]+(e?0:(null==(A=a.offset)?void 0:A[p])||0)-(e?v.crossAxis:0);w<n?w=n:w>r&&(w=r)}return{[h]:y,[p]:w}}}},j=function(t){return void 0===t&&(t={}),{name:"size",options:t,async fn(e){var n,o;const{placement:a,rects:f,platform:m,elements:d}=e,{apply:g=()=>{},...p}=l(t,e),h=await m.detectOverflow(e,p),y=s(a),w=c(a),x="y"===u(a),{width:v,height:b}=f.floating;let A,R;"top"===y||"bottom"===y?(A=y,R=w===(await(null==m.isRTL?void 0:m.isRTL(d.floating))?"start":"end")?"left":"right"):(R=y,A="end"===w?"top":"bottom");const O=b-h.top-h.bottom,D=v-h.left-h.right,P=r(b-h[A],O),E=r(v-h[R],D),T=!e.middlewareData.shift;let L=P,k=E;if(null!=(n=e.middlewareData.shift)&&n.enabled.x&&(k=D),null!=(o=e.middlewareData.shift)&&o.enabled.y&&(L=O),T&&!w){const t=i(h.left,0),e=i(h.right,0),n=i(h.top,0),r=i(h.bottom,0);x?k=v-2*(0!==t||0!==e?t+e:i(h.left,h.right)):L=b-2*(0!==n||0!==r?n+r:i(h.top,h.bottom))}await g({...e,availableWidth:k,availableHeight:L});const C=await m.getDimensions(d.floating);return v!==C.width||b!==C.height?{reset:{rects:!0}}:{}}}};export{E as arrow,T as autoPlacement,P as computePosition,D as detectOverflow,L as flip,H as hide,S as inline,W as limitShift,M as offset,R as rectToClientRect,V as shift,j as size};