tgui-core 5.5.2 → 5.5.9

package/dist/components/Interactive.js

@@ -1 +0,0 @@
-import{jsx as e}from"react/jsx-runtime";import{clamp as t}from"../common/math.js";import{KEY as n,isArrow as r}from"../common/keys.js";function o(e){return e?.ownerDocument?.defaultView||self}function i(e,n){let r=e.getBoundingClientRect();return{left:t((n.pageX-(r.left+o(e).pageXOffset))/r.width,0,1),top:t((n.pageY-(r.top+o(e).pageYOffset))/r.height,0,1)}}function f(t){let{onMove:o,onKey:f,children:u,containerRef:a,style:c,...p}=t;return e("div",{...p,className:"react-colorful__interactive",onKeyDown:function(e){let t=e.key;r(t)&&(e.preventDefault(),f({left:t===n.Right?.05:t===n.Left?-.05:0,top:t===n.Down?.05:t===n.Up?-.05:0}))},onPointerDown:function(e){let t=a.current;t&&(e.preventDefault(),t.focus(),t.setPointerCapture(e.pointerId),o(i(t,e.nativeEvent)))},onPointerMove:function(e){e.preventDefault(),a.current?.hasPointerCapture(e.pointerId)&&o(i(a.current,e.nativeEvent))},onPointerUp:function(e){a.current?.releasePointerCapture(e.pointerId)},ref:a,role:"slider",style:c,tabIndex:0,children:u})}export{f as Interactive};

package/dist/components/KeyListener.d.ts

@@ -1,16 +0,0 @@
-import type { KeyEvent } from '../common/events.ts';
-type Props = Partial<{
-    onKey: (key: KeyEvent) => void;
-    onKeyDown: (key: KeyEvent) => void;
-    onKeyUp: (key: KeyEvent) => void;
-}>;
-/**
- * ## KeyListener
- *
- * A component that listens for keyboard events and calls the provided
- * callbacks.
- *
- * - [View documentation on tgui core](https://tgstation.github.io/tgui-core/?path=/docs/components-keylistener--docs)
- */
-export declare function KeyListener(props: Props): null;
-export {};

package/dist/components/KeyListener.js

@@ -1 +0,0 @@
-import{listenForKeyEvents as o}from"../common/hotkeys.js";import{useEffect as n}from"react";function e(e){return n(()=>{let n=o(o=>{e.onKey&&e.onKey(o),o.isDown()&&e.onKeyDown&&e.onKeyDown(o),o.isUp()&&e.onKeyUp&&e.onKeyUp(o)});return()=>{n()}},[]),null}export{e as KeyListener};

package/dist/components/Knob.d.ts

@@ -1,65 +0,0 @@
-import { type BooleanLike } from '../common/react.ts';
-import type { Placement } from '@floating-ui/react';
-import type { BoxProps } from './Box';
-type Props = {
-    /** Value itself, controls the position of the cursor. */
-    value: number;
-} & Partial<{
-    /** Animates the value if it was changed externally. */
-    animated: boolean;
-    /** Knob can be bipolar or unipolar. */
-    bipolar: boolean;
-    /** Color of the outer ring around the knob. */
-    color: string | BooleanLike;
-    /** onChange also fires every 500ms while dragging the input. */
-    tickWhileDragging: boolean;
-    /**
-     * If set, this value will be used to set the fill percentage of the outer
-     * ring independently of the main value.
-     */
-    fillValue: number;
-    /** Format value using this function before displaying it. */
-    format: (value: number) => string;
-    /** Highest possible value. */
-    maxValue: number;
-    /** Lowest possible value. */
-    minValue: number;
-    /**
-     * An event which fires when release the knob or enter a number. This is the
-     * default value event for controls.
-     */
-    onChange: (event: Event, value: number) => void;
-    /**
-     * Applies a `color` to the outer ring around the knob based on whether the
-     * value lands in the range between `from` and `to`.
-     */
-    ranges: Record<string, [number, number]>;
-    /**
-     * Relative size of the knob. `1` is normal size, `2` is two times bigger.
-     * Fractional numbers are supported.
-     */
-    size: number;
-    /** Adjust value by this amount when dragging the input. */
-    step: number;
-    /** Screen distance mouse needs to travel to adjust value by one `step`. */
-    stepPixelSize: number;
-    /** Whether to clamp the value to the range. */
-    unclamped: boolean;
-    /** Unit to display to the right of value. */
-    unit: string;
-    /** Value popup placement, like on tooltips. */
-    popupPosition: Placement;
-}> & BoxProps;
-/**
- * ## Knob
- *
- * A radial control which allows dialing in precise values by dragging it
- * up and down.
- *
- * Single click opens an input box to manually type in a number.
- *
- * - [View documentation on tgui core](https://tgstation.github.io/tgui-core/?path=/docs/components-knob--docs)
- * - [View inherited Box props](https://tgstation.github.io/tgui-core/?path=/docs/components-box--docs)
- */
-export declare function Knob(props: Props): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/Knob.js

@@ -1 +0,0 @@
-import{jsx as o,jsxs as r}from"react/jsx-runtime";import{keyOfMatchingRange as e,scale as n}from"../common/math.js";import{classes as t}from"../common/react.js";import{computeBoxClassName as i,computeBoxProps as l}from"../common/ui.js";import{DraggableControl as c}from"./DraggableControl.js";import{Floating as a}from"./Floating.js";function s(s){let{animated:m,tickWhileDragging:_,format:d,maxValue:b,minValue:h,onChange:p,step:K,stepPixelSize:f,unclamped:g,unit:u,value:v,bipolar:x,popupPosition:N,className:j,color:y,fillValue:M,ranges:k={},size:P=1,style:w,...B}=s;return o(c,{dragMatrix:[0,-1],animated:m,tickWhileDragging:_,format:d,maxValue:b,minValue:h,onChange:p,step:K,stepPixelSize:f,unclamped:g,unit:u,value:v,children:c=>{let{displayElement:s,displayValue:m,dragging:_,handleDragStart:d,inputElement:p}=c,K=n(M??m,h,b),f=n(m,h,b),g=y||e(M??v,k)||"default",u=Math.min((f-.5)*270,225);return o(a,{content:s,contentClasses:"Knob__popupValue",handleOpen:_,placement:N||"top",preventPortal:!0,children:r("div",{className:t(["Knob",`Knob--color--${g}`,x&&"Knob--bipolar",j,i(B)]),...l({style:{fontSize:`${P}em`,...w},...B}),onMouseDown:d,children:[o("div",{className:"Knob__circle",children:o("div",{className:"Knob__cursorBox",style:{transform:`rotate(${u}deg)`},children:o("div",{className:"Knob__cursor"})})}),r("svg",{className:"Knob__ring Knob__ringTrackPivot",viewBox:"0 0 100 100",children:[o("circle",{className:"Knob__ringTrack",cx:"50",cy:"50",r:"50"}),o("title",{children:"track"})]}),r("svg",{className:"Knob__ring Knob__ringFillPivot",viewBox:"0 0 100 100",children:[o("title",{children:"fill"}),o("circle",{className:"Knob__ringFill",cx:"50",cy:"50",r:"50",style:{strokeDashoffset:Math.max(((x?2.75:2)-1.5*K)*Math.PI*50,0)}})]}),p]})})}})}export{s as Knob};

package/dist/components/LabeledControls.d.ts

@@ -1,31 +0,0 @@
-import { type FlexProps } from './Flex';
-/**
- * ## LabeledControls
- *
- * LabeledControls is a horizontal grid that is designed to hold various
- * controls, like [Knobs](https://github.com/tgstation/tgui-core/tree/main/lib/components/Knob.tsx)
- * or small [Buttons](https://github.com/tgstation/tgui-core/tree/main/lib/components/Button.tsx).
- *
- * Every item in this grid is labeled at the bottom.
- *
- * Example:
- *
- * ```tsx
- * <LabeledControls>
- *   <LabeledControls.Item label="Temperature"><Knob /></LabeledControls.Item>
- *   <LabeledControls.Item label="Submit"><Button /></LabeledControls.Item>
- * </LabeledControls>
- * ```
- *
- * - [View documentation on tgui core](https://tgstation.github.io/tgui-core/?path=/docs/components-labeledcontrols--docs)
- * - [View inherited Box props](https://tgstation.github.io/tgui-core/?path=/docs/components-box--docs)
- */
-export declare function LabeledControls(props: FlexProps): import("react/jsx-runtime").JSX.Element;
-export declare namespace LabeledControls {
-    var Item: typeof LabeledControlsItem;
-}
-type ItemProps = {
-    label: string;
-} & FlexProps;
-declare function LabeledControlsItem(props: ItemProps): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/LabeledControls.js

@@ -1 +0,0 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{Flex as r}from"./Flex.js";function n(t){let{children:n,wrap:i,...l}=t;return e(r,{align:"stretch",justify:"space-between",mx:-.5,wrap:i,...l,children:n})}n.Item=function(n){let{label:i,children:l,mx:c=1,...m}=n;return e(r.Item,{mx:c,children:t(r,{align:"center",direction:"column",height:"100%",justify:"space-between",textAlign:"center",...m,children:[e(r.Item,{}),e(r.Item,{children:l}),e(r.Item,{color:"label",children:i})]})})};export{n as LabeledControls};

package/dist/components/LabeledList.d.ts

@@ -1,95 +0,0 @@
-import { type BooleanLike } from '../common/react.ts';
-import type { Placement } from '@floating-ui/react';
-import type { PropsWithChildren, ReactNode } from 'react';
-export declare function LabeledList(props: PropsWithChildren): import("react/jsx-runtime").JSX.Element;
-type LabeledListItemProps = Partial<{
-    /** Buttons to render aside the content. */
-    buttons: ReactNode;
-    /** Content of this labeled item. */
-    children: ReactNode;
-    /** Applies a CSS class to the element. */
-    className: string | BooleanLike;
-    /** Sets the color of the content text. */
-    color: string;
-    /** @deprecated */
-    content: any;
-    /**
-     * Sometimes this does not properly register in TS.
-     * See [react key docs](https://react.dev/learn/rendering-lists#keeping-list-items-in-order-with-key) for more info.
-     */
-    key: string | number;
-    /** Item label. Appends a colon at the end. */
-    label: ReactNode;
-    /** Sets the color of the label. */
-    labelColor: string;
-    /** Lets the label wrap and makes it not take the minimum width. */
-    labelWrap: boolean;
-    /**
-     * Align the content text.
-     *
-     * - `left` (default)
-     * - `center`
-     * - `right`
-     */
-    textAlign: string;
-    /** Tooltip text. */
-    tooltip: string;
-    /** Tooltip position. See Tooltip for valid values. */
-    tooltipPosition: Placement;
-    /**
-     * Align both the label and the content vertically.
-     *
-     * - `baseline` (default)
-     * - `top`
-     * - `middle`
-     * - `bottom`
-     */
-    verticalAlign: string;
-    /** Preserves line-breaks and spacing in Labeled.Item text. */
-    preserveWhitespace: boolean;
-}>;
-declare function LabeledListItem(props: LabeledListItemProps): import("react/jsx-runtime").JSX.Element;
-type LabeledListDividerProps = {
-    /** Size of the divider. */
-    size?: number;
-};
-declare function LabeledListDivider(props: LabeledListDividerProps): import("react/jsx-runtime").JSX.Element;
-/**
- * ## LabeledList
- *
- * LabeledList is a continuous, vertical list of text and other content, where
- * every item is labeled.
- *
- * It works just like a two column table, where first column is labels, and
- * second column is content.
- *
- * Example:
- *
- * ```tsx
- * <LabeledList>
- *   <LabeledList.Item label="Item">Content</LabeledList.Item>
- * </LabeledList>
- * ```
- *
- * If you want to have a button on the right side of an item (for example,
- * to perform some sort of action), there is a way to do that:
- *
- * Example:
- *
- * ```tsx
- * <LabeledList>
- *   <LabeledList.Item label="Item" buttons={<Button>Click me!</Button>}>
- *     Content
- *   </LabeledList.Item>
- * </LabeledList>
- * ```
- *
- * - [View documentation on tgui core](https://tgstation.github.io/tgui-core/?path=/docs/components-labeledlist--docs)
- * - [View inherited Box props](https://tgstation.github.io/tgui-core/?path=/docs/components-box--docs)
- */
-export declare namespace LabeledList {
-    /** Adds some empty space between LabeledList items. */
-    const Divider: typeof LabeledListDivider;
-    const Item: typeof LabeledListItem;
-}
-export {};

package/dist/components/LabeledList.js

@@ -1 +0,0 @@
-var e;import{jsx as t,jsxs as l}from"react/jsx-runtime";import{classes as i}from"../common/react.js";import{unit as r}from"../common/ui.js";import{Box as o}from"./Box.js";import{Divider as a}from"./Divider.js";import{Tooltip as s}from"./Tooltip.js";function d(e){let{children:l}=e;return t("table",{className:"LabeledList",children:t("tbody",{children:l})})}(e=d||(d={})).Divider=function(e){let l=e.size?r(Math.max(0,e.size-1)):0;return t("tr",{className:"LabeledList__row",children:t("td",{colSpan:3,style:{paddingBottom:l,paddingTop:l},children:t(a,{})})})},e.Item=function(e){let r,{className:a,label:d,labelColor:n="label",labelWrap:c,color:m,textAlign:L,buttons:p,content:b,children:_,verticalAlign:h="baseline",preserveWhitespace:f,tooltip:u,tooltipPosition:v}=e;d&&(r=d,"string"==typeof d&&(r+=":")),void 0!==u&&(r=t(s,{content:u,position:v,children:t(o,{as:"span",style:{borderBottom:"2px dotted rgba(255, 255, 255, 0.8)"},children:r})}));let g=t(o,{as:"td",className:i(["LabeledList__cell",!c&&"LabeledList__label--nowrap"]),color:n,preserveWhitespace:f,verticalAlign:h,children:r});return l("tr",{className:i(["LabeledList__row",a]),children:[g,l(o,{as:"td",className:"LabeledList__cell",color:m,colSpan:p?void 0:2,textAlign:L,verticalAlign:h,children:[b,_]}),p&&t("td",{className:"LabeledList__cell LabeledList__buttons",children:p})]})};export{d as LabeledList};

package/dist/components/MenuBar.d.ts

@@ -1,42 +0,0 @@
-import { type BooleanLike } from '../common/react.ts';
-import { type PropsWithChildren, type ReactNode } from 'react';
-type MenuBarItemProps = {
-    children: ReactNode;
-    className?: string;
-    disabled?: boolean;
-    display: ReactNode;
-    entry: string;
-    openMenuBar: string | null;
-    openOnHover: boolean;
-    openWidth: string;
-    setOpenMenuBar: (entry: string | null) => void;
-    setOpenOnHover: (flag: boolean) => void;
-};
-declare function MenuDropdown(props: MenuBarItemProps): import("react/jsx-runtime").JSX.Element;
-declare namespace MenuDropdown {
-    var MenuItem: (props: MenuItemProps) => import("react/jsx-runtime").JSX.Element;
-    var MenuItemToggle: (props: MenuItemToggleProps) => import("react/jsx-runtime").JSX.Element;
-    var Submenu: typeof MenuItemSubmenu;
-    var Separator: () => import("react/jsx-runtime").JSX.Element;
-}
-type MenuItemProps = Partial<{
-    value: any;
-    displayText: ReactNode;
-    disabled: BooleanLike;
-    onClick: (value: any) => void;
-}>;
-type MenuItemToggleProps = MenuItemProps & Partial<{
-    checked: BooleanLike;
-}>;
-type MenuItemSubmenuProps = PropsWithChildren<Omit<MenuItemProps, 'value' | 'onClick'> & Partial<{
-    openWidth: string;
-}>>;
-declare function MenuItemSubmenu(props: MenuItemSubmenuProps): import("react/jsx-runtime").JSX.Element;
-type MenuBarProps = {
-    children: ReactNode;
-};
-export declare function MenuBar(props: MenuBarProps): import("react/jsx-runtime").JSX.Element;
-export declare namespace MenuBar {
-    var Dropdown: typeof MenuDropdown;
-}
-export {};

package/dist/components/MenuBar.js

@@ -1 +0,0 @@
-import{jsx as e,jsxs as n}from"react/jsx-runtime";import{classes as r}from"../common/react.js";import{useRef as a,useState as t}from"react";import{Box as u}from"./Box.js";import{Floating as o}from"./Floating.js";import{Icon as l}from"./Icon.js";function i(n){let{children:t,className:l,disabled:i,display:_,onClick:c,onMouseOver:s,open:m,openWidth:M,onOutsideClick:d,...B}=n,h=a(null);return e(o,{placement:"bottom-start",allowedOutsideClasses:".Menubar_inner",content:e("div",{className:"MenuBar__menu",style:{width:M},children:t}),children:e("div",{className:"Menubar_inner",ref:h,children:e(u,{className:r(["MenuBar__MenuBarButton",i&&"MenuBar__disabled","MenuBar__font","MenuBar__hover",l]),...B,onClick:i?()=>null:c,onMouseOver:s,children:e("span",{className:"MenuBar__MenuBarButton-text",children:_})})})})}function _(n){let{entry:r,children:a,openWidth:t,display:u,setOpenMenuBar:o,openMenuBar:l,setOpenOnHover:_,openOnHover:c,disabled:s,className:m}=n;return e(i,{className:m,disabled:s,display:u,onClick:()=>{o(l===r?null:r),_(!c)},onMouseOver:()=>{c&&o(r)},onOutsideClick:()=>{o(null),_(!1)},open:l===r,openWidth:t,children:a})}function c(n){let{children:r}=n;return e(u,{className:"MenuBar",children:r})}c.Dropdown=_,_.MenuItem=function(n){let{value:a,disabled:t,displayText:o,onClick:l}=n;return e(u,{className:r(["MenuBar__font",t&&"MenuBar__disabled","MenuBar__MenuItem","MenuBar__hover"]),onClick:()=>l?.(a),children:o})},_.MenuItemToggle=function(a){let{value:t,disabled:o,displayText:i,onClick:_,checked:c}=a;return n(u,{className:r(["MenuBar__font",o&&"MenuBar__disabled","MenuBar__MenuItem","MenuBar__MenuItemToggle","MenuBar__hover"]),onClick:()=>_?.(t),children:[e("div",{className:"MenuBar__MenuItemToggle__check",children:e(l,{name:c?"check":"",size:1.3})}),i]})},_.Submenu=function(a){let{displayText:i,disabled:_,openWidth:c,children:s}=a,[m,M]=t(!1);return e(o,{hoverOpen:!0,hoverDelay:250,hoverSafePolygon:!0,contentOffset:0,disabled:_,placement:"right-start",onOpenChange:M,content:e("div",{className:"MenuBar__menu",style:{width:c},children:s}),children:n(u,{className:r(["MenuBar__font",_&&"MenuBar__disabled","MenuBar__MenuItem","MenuBar__MenuItemSubmenu",m&&"MenuBar__MenuItemSubmenu__Open","MenuBar__hover"]),children:[i,e(l,{name:"chevron-right"})]})})},_.Separator=function(){return e("div",{className:"MenuBar__Separator"})};export{c as MenuBar};

package/dist/components/Modal.d.ts

@@ -1,21 +0,0 @@
-import type { BoxProps } from './Box';
-export type ModalProps = Partial<{
-    /** Fires once the enter key is pressed */
-    onEnter: (e: React.KeyboardEvent<HTMLInputElement>) => void;
-    /** Fires once the escape key is pressed */
-    onEscape: (e: React.KeyboardEvent<HTMLInputElement>) => void;
-}> & BoxProps;
-/**
- * ## Modal
- *
- * A modal window. Uses a
- * [Dimmer](https://tgstation.github.io/tgui-core/?path=/docs/components-dimmer--docs)
- * under the hood, and dynamically adjusts its own size to fit the content
- * you're trying to display.
- *
- * Must be a direct child of a layout component (e.g. `Window`).
- *
- * - [View documentation on tgui core](https://tgstation.github.io/tgui-core/?path=/docs/components-modal--docs)
- * - [View inherited Box props](https://tgstation.github.io/tgui-core/?path=/docs/components-box--docs)
- */
-export declare function Modal(props: ModalProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Modal.js

@@ -1 +0,0 @@
-import{jsx as o}from"react/jsx-runtime";import{KEY as m,isEscape as r}from"../common/keys.js";import{classes as e}from"../common/react.js";import{computeBoxClassName as i,computeBoxProps as n}from"../common/ui.js";import{Dimmer as t}from"./Dimmer.js";function c(c){let{className:s,children:a,onEnter:l,onEscape:d,...f}=c;return o(t,{className:"Modal__dimmer",onKeyDown:function(o){o.key===m.Enter&&l?.(o),r(o.key)&&d?.(o)},children:o("div",{className:e(["Modal",s,i(f)]),...n(f),children:a})})}export{c as Modal};

package/dist/components/NoticeBox.d.ts

@@ -1,27 +0,0 @@
-import { type BoxProps } from './Box';
-type Props = ExclusiveProps & BoxProps;
-/** You MUST use only one or none */
-type NoticeType = 'info' | 'success' | 'danger';
-type None = {
-    [K in NoticeType]?: undefined;
-};
-type ExclusiveProps = None | (Omit<None, 'info'> & {
-    /** Blue notice */
-    info: boolean;
-}) | (Omit<None, 'success'> & {
-    /** Green notice */
-    success: boolean;
-}) | (Omit<None, 'danger'> & {
-    /** Red notice */
-    danger: boolean;
-});
-/**
- * ## NoticeBox
- *
- * A notice box which warns you about something very important.
- *
- * - [View documentation on tgui core](https://tgstation.github.io/tgui-core/?path=/docs/components-noticebox--docs)
- * - [View inherited Box props](https://tgstation.github.io/tgui-core/?path=/docs/components-box--docs)
- */
-export declare function NoticeBox(props: Props): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/NoticeBox.js

@@ -1 +0,0 @@
-import{jsx as o}from"react/jsx-runtime";import{classes as t}from"../common/react.js";import{Box as e}from"./Box.js";function c(c){let{className:r,color:i,info:m,success:x,danger:s,...n}=c;return o(e,{className:t(["NoticeBox",i&&`NoticeBox--color--${i}`,m&&"NoticeBox--type--info",x&&"NoticeBox--type--success",s&&"NoticeBox--type--danger",r]),...n})}export{c as NoticeBox};

package/dist/components/NumberInput.d.ts

@@ -1,60 +0,0 @@
-import { type BooleanLike } from '../common/react.ts';
-import { Component, type FocusEventHandler, type KeyboardEventHandler } from 'react';
-import { type BoxProps } from './Box';
-type Props = Required<{
-    /** Highest possible value. */
-    maxValue: number;
-    /** Lowest possible value. */
-    minValue: number;
-    /** Adjust value by this amount when dragging the input. */
-    step: number;
-    /** Value itself. */
-    value: number | string;
-}> & Partial<{
-    /** Animates the value if it was changed externally. */
-    animated: boolean;
-    /** Makes the input field uneditable & non draggable to prevent user changes */
-    disabled: boolean;
-    /** onChange also fires about every 500ms when you drag the input up and down. */
-    tickWhileDragging: boolean;
-    /** Format value using this function before displaying it. */
-    format: (value: number) => string;
-    /** Adjusts the width to 100% of its parent container */
-    fluid: boolean;
-    /** An event which fires when you release the input or successfully enter a number. */
-    onChange: (value: number) => void;
-    /** Screen distance mouse needs to travel to adjust value by one `step`. */
-    stepPixelSize: number;
-    /** Unit to display to the right of value. */
-    unit: string;
-}> & BoxProps;
-type State = {
-    currentValue: number;
-    dragging: BooleanLike;
-    editing: BooleanLike;
-    origin: number;
-    previousValue: number;
-};
-/**
- * ## NumberInput
- *
- * A fancy, interactive number input, which you can either drag up and down
- * to fine tune the value, or single click it to manually type a number.
- *
- * - [View documentation on tgui core](https://tgstation.github.io/tgui-core/?path=/docs/components-numberinput--docs)
- * - [View inherited Box props](https://tgstation.github.io/tgui-core/?path=/docs/components-box--docs)
- */
-export declare class NumberInput extends Component<Props, State> {
-    inputRef: import("react").RefObject<HTMLInputElement | null>;
-    dragTimeout: NodeJS.Timeout;
-    dragInterval: NodeJS.Timeout;
-    state: State;
-    componentDidMount(): void;
-    handleDragStart: React.MouseEventHandler<HTMLDivElement>;
-    handleDragMove: (event: MouseEvent) => void;
-    handleDragEnd: (_event: MouseEvent) => void;
-    handleBlur: FocusEventHandler<HTMLInputElement>;
-    handleKeyDown: KeyboardEventHandler<HTMLInputElement>;
-    render(): import("react/jsx-runtime").JSX.Element;
-}
-export {};

package/dist/components/NumberInput.js

@@ -1 +0,0 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{KEY as r,isEscape as i}from"../common/keys.js";import{clamp as s,round as n}from"../common/math.js";import{classes as a}from"../common/react.js";import{Component as o,createRef as u}from"react";import{AnimatedNumber as l}from"./AnimatedNumber.js";import{Box as m}from"./Box.js";class h extends o{inputRef=u();dragTimeout;dragInterval;state={currentValue:0,dragging:!1,editing:!1,origin:0,previousValue:0};componentDidMount(){let e=Number.parseFloat(this.props.value.toString());this.setState({currentValue:e,previousValue:e})}handleDragStart=e=>{let{value:t,disabled:r}=this.props,{editing:i}=this.state;if(r||i)return;document.body.style["pointer-events"]="none";let s=Number.parseFloat(t.toString());this.setState({currentValue:s,dragging:!1,origin:e.screenY,previousValue:s}),this.dragTimeout=setTimeout(()=>{this.setState({dragging:!0})},250),this.dragInterval=setInterval(()=>{let{dragging:e,currentValue:t,previousValue:r}=this.state,{onChange:i,tickWhileDragging:s}=this.props;e&&s&&t!==r&&(this.setState({previousValue:t}),i?.(t))},400),document.addEventListener("mousemove",this.handleDragMove),document.addEventListener("mouseup",this.handleDragEnd)};handleDragMove=e=>{let{minValue:t,maxValue:r,step:i,stepPixelSize:a,disabled:o}=this.props;o||this.setState(o=>{let u={...o},l=u.origin-e.screenY;if(o.dragging){let o=a||1,m=s(u.currentValue+l*i/o,t-i,r+i);Math.abs(m-u.currentValue)>=i?(u.currentValue=s(n(m/i,0)*i,t,r),u.origin=e.screenY):Math.abs(l)>o&&(u.origin=e.screenY)}else Math.abs(l)>4&&(u.dragging=!0);return u})};handleDragEnd=e=>{let{dragging:t,currentValue:r}=this.state,{onChange:i,disabled:s}=this.props;if(!s){if(document.body.style["pointer-events"]="auto",clearInterval(this.dragInterval),clearTimeout(this.dragTimeout),this.setState({dragging:!1,editing:!t,previousValue:r}),t)i?.(r);else if(this.inputRef){let e=this.inputRef.current;e&&(e.value=`${r}`,setTimeout(()=>{e.focus(),e.select()},10))}document.removeEventListener("mousemove",this.handleDragMove),document.removeEventListener("mouseup",this.handleDragEnd)}};handleBlur=e=>{let{editing:t,previousValue:r}=this.state,{minValue:i,maxValue:n,onChange:a,disabled:o}=this.props;if(o||!t)return;let u=s(Number.parseFloat(e.target.value),i,n);Number.isNaN(u)?this.setState({editing:!1}):(this.setState({currentValue:u,editing:!1,previousValue:u}),r!==u&&a?.(u))};handleKeyDown=e=>{let{minValue:t,maxValue:n,onChange:a,disabled:o}=this.props;if(o)return;let{previousValue:u}=this.state;if(e.key===r.Enter){let r=s(Number.parseFloat(e.currentTarget.value),t,n);if(Number.isNaN(r))return void this.setState({editing:!1});this.setState({currentValue:r,editing:!1,previousValue:r}),u!==r&&a?.(r)}else i(e.key)&&this.setState({editing:!1})};render(){let{dragging:r,editing:i,currentValue:n}=this.state,{className:o,fluid:u,animated:h,unit:d,value:p,minValue:g,maxValue:c,height:v,width:f,lineHeight:N,fontSize:b,format:S}=this.props,V=Number.parseFloat(p.toString());r&&(V=n);let y=t("div",{className:"NumberInput__content",children:[h&&!r?e(l,{format:S,value:V}):S?S(V):V,d?` ${d}`:""]});return t(m,{className:a(["NumberInput",u&&"NumberInput--fluid",o]),fontSize:b,lineHeight:N,minHeight:v,minWidth:f,onMouseDown:this.handleDragStart,children:[e("div",{className:"NumberInput__barContainer",children:e("div",{className:"NumberInput__bar",style:{height:`${s((V-g)/(c-g)*100,0,100)}%`}})}),y,e("input",{className:"NumberInput__input",onBlur:this.handleBlur,onKeyDown:this.handleKeyDown,ref:this.inputRef,style:{display:i?"inline":"none",fontSize:b,height:v,lineHeight:N}})]})}}export{h as NumberInput};

package/dist/components/Pointer.d.ts

@@ -1,20 +0,0 @@
-/**
- * MIT License
- * https://github.com/omgovich/react-colorful/
- *
- * Copyright (c) 2020 Vlad Shilov <omgovich@ya.ru>
- * 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.
- */
-export type PointerProps = {
-    className?: string;
-    top?: number;
-    left: number;
-    color: string;
-};
-export declare function Pointer(props: PointerProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Pointer.js

@@ -1 +0,0 @@
-import{jsx as r}from"react/jsx-runtime";import{classes as o}from"../common/react.js";function t(t){let{className:e,color:l,left:c,top:i=.5}=t;return r("div",{className:o(["react-colorful__pointer",e]),style:{top:`${100*i}%`,left:`${100*c}%`},children:r("div",{className:"react-colorful__pointer-fill",style:{backgroundColor:l}})})}export{t as Pointer};

package/dist/components/Popper.d.ts

@@ -1,33 +0,0 @@
-import type { Placement } from '@floating-ui/react';
-import type { PropsWithChildren, ReactNode } from 'react';
-type Props = {
-    /** The content to display in the popper */
-    content: ReactNode;
-    /** Whether the popper is open */
-    isOpen: boolean;
-} & Partial<{
-    /**
-     * Base z-index of the popper div
-     * @default 5
-     */
-    baseZIndex: number;
-    /** Called when the user clicks outside the popper */
-    onClickOutside: () => void;
-    /** Where to place the popper relative to the reference element */
-    placement: Placement;
-}> & PropsWithChildren;
-/**
- * ## Popper
- *
- * Popper lets you position elements so that they don't go out of the bounds of the window.
- *
- * @deprecated - Use
- * [Floating](https://github.com/tgstation/tgui-core/tree/main/lib/components/Floating.tsx)
- * instead.
- *
- * This will serve as a wrapper for floating ui until replaced.
- *
- * - [View documentation on tgui core](https://tgstation.github.io/tgui-core/?path=/docs/components-popper--docs)
- */
-export declare function Popper(props: Props): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/Popper.js

@@ -1 +0,0 @@
-import{Fragment as e,jsx as r,jsxs as n}from"react/jsx-runtime";import{autoUpdate as t,flip as i,offset as o,shift as l,useDismiss as d,useFloating as c,useInteractions as f}from"@floating-ui/react";function m(m){let{baseZIndex:p=5,children:a,content:h,isOpen:s,onClickOutside:u,placement:g}=m,{refs:x,floatingStyles:v,context:w}=c({middleware:[o(5),i(),l()],onOpenChange:u,open:s,placement:g,whileElementsMounted:t}),{getReferenceProps:j,getFloatingProps:y}=f([d(w)]);return n(e,{children:[r("div",{ref:x.setReference,...j(),children:a}),s&&r("div",{ref:x.setFloating,style:{...v,zIndex:p},...y(),children:h})]})}export{m as Popper};

package/dist/components/ProgressBar.d.ts

@@ -1,57 +0,0 @@
-import type { PropsWithChildren } from 'react';
-import type { BoxProps } from './Box';
-type Props = {
-    /**
-     * Current progress as a floating point number between `minValue` (default: 0) and `maxValue` (default: 1).
-     * Determines the percentage and how filled the bar is.
-     */
-    value: number;
-} & Partial<{
-    /**
-     * Color of the progress bar. Can take any of the following formats:
-     * - `#ffffff` - Hex format
-     * - `rgb(r,g,b) / rgba(r,g,b,a)` - RGB format
-     * - `<name>` - the name of a `color-<name>` CSS class. See `CSS_COLORS` in `constants.js`.
-     * - `<name>` - the name of a base CSS color, if not overridden by the definitions above.
-     */
-    color: string;
-    /** Highest possible value. */
-    maxValue: number;
-    /** Lowest possible value. */
-    minValue: number;
-    /**
-     * Applies a `color` to the progress bar based on whether the value lands in the range between `from` and `to`.
-     * This takes an object with the following format:
-     * ```tsx
-     * {
-     *   (colorname): [from, to]
-     * }
-     * ```
-     * For example:
-     * ```tsx
-     * <ProgressBar
-     *   value={0.5}
-     *   ranges={{
-     *     bad: [0, 0.5],
-     *     good: [0.5, 1],
-     *   }}
-     * />
-     * ```
-     *
-     */
-    ranges: Readonly<Record<string, Readonly<[number, number]>>>;
-    /** Removes progress percentage text, makes no sense if children are present */
-    empty: boolean;
-    /** The number of digits to appear after the percent's decimal point. */
-    fractionDigits: number;
-}> & BoxProps & PropsWithChildren;
-/**
- * ## ProgressBar
- *
- * Progress indicators inform users about the status of ongoing processes.
- *
- * - [View documentation on tgui core](https://tgstation.github.io/tgui-core/?path=/docs/components-progressbar--docs)
- * - [View inherited Box props](https://tgstation.github.io/tgui-core/?path=/docs/components-box--docs)
- */
-export declare function ProgressBar(props: Props): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/ProgressBar.js

@@ -1 +0,0 @@
-import{jsx as r,jsxs as o}from"react/jsx-runtime";import{CSS_COLORS as s}from"../common/constants.js";import{clamp01 as e,keyOfMatchingRange as t,scale as m}from"../common/math.js";import{classes as a}from"../common/react.js";import{computeBoxClassName as i,computeBoxProps as l}from"../common/ui.js";function c(c){let{className:n,value:d,minValue:f=0,maxValue:u=1,color:g,ranges:p={},empty:B,children:P,fractionDigits:_=0,...h}=c,j=m(d,f,u),v=void 0!==P,x=g||t(d,p)||"default",y=l(h),N=["ProgressBar",n,i(h)],$={width:`${100*e(j)}%`};return s.includes(x)||"default"===x?N.push(`ProgressBar--color--${x}`):(y.style={...y.style,borderColor:x},$.backgroundColor=x),o("div",{className:a(N),...y,children:[r("div",{className:"ProgressBar__fill ProgressBar__fill--animated",style:$}),r("div",{className:"ProgressBar__content",children:v?P:!B&&`${(100*j).toFixed(_)}%`})]})}export{c as ProgressBar};

package/dist/components/RestrictedInput.d.ts

@@ -1,72 +0,0 @@
-import type { BaseInputProps } from './Input';
-type Props = Partial<{
-    /** Restricted inputs round by default.  */
-    allowFloats: boolean;
-    /** Max value. 10,000 by default. */
-    maxValue: number;
-    /** Min value. 0 by default. */
-    minValue: number;
-    /** Fires each time focus leaves the input, including if Esc or Enter are pressed */
-    onBlur: (value: number) => void;
-    /** Fires each time the input has been changed */
-    onChange: (value: number) => void;
-    /** Fires once the enter key is pressed */
-    onEnter: (value: number) => void;
-    /** Fires once the escape key is pressed */
-    onEscape: (value: number) => void;
-    /** Fires on input validation change */
-    onValidationChange: (isValid: boolean) => void;
-    /**
-     * Generally, input can handle its own state value. You might not NEED this.
-     *
-     * Use this if you want to hold the value in the parent for external
-     * manipulation. For instance:
-     *
-     * Clearing the input
-     *
-     * ```tsx
-     * const [value, setValue] = useState(1);
-     *
-     * return (
-     *  <>
-     *    <Button onClick={() => act('inputVal', {inputVal: value})}>
-     *      Submit
-     *    </Button>
-     *    <RestrictedInput
-     *      value={value}
-     *      onChange={setValue} />
-     *    <Button onClick={() => setValue(1)}>
-     *      Clear
-     *    </Button>
-     *  </>
-     * )
-     * ```
-     *
-     * Updating the value from the backend
-     *
-     * ```tsx
-     * const { data } = useBackend<Data>();
-     * const { valveSetting } = data;
-     *
-     * return (
-     *  <RestrictedInput
-     *    value={valveSetting}
-     *    onEnter={(value) => act('submit', { valveSetting: value })}
-     *  />
-     * )
-     * ```
-     */
-    value: number;
-}> & BaseInputProps;
-/**
- * ## RestrictedInput
- *
- * Creates a numerical input which rejects improper keys.
- *
- * Has a special event for changes in validation states - `onValidationChange`.
- *
- * - [View documentation on tgui core](https://tgstation.github.io/tgui-core/?path=/docs/components-restrictedinput--docs)
- * - [View inherited Box props](https://tgstation.github.io/tgui-core/?path=/docs/components-box--docs)
- */
-export declare function RestrictedInput(props: Props): import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/RestrictedInput.js

@@ -1 +0,0 @@
-import{jsx as e}from"react/jsx-runtime";import{KEY as t,isEscape as r}from"../common/keys.js";import{classes as n}from"../common/react.js";import{debounce as u}from"../common/timer.js";import{computeBoxClassName as o,computeBoxProps as i}from"../common/ui.js";import{useEffect as m,useRef as c,useState as l}from"react";let a=u(e=>e(),250);function f(u){let{allowFloats:f,autoFocus:p,autoSelect:s,className:d,disabled:v,expensive:y,fluid:I,maxValue:b=1e4,minValue:j=0,monospace:k,onBlur:D,onChange:x,onEnter:C,onEscape:R,onKeyDown:g,onValidationChange:h,value:E,...N}=u,T=c(null),[w,B]=l(E??j),[K,M]=l(!0);function q(e){x&&(y?a(()=>x(e)):x(e))}m(()=>{let e;return(p||s)&&(e=setTimeout(()=>{T.current?.focus(),s&&T.current?.select()},1)),()=>clearTimeout(e)},[]),m(()=>{if(T.current){let e=T.current.validity.valid;K!==e&&(M(e),h?.(e))}},[w]),m(()=>{T.current&&document.activeElement!==T.current&&E!==w&&B(E??j)},[E]);let z=i(N),A=n(["Input","RestrictedInput",v&&"Input--disabled",I&&"Input--fluid",k&&"Input--monospace",o(N),d,!K&&"RestrictedInput--invalid"]);return e("input",{...z,autoComplete:"off",className:A,disabled:v,max:b,min:j,onBlur:function(e){D?.(w)},onChange:function(e){let t=Number(e.target.value);B(t),q(t)},onKeyDown:function(e){if(g?.(e),e.key===t.Enter){e.preventDefault(),C?.(w),T.current?.blur();return}if(r(e.key)){e.preventDefault(),R?.(w),T.current?.blur();return}if(e.key===t.Minus){e.preventDefault();let t=-1*w;B(t),q(t);return}},ref:T,spellCheck:!1,step:f?"any":"1",type:"number",value:w})}export{f as RestrictedInput};