@graphty/compact-mantine 0.6.0 → 0.7.0

package/dist/index.d.ts

@@ -49,6 +49,7 @@ import { VariantColorsResolver } from '@mantine/core';
  * @param props.actions - Controls that act, hidden until the row is hovered or focused, and always drawn where the pointer cannot hover
  * @param props.residentActions - Controls that report a state, which are never hidden
  * @param props.actionsVisible - Forces the hidden controls shown or hidden instead of letting hover and focus decide
+ * @param props.disabled - Whether the row cannot act, which draws its reading at the disabled ink and announces it as unavailable
  * @param props.onClick - Called when the row's own reading is activated, with the event and the activation source
  * @param props.onFocus - Called when focus enters the row or moves between its controls
  * @param props.onBlur - Called when focus leaves a control in the row
@@ -139,6 +140,18 @@ export declare interface ActionRowProps {
      * scan a column for.
      */
     residentActions?: default_2.ReactNode;
+    /**
+     * Whether this row cannot act, and says so by being drawn dimmer.
+     *
+     * It is the row half of the "not built yet" group form: where three or more
+     * contiguous rows share that status the tag rises once to the group header and the
+     * rows below are "dimmed and disabled instead of tagged individually". The reading
+     * then takes the disabled ink -- a different token from the ordinary muted one --
+     * and the row is announced as unavailable, so nothing about the state depends on
+     * telling two greys apart.
+     * @default false
+     */
+    disabled?: boolean;
     /**
      * Forces `actions` to be drawn, or forces them hidden, instead of letting
      * the row decide from hover and focus.
@@ -1274,6 +1287,7 @@ export declare interface ControlGroupProps {
  * section is correct in either direction with nothing to configure.
  * @param props - Component props
  * @param props.label - The section's name, drawn in its header
+ * @param props.technicalName - The technical half of the 6.3 pair, drawn in the secondary ink inside the same label
  * @param props.opened - Whether the section is expanded, when you drive it from your own state
  * @param props.defaultOpened - Whether the section starts expanded when it keeps its own state, defaulting to true
  * @param props.onOpenChange - Called when the section expands or collapses, with the new state first and the event second
@@ -1312,6 +1326,16 @@ export declare function ControlSection(props: ControlSectionProps): default_2.JS
 export declare interface ControlSectionProps extends DisclosureProps {
     /** The section's name, drawn in its header. One to three words, sentence case. */
     label: string;
+    /**
+     * The technical name for the same thing, WITHOUT its parentheses -- `"Layout"`
+     * beside `"Arrangement"`, `"Node and edge table"` beside `"Data table"`.
+     *
+     * One drawing only: plain name, space, technical name in parentheses in the
+     * secondary ink, inside this one label. It joins the header's tooltip and the
+     * group's accessible name as well, so the pair is never something only a pointer
+     * can reach.
+     */
+    technicalName?: string;
     /**
      * Whether the section holds settings the reader changed from their
      * defaults. A 6px accent dot follows the name, announced to a screen reader
@@ -3789,6 +3813,15 @@ export declare interface PopoutContextValue {
      * everything opened from it.
      */
     parentId: string | null;
+    /**
+     * The region this pop-out was opened in, or null when it sits in no region.
+     *
+     * Root-level pop-outs compete for one open slot per region, so a pop-out
+     * opened in a panel and one opened in an inspector can both be open while
+     * two opened in the same panel cannot. It is the opener's region, not the
+     * panel's screen position.
+     */
+    region: string | null;
 }
 
 /**
@@ -3883,8 +3916,11 @@ export declare function PopoutManager({ children }: PopoutManagerProps): JSX.Ele
  * out of `Popout` never needs it.
  */
 export declare interface PopoutManagerContextValue {
-    /** Adds a pop-out to the layer, with the callback that closes it and the pop-out it was opened from. */
-    register: (id: string, closeCallback: () => void, parentId?: string | null) => void;
+    /**
+     * Adds a pop-out to the layer, with the callback that closes it, the pop-out
+     * it was opened from, and the region it was opened in.
+     */
+    register: (id: string, closeCallback: () => void, parentId?: string | null, region?: string | null) => void;
     /** Takes a pop-out out of the layer, when it leaves the page. */
     unregister: (id: string) => void;
     /** The stacking order a pop-out currently draws at. */
@@ -4102,6 +4138,56 @@ export declare interface PopoutProps extends DisclosureProps {
     children: ReactNode;
 }
 
+/**
+ * Which region the pop-outs beneath this point belong to.
+ *
+ * A shell is divided into regions -- a properties panel, an inspector, the
+ * surface between them, a dialog, a dock -- and a reader may hold one pop-out
+ * open in each, because two pop-outs describing two different objects are not
+ * competing for the same answer. What they may not do is stack up inside ONE
+ * region: opening a second there closes the first, because both describe the
+ * same object and the second is the reader changing their mind.
+ *
+ * Without a region, every pop-out opened straight from the page is a sibling of
+ * every other, so an inspector pop-out closes a panel pop-out that has nothing
+ * to do with it. That is the behaviour this component exists to divide up, and
+ * it is why the default -- no region at all -- keeps the older whole-page rule:
+ * an application that never mentions regions is unaffected.
+ *
+ * The region is the OPENER's, not the surface's screen position. Wrap the
+ * region's own markup, and a pop-out that slides out over neighbouring space
+ * still counts against the region whose control opened it.
+ *
+ * Nesting is unaffected either way. A pop-out opened from another pop-out is
+ * grouped by its parent, as it always was, and inherits this region only for
+ * the benefit of anything it opens in turn.
+ * @param props - Component props
+ * @param props.id - What to call this region
+ * @param props.children - The part of the tree whose pop-outs belong to it
+ * @returns The provider the pop-outs inside it read their region from
+ * @example
+ * ```tsx
+ * <PopoutManager>
+ *     <PopoutRegion id="panel">{panel}</PopoutRegion>
+ *     <PopoutRegion id="inspector">{inspector}</PopoutRegion>
+ * </PopoutManager>
+ * ```
+ */
+export declare function PopoutRegion({ id, children }: PopoutRegionProps): JSX.Element;
+
+/**
+ * Props for the PopoutRegion component.
+ */
+export declare interface PopoutRegionProps {
+    /**
+     * What to call this region. Any stable string; two regions are the same
+     * region when their ids are equal.
+     */
+    id: string;
+    /** The part of the tree whose pop-outs belong to this region. */
+    children: ReactNode;
+}
+
 /**
  * A floating panel that opens from a trigger and can be dragged, nested and
  * dismissed without leaving the page.
@@ -5207,7 +5293,7 @@ export declare function UiGlyph({ name, size }: UiGlyphProps): default_2.JSX.Ele
  * Shared UI glyphs: the chevrons, the doors and the status marks the row types
  * draw outside a field's slot.
  */
-export declare type UiGlyphName = "chevronDown" | "chevronRight" | "chevronLeft" | "close" | "plus" | "minus" | "gear" | "warning" | "check" | "eye" | "refresh" | "copy" | "pin" | "info" | "reset";
+export declare type UiGlyphName = "chevronDown" | "chevronRight" | "chevronLeft" | "close" | "plus" | "minus" | "gear" | "warning" | "check" | "eye" | "refresh" | "copy" | "pin" | "keepOpen" | "info" | "reset";
 
 /**
  * Props for the UiGlyph component.
@@ -5342,6 +5428,12 @@ export declare function useOrdinalFormatter(): (value: number) => string;
  */
 export declare function usePanelLabels(): boolean;
 
+/**
+ * The region the calling component sits in.
+ * @returns The region's id, or null when there is no enclosing region.
+ */
+export declare function usePopoutRegion(): string | null;
+
 /** The released version of this package. */
 export declare const VERSION = "0.6.0";