@matthiaskrijgsman/mat-ui 0.0.18 → 0.0.19

package/README.md

@@ -212,6 +212,7 @@ Each button variant (`primary`, `white`, `black`, `transparent`, `secondary`, `t
 |-------|-------------|---------------|
 | `--color-panel-bg` | Panel background | `#ffffff` |
 | `--color-panel-border` | Panel border | `#e5e7eb` |
+| `--color-panel-text` | Panel default text color (inherited by `PanelField`) | `#111827` |
 
 #### Modal & Sidebar modal
 
@@ -231,6 +232,7 @@ Each button variant (`primary`, `white`, `black`, `transparent`, `secondary`, `t
 | `--color-table-border` | Table border color | `#e5e7eb` |
 | `--color-table-row-bg` | Row background | `#ffffff` |
 | `--color-table-row-bg-hover` | Row background on hover | `#f9fafb` |
+| `--color-table-row-text` | Row text color | `#111827` |
 | `--color-table-resize-handle` | Column resize handle | `#e5e7eb` |
 | `--color-table-resize-handle-hover` | Resize handle on hover | `#d1d5db` |
 | `--color-table-resize-handle-active` | Resize handle while dragging | `#2563eb` |
@@ -253,3 +255,14 @@ Each button variant (`primary`, `white`, `black`, `transparent`, `secondary`, `t
 | `--color-badge-black-ring` | Black badge ring | `#d6d3d1` |
 
 > Colored badges (red, blue, green, etc.) use Tailwind color utility classes and are not token-based. They adapt to dark mode automatically via Tailwind's `dark:` variants.
+
+#### Status
+
+Shared color tokens for status/notification indicators. Currently used by `PanelLink`'s `status` prop, but available for any component.
+
+| Token | Description | Light default |
+|-------|-------------|---------------|
+| `--color-status-error` | Error / destructive state | `#dc2626` |
+| `--color-status-warning` | Warning state | `#f59e0b` |
+| `--color-status-success` | Success state | `#16a34a` |
+| `--color-status-info` | Informational state | `#2563eb` |

package/dist/components/inputs/InputTextArea.d.ts

@@ -5,5 +5,7 @@ export type InputTextAreaProps = React.TextareaHTMLAttributes<HTMLTextAreaElemen
     description?: string | React.ReactNode;
     error?: string | React.ReactNode;
     size?: Size;
+    autogrow?: boolean;
+    ref?: React.Ref<HTMLTextAreaElement>;
 };
 export declare const InputTextArea: (props: InputTextAreaProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/panel/PanelField.d.ts

@@ -0,0 +1,8 @@
+import * as React from "react";
+export type PanelFieldOrientation = 'vertical' | 'horizontal';
+export type PanelFieldProps = React.HTMLAttributes<HTMLDivElement> & {
+    label?: string | React.ReactNode;
+    children?: React.ReactNode;
+    orientation?: PanelFieldOrientation;
+};
+export declare const PanelField: (props: PanelFieldProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/panel/PanelLink.d.ts

@@ -0,0 +1,17 @@
+import * as React from "react";
+import { type TablerIcon } from "@tabler/icons-react";
+export type PanelLinkStatus = 'error' | 'warning' | 'success' | 'info';
+type PanelLinkBaseProps = {
+    Icon?: TablerIcon;
+    children?: React.ReactNode;
+    status?: PanelLinkStatus;
+};
+type PanelLinkAnchorProps = PanelLinkBaseProps & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof PanelLinkBaseProps> & {
+    href: string;
+};
+type PanelLinkButtonProps = PanelLinkBaseProps & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, keyof PanelLinkBaseProps> & {
+    href?: undefined;
+};
+export type PanelLinkProps = PanelLinkAnchorProps | PanelLinkButtonProps;
+export declare const PanelLink: (props: PanelLinkProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/panel/PanelStack.d.ts

@@ -0,0 +1,7 @@
+import * as React from "react";
+export type PanelStackProps = React.HTMLAttributes<HTMLDivElement> & {
+    children?: React.ReactNode;
+};
+export declare const PanelStack: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    children?: React.ReactNode;
+} & React.RefAttributes<HTMLDivElement>>;

package/dist/index.d.ts

@@ -19,7 +19,10 @@ export { InputSelect } from "./components/inputs/InputSelect.tsx";
 export { InputSelectSearchable } from "./components/inputs/InputSelectSearchable.tsx";
 export { InputSelectSearchableAsync } from "./components/inputs/InputSelectSearchableAsync.tsx";
 export { InputSelectOption } from "./components/inputs/InputSelectOption.tsx";
-export { Panel } from "./components/Panel.tsx";
+export { Panel } from "./components/panel/Panel.tsx";
+export { PanelStack } from "./components/panel/PanelStack.tsx";
+export { PanelField } from "./components/panel/PanelField.tsx";
+export { PanelLink } from "./components/panel/PanelLink.tsx";
 export { Divider } from "./components/Divider.tsx";
 export { Tooltip } from "./components/Tooltip.tsx";
 export { Modal } from "./components/Modal.tsx";