remix 3.0.0-rc.4 → 3.0.0

package/dist/ui/select/primitives.d.ts

@@ -1,2 +0,0 @@
-export * from '@remix-run/ui/select/primitives';
-//# sourceMappingURL=primitives.d.ts.map

package/dist/ui/select/primitives.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"primitives.d.ts","sourceRoot":"","sources":["../../../src/ui/select/primitives.ts"],"names":[],"mappings":"AACA,cAAc,iCAAiC,CAAA"}

package/dist/ui/select/primitives.js

@@ -1,2 +0,0 @@
-// IMPORTANT: This file is auto-generated, please do not edit manually.
-export * from '@remix-run/ui/select/primitives';

package/dist/ui/select.d.ts

@@ -1,2 +0,0 @@
-export * from '@remix-run/ui/select';
-//# sourceMappingURL=select.d.ts.map

package/dist/ui/select.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../src/ui/select.ts"],"names":[],"mappings":"AACA,cAAc,sBAAsB,CAAA"}

package/dist/ui/select.js

@@ -1,2 +0,0 @@
-// IMPORTANT: This file is auto-generated, please do not edit manually.
-export * from '@remix-run/ui/select';

package/dist/ui/server.d.ts

@@ -1,2 +0,0 @@
-export * from '@remix-run/ui/server';
-//# sourceMappingURL=server.d.ts.map

package/dist/ui/server.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"server.d.ts","sourceRoot":"","sources":["../../src/ui/server.ts"],"names":[],"mappings":"AACA,cAAc,sBAAsB,CAAA"}

package/dist/ui/tabs/primitives.d.ts

@@ -1,2 +0,0 @@
-export * from '@remix-run/ui/tabs/primitives';
-//# sourceMappingURL=primitives.d.ts.map

package/dist/ui/tabs/primitives.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"primitives.d.ts","sourceRoot":"","sources":["../../../src/ui/tabs/primitives.ts"],"names":[],"mappings":"AACA,cAAc,+BAA+B,CAAA"}

package/dist/ui/tabs/primitives.js

@@ -1,2 +0,0 @@
-// IMPORTANT: This file is auto-generated, please do not edit manually.
-export * from '@remix-run/ui/tabs/primitives';

package/dist/ui/tabs.d.ts

@@ -1,2 +0,0 @@
-export * from '@remix-run/ui/tabs';
-//# sourceMappingURL=tabs.d.ts.map

package/dist/ui/tabs.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"tabs.d.ts","sourceRoot":"","sources":["../../src/ui/tabs.ts"],"names":[],"mappings":"AACA,cAAc,oBAAoB,CAAA"}

package/dist/ui/test.d.ts

@@ -1,2 +0,0 @@
-export * from '@remix-run/ui/test';
-//# sourceMappingURL=test.d.ts.map

package/dist/ui/test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"test.d.ts","sourceRoot":"","sources":["../../src/ui/test.ts"],"names":[],"mappings":"AACA,cAAc,oBAAoB,CAAA"}

package/dist/ui/toggle/primitives.d.ts

@@ -1,2 +0,0 @@
-export * from '@remix-run/ui/toggle/primitives';
-//# sourceMappingURL=primitives.d.ts.map

package/dist/ui/toggle/primitives.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"primitives.d.ts","sourceRoot":"","sources":["../../../src/ui/toggle/primitives.ts"],"names":[],"mappings":"AACA,cAAc,iCAAiC,CAAA"}

package/dist/ui/toggle/primitives.js

@@ -1,2 +0,0 @@
-// IMPORTANT: This file is auto-generated, please do not edit manually.
-export * from '@remix-run/ui/toggle/primitives';

package/dist/ui/toggle.d.ts

@@ -1,3 +0,0 @@
-export * from '@remix-run/ui/toggle';
-export { default } from '@remix-run/ui/toggle';
-//# sourceMappingURL=toggle.d.ts.map

package/dist/ui/toggle.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"toggle.d.ts","sourceRoot":"","sources":["../../src/ui/toggle.ts"],"names":[],"mappings":"AACA,cAAc,sBAAsB,CAAA;AACpC,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAA"}

package/dist/ui/toggle.js

@@ -1,3 +0,0 @@
-// IMPORTANT: This file is auto-generated, please do not edit manually.
-export * from '@remix-run/ui/toggle';
-export { default } from '@remix-run/ui/toggle';

package/dist/ui-hmr/assets.d.ts

@@ -1,2 +0,0 @@
-export * from '@remix-run/ui-hmr/assets';
-//# sourceMappingURL=assets.d.ts.map

package/dist/ui-hmr/assets.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"assets.d.ts","sourceRoot":"","sources":["../../src/ui-hmr/assets.ts"],"names":[],"mappings":"AACA,cAAc,0BAA0B,CAAA"}

package/dist/ui-hmr/node.d.ts

@@ -1,3 +0,0 @@
-import '@remix-run/ui-hmr/node';
-export {};
-//# sourceMappingURL=node.d.ts.map

package/dist/ui-hmr/node.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"node.d.ts","sourceRoot":"","sources":["../../src/ui-hmr/node.ts"],"names":[],"mappings":"AACA,OAAO,wBAAwB,CAAA;AAC/B,OAAO,EAAE,CAAA"}

package/dist/ui-hmr/runtime/browser.d.ts

@@ -1,2 +0,0 @@
-export * from '@remix-run/ui-hmr/runtime/browser';
-//# sourceMappingURL=browser.d.ts.map

package/dist/ui-hmr/runtime/browser.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"browser.d.ts","sourceRoot":"","sources":["../../../src/ui-hmr/runtime/browser.ts"],"names":[],"mappings":"AACA,cAAc,mCAAmC,CAAA"}

package/dist/ui-hmr/runtime/server.d.ts

@@ -1,2 +0,0 @@
-export * from '@remix-run/ui-hmr/runtime/server';
-//# sourceMappingURL=server.d.ts.map

package/dist/ui-hmr/runtime/server.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"server.d.ts","sourceRoot":"","sources":["../../../src/ui-hmr/runtime/server.ts"],"names":[],"mappings":"AACA,cAAc,kCAAkC,CAAA"}

package/dist/ui-hmr.d.ts

@@ -1,2 +0,0 @@
-export * from '@remix-run/ui-hmr';
-//# sourceMappingURL=ui-hmr.d.ts.map

package/dist/ui-hmr.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ui-hmr.d.ts","sourceRoot":"","sources":["../src/ui-hmr.ts"],"names":[],"mappings":"AACA,cAAc,mBAAmB,CAAA"}

package/dist/ui.d.ts

@@ -1,2 +0,0 @@
-export * from '@remix-run/ui';
-//# sourceMappingURL=ui.d.ts.map

package/dist/ui.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ui.d.ts","sourceRoot":"","sources":["../src/ui.ts"],"names":[],"mappings":"AACA,cAAc,eAAe,CAAA"}

package/dist/ui.js

@@ -1,2 +0,0 @@
-// IMPORTANT: This file is auto-generated, please do not edit manually.
-export * from '@remix-run/ui';

package/src/ui/accordion/README.md

@@ -1,202 +0,0 @@
-# accordion
-
-`Accordion` renders a disclosure set with one or more expandable items. Use it for grouped settings, FAQ sections, and dense panels where each item owns a trigger and content region.
-
-## Component Usage
-
-```tsx
-import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from 'remix/ui/accordion'
-
-export function SettingsAccordion() {
-  return (
-    <Accordion defaultValue="account">
-      <AccordionItem value="account">
-        <AccordionTrigger>Account</AccordionTrigger>
-        <AccordionContent>Manage account preferences.</AccordionContent>
-      </AccordionItem>
-
-      <AccordionItem value="billing">
-        <AccordionTrigger>Billing</AccordionTrigger>
-        <AccordionContent>Review billing details.</AccordionContent>
-      </AccordionItem>
-    </Accordion>
-  )
-}
-```
-
-Use `type="multiple"` when more than one panel may stay open. `defaultValue` and `value` are arrays in multiple mode.
-
-```tsx
-import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from 'remix/ui/accordion'
-
-export function StatusAccordion() {
-  return (
-    <Accordion defaultValue={['api', 'alerts']} type="multiple">
-      <AccordionItem value="api">
-        <AccordionTrigger>API status checks</AccordionTrigger>
-        <AccordionContent>Review uptime checks and response time alerts.</AccordionContent>
-      </AccordionItem>
-
-      <AccordionItem disabled value="access">
-        <AccordionTrigger>Access control sync</AccordionTrigger>
-        <AccordionContent>This disabled item cannot be opened or focused.</AccordionContent>
-      </AccordionItem>
-
-      <AccordionItem value="alerts">
-        <AccordionTrigger>Alert routing</AccordionTrigger>
-        <AccordionContent>Confirm escalation rules and notification channels.</AccordionContent>
-      </AccordionItem>
-    </Accordion>
-  )
-}
-```
-
-Control the open value when state should live in the owning component. Single mode uses `string | null`; multiple mode uses `string[]`.
-
-```tsx
-import type { Handle } from 'remix/ui'
-import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from 'remix/ui/accordion'
-
-export function ControlledAccordion(handle: Handle) {
-  let value: string | null = 'account'
-
-  return () => (
-    <Accordion
-      value={value}
-      onValueChange={(nextValue) => {
-        value = nextValue
-        void handle.update()
-      }}
-    >
-      <AccordionItem value="account">
-        <AccordionTrigger>Account</AccordionTrigger>
-        <AccordionContent>Manage account preferences.</AccordionContent>
-      </AccordionItem>
-
-      <AccordionItem value="billing">
-        <AccordionTrigger>Billing</AccordionTrigger>
-        <AccordionContent>Review billing details.</AccordionContent>
-      </AccordionItem>
-    </Accordion>
-  )
-}
-```
-
-Listen for bubbling `AccordionChangeEvent` events with `onAccordionChange` from `remix/ui/accordion/primitives`.
-
-```tsx
-import { onAccordionChange } from 'remix/ui/accordion/primitives'
-import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from 'remix/ui/accordion'
-
-export function TrackedAccordion() {
-  return (
-    <div
-      mix={[
-        onAccordionChange((event) => {
-          console.log(event.accordionType, event.itemValue, event.value)
-        }),
-      ]}
-    >
-      <Accordion>
-        <AccordionItem value="account">
-          <AccordionTrigger>Account</AccordionTrigger>
-          <AccordionContent>Manage account preferences.</AccordionContent>
-        </AccordionItem>
-      </Accordion>
-    </div>
-  )
-}
-```
-
-Set `collapsible={false}` in single mode when the open item must stay open. The locked-open trigger receives `aria-disabled`.
-
-```tsx
-<Accordion collapsible={false} defaultValue="account">
-  <AccordionItem value="account">
-    <AccordionTrigger>Account</AccordionTrigger>
-    <AccordionContent>Manage account preferences.</AccordionContent>
-  </AccordionItem>
-</Accordion>
-```
-
-Use `headingLevel` to choose the heading element rendered around each trigger. The default level is `3`.
-
-```tsx
-<Accordion defaultValue="shipping" headingLevel={2}>
-  <AccordionItem value="shipping">
-    <AccordionTrigger>Shipping</AccordionTrigger>
-    <AccordionContent>Review shipping preferences.</AccordionContent>
-  </AccordionItem>
-</Accordion>
-```
-
-Pass `indicator={null}` to remove the default chevron, or pass a custom node to replace it.
-
-```tsx
-<AccordionTrigger indicator={null}>No indicator</AccordionTrigger>
-<AccordionTrigger indicator={<span aria-hidden>+</span>}>Custom indicator</AccordionTrigger>
-```
-
-## Primitive Usage
-
-Use the lower-level primitives when app code owns the accordion markup and styles:
-
-```tsx
-import * as accordion from 'remix/ui/accordion/primitives'
-import { contentStyle, headingStyle, itemStyle, rootStyle, triggerStyle } from './accordion.styles'
-
-export function PrimitiveAccordion() {
-  return (
-    <accordion.Context defaultValue="shipping">
-      <div mix={[rootStyle, accordion.root()]}>
-        <accordion.ItemContext value="shipping">
-          <div mix={[itemStyle, accordion.item()]}>
-            <h3 mix={headingStyle}>
-              <button mix={[triggerStyle, accordion.trigger()]} type="button">
-                Shipping
-              </button>
-            </h3>
-            <div mix={[contentStyle, accordion.content()]}>
-              Delivery windows and carrier defaults.
-            </div>
-          </div>
-        </accordion.ItemContext>
-      </div>
-    </accordion.Context>
-  )
-}
-```
-
-## `remix/ui/accordion`
-
-- `Accordion`: root component. Defaults to single-item mode and supports controlled `value`, uncontrolled `defaultValue`, `onValueChange`, `disabled`, `headingLevel`, `collapsible`, and `type="multiple"`.
-- `AccordionItem`: registers one accordion item by `value`. Pass `disabled` to prevent that item from opening or receiving keyboard focus.
-- `AccordionTrigger`: heading-wrapped button for an item. It wires `aria-expanded`, `aria-controls`, keyboard navigation, and the default chevron indicator.
-- `AccordionContent`: panel for an item. It wires the panel id, `aria-labelledby`, `aria-hidden`, inert state, and open/closed state attributes.
-- `rootStyle`, `itemStyle`, `headingStyle`, `triggerStyle`, `indicatorStyle`, `panelStyle`, and `bodyStyle`: flat style mixins used by the component markup.
-- `AccordionProps`, `AccordionSingleProps`, `AccordionMultipleProps`, `AccordionItemProps`, `AccordionTriggerProps`, and `AccordionContentProps`: public TypeScript props for the composed APIs.
-
-## `remix/ui/accordion/primitives`
-
-- `Context`: lower-level provider for custom accordion composition.
-- `ItemContext`: lower-level provider for one item value.
-- `root()`: wires the root element and bubbling change events.
-- `item()`: wires one item wrapper.
-- `trigger()`: wires the item trigger, keyboard navigation, and trigger ARIA attributes.
-- `content()`: wires the item panel id, hidden state, inert state, and open/closed state attributes.
-- `onAccordionChange(...)`: event mixin for the bubbling `AccordionChangeEvent`.
-- `AccordionChangeEvent`: bubbling event with `value`, `itemValue`, and `accordionType`.
-- `AccordionType`, `AccordionValue`, `AccordionSingleValue`, `AccordionMultipleValue`, and `AccordionHeadingLevel`: public TypeScript state and configuration types.
-- `AccordionBaseContextProps`, `AccordionSingleContextProps`, `AccordionMultipleContextProps`, `AccordionContextProps`, `AccordionRootOptions`, `AccordionItemOptions`, `AccordionTriggerOptions`, and `AccordionContentOptions`: primitive prop and option types for custom composition.
-
-## Behavior Notes
-
-- Single mode stores one open value or `null`; multiple mode stores an array of open values.
-- Single accordions are collapsible by default. Set `collapsible={false}` to keep the open item locked open.
-- Root `disabled` disables every item. Item `disabled` only disables that item.
-- Arrow keys move between enabled triggers. `Home` and `End` move to the first and last enabled triggers.
-- Disabled items are skipped by keyboard navigation.
-- Trigger and panel ids are generated and linked with `aria-controls`, `aria-labelledby`, and `aria-expanded`; closed panels receive `aria-hidden` and `inert`.
-- `AccordionTrigger` renders inside an `h1`-`h6` element based on `headingLevel`.
-- Each item and trigger receives `data-state="open"` or `data-state="closed"` for styling.
-- `AccordionChangeEvent` bubbles from the root and includes `value`, `itemValue`, and `accordionType`.

package/src/ui/accordion/primitives.ts

@@ -1,2 +0,0 @@
-// IMPORTANT: This file is auto-generated, please do not edit manually.
-export * from '@remix-run/ui/accordion/primitives'

package/src/ui/accordion.ts

@@ -1,2 +0,0 @@
-// IMPORTANT: This file is auto-generated, please do not edit manually.
-export * from '@remix-run/ui/accordion'

package/src/ui/anchor/README.md

@@ -1,196 +0,0 @@
-# anchor
-
-`anchor` positions a floating element against an anchor element or viewport coordinates and keeps it constrained to the viewport. Use it for custom floating surfaces that need placement, flipping, offsets, and optional relative alignment.
-
-## Primitive Usage
-
-```tsx
-import { anchor } from 'remix/ui/anchor'
-
-let trigger = document.querySelector<HTMLButtonElement>('[data-trigger]')
-let panel = document.querySelector<HTMLElement>('[data-panel]')
-
-if (trigger && panel) {
-  let cleanup = anchor(panel, trigger, {
-    placement: 'bottom-end',
-    offset: 8,
-  })
-
-  // Later, when the surface closes or unmounts:
-  cleanup()
-}
-```
-
-Use the returned cleanup function with the lifecycle that owns the floating element. For native popovers, position on open and clean up on close.
-
-```tsx
-import { anchor } from 'remix/ui/anchor'
-
-let cleanupAnchor = () => {}
-
-button.addEventListener('click', () => {
-  popover.showPopover()
-})
-
-popover.addEventListener('beforetoggle', (event) => {
-  let toggleEvent = event as ToggleEvent
-
-  if (toggleEvent.newState === 'open') {
-    cleanupAnchor()
-    cleanupAnchor = anchor(popover, button, {
-      placement: 'bottom-start',
-      offset: 4,
-    })
-    return
-  }
-
-  cleanupAnchor()
-  cleanupAnchor = () => {}
-})
-```
-
-Anchor to coordinates when the surface should open at a pointer location.
-
-```tsx
-let cleanup = anchor(popover, { x: event.clientX, y: event.clientY }, { placement: 'bottom-start' })
-```
-
-Keep presentation app-owned when the anchored element is rendered by your component:
-
-```tsx
-import { anchor } from 'remix/ui/anchor'
-import { on, ref } from 'remix/ui'
-import type { Handle } from 'remix/ui'
-import { panelStyle } from './floating.styles.ts'
-
-export function AnchoredPanel(handle: Handle) {
-  let cleanup = () => {}
-  let trigger: HTMLElement | null = null
-  let panel: HTMLElement | null = null
-
-  handle.signal.addEventListener('abort', () => cleanup(), { once: true })
-
-  function position() {
-    cleanup()
-    if (trigger && panel) {
-      cleanup = anchor(panel, trigger, { placement: 'bottom-start', offset: 8 })
-    }
-  }
-
-  return () => (
-    <>
-      <button mix={[ref((node) => (trigger = node)), on('click', position)]} type="button">
-        Open
-      </button>
-      <div data-panel mix={[panelStyle, ref((node) => (panel = node))]}>
-        Panel
-      </div>
-    </>
-  )
-}
-```
-
-## `remix/ui/anchor`
-
-- `anchor(floatingElement, anchorTarget, options)`: positions `floatingElement` against an element or coordinate target, starts animation-frame polling for geometry changes, and returns a cleanup function.
-- `AnchorOptions`: placement, inset, relative alignment, and offset options.
-- `AnchorPoint`: viewport coordinate target with `x`, `y`, and optional `width`/`height`.
-- `AnchorPlacement`: exported placement names for the main sides and top/bottom start/end alignment.
-- `AnchorTarget`: an `HTMLElement` or `AnchorPoint`.
-
-## Placements
-
-Default placement is `bottom`. Use start/end variants to align an edge instead of centering the floating element on the anchor.
-
-```tsx
-anchor(panel, trigger, { placement: 'bottom' })
-anchor(panel, trigger, { placement: 'bottom-start' })
-anchor(panel, trigger, { placement: 'bottom-end' })
-anchor(panel, trigger, { placement: 'top' })
-anchor(panel, trigger, { placement: 'left' })
-anchor(panel, trigger, { placement: 'right' })
-```
-
-The positioning logic can also handle left/right start/end placements through `AnchorOptions['placement']`.
-
-```tsx
-anchor(panel, trigger, { placement: 'right-start' })
-anchor(panel, trigger, { placement: 'left-end' })
-```
-
-When the requested placement would overflow the viewport, `anchor` flips to the opposite side and writes the final placement to `data-anchor-placement`.
-
-```tsx
-let cleanup = anchor(panel, trigger, {
-  placement: 'bottom-start',
-})
-
-panel.dataset.anchorPlacement
-```
-
-## Offsets
-
-Use `offset` for distance along the placement axis. Use `offsetX` and `offsetY` for independent adjustment after placement is resolved.
-
-```tsx
-anchor(panel, trigger, {
-  placement: 'bottom-start',
-  offset: 8,
-  offsetX: 4,
-  offsetY: -2,
-})
-```
-
-Offsets may be numbers or functions that receive the floating element.
-
-```tsx
-anchor(panel, trigger, {
-  placement: 'bottom-start',
-  offset: (floating) => floating.offsetHeight / 10,
-  offsetX: (floating) => floating.offsetWidth / 20,
-})
-```
-
-## Inset Positioning
-
-Pass `inset: true` to align the floating element inside the anchor edge instead of outside it. This is useful for surfaces that should visually cover or line up with the trigger.
-
-```tsx
-anchor(panel, trigger, {
-  placement: 'bottom-start',
-  inset: true,
-})
-```
-
-## Relative Alignment
-
-Use `relativeTo` when a child inside the floating element should align to the anchor instead of the floating element's outer box. The value is a selector scoped to the floating element.
-
-```tsx
-anchor(listbox, trigger, {
-  placement: 'bottom-start',
-  relativeTo: '[role="option"][aria-selected="true"]',
-})
-```
-
-Combine `relativeTo` with `inset` for selected-option popovers where the selected option should sit over the trigger.
-
-```tsx
-anchor(listbox, trigger, {
-  placement: 'left',
-  inset: true,
-  relativeTo: '[aria-selected="true"]',
-})
-```
-
-## Behavior Notes
-
-- Default placement is below the anchor.
-- Supported placements include top, bottom, left, right, top/bottom start/end variants, and left/right start/end placements through `AnchorOptions['placement']`.
-- The floating element flips when the requested placement would overflow the viewport and records the final placement in `data-anchor-placement`.
-- Oversized floating elements are constrained with max dimensions and remain inside the viewport padding.
-- Oversized inset surfaces with `relativeTo` preserve alignment by scrolling the nearest scrollable descendant when possible.
-- `offset`, `offsetX`, and `offsetY` may be numbers or functions that receive the floating element.
-- `relativeTo` lets a surface align to an inner element, which is useful for selected options inside popovers.
-- `anchor` polls on animation frames for anchor target or floating geometry changes and repositions when either changes.
-- The returned cleanup function cancels animation-frame polling and removes scroll and resize listeners. It leaves the last inline styles and `data-anchor-placement` attribute in place.

package/src/ui/anchor.ts

@@ -1,2 +0,0 @@
-// IMPORTANT: This file is auto-generated, please do not edit manually.
-export * from '@remix-run/ui/anchor'