@tetherto/mdk-react-devkit 0.0.0-stage → 0.12.1

package/dist/primitives/components/icons/temperature-alarm-icon.js

@@ -0,0 +1,10 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { createIcon } from './create-icon';
+export const TemperatureAlarmIcon = createIcon({
+    displayName: 'TemperatureAlarmIcon',
+    viewBox: '0 0 25 25',
+    defaultWidth: 25,
+    defaultHeight: 25,
+    multiColor: true,
+    path: (_jsxs(_Fragment, { children: [_jsx("path", { d: "M12.3997 3L22.8 23.8H2L12.3997 3Z", fill: "#EF4444", fillOpacity: "0.2" }), _jsx("path", { d: "M12.8467 2.77637L23.2471 23.5762L23.6094 24.2998H1.19141L1.55273 23.5762L11.9521 2.77637L12.3994 1.88184L12.8467 2.77637Z", stroke: "#EF4444", strokeOpacity: "0.4" }), _jsx("path", { d: "M12.3998 13.0751C11.9961 13.0751 11.6686 13.4026 11.6686 13.8063V16.3124C11.6686 16.576 11.5604 16.7984 11.4355 16.9599C11.2755 17.1671 11.1811 17.4245 11.1811 17.7063C11.1811 18.3797 11.7264 18.9251 12.3998 18.9251C13.0732 18.9251 13.6186 18.3797 13.6186 17.7063C13.6186 17.4245 13.5241 17.1671 13.3641 16.9614C13.2392 16.7999 13.1311 16.5775 13.1311 16.3139V13.8063C13.1311 13.4026 12.8035 13.0751 12.3998 13.0751ZM10.6936 13.8063C10.6936 12.8649 11.4568 12.1001 12.3998 12.1001C13.3428 12.1001 14.1061 12.8633 14.1061 13.8063V16.3124C14.1061 16.3139 14.1076 16.317 14.1091 16.3215C14.1121 16.3307 14.1213 16.3459 14.135 16.3642C14.4229 16.7359 14.5936 17.2021 14.5936 17.7063C14.5936 18.9175 13.6109 19.9001 12.3998 19.9001C11.1887 19.9001 10.2061 18.9175 10.2061 17.7063C10.2061 17.2006 10.3767 16.7344 10.6646 16.3642C10.6783 16.3459 10.6875 16.3307 10.6905 16.3215C10.692 16.317 10.6936 16.3139 10.6936 16.3124V13.8063ZM13.1311 17.7063C13.1311 18.1101 12.8035 18.4376 12.3998 18.4376C11.9961 18.4376 11.6686 18.1101 11.6686 17.7063C11.6686 17.3879 11.8727 17.1168 12.1561 17.0162V13.8063C12.1561 13.6723 12.2657 13.5626 12.3998 13.5626C12.5339 13.5626 12.6436 13.6723 12.6436 13.8063V17.0162C12.9269 17.1168 13.1311 17.3879 13.1311 17.7063Z", fill: "#EF4444" })] })),
+});

package/dist/primitives/components/icons/temperature-celsius-icon.d.ts

@@ -0,0 +1,5 @@
+export declare const TemperatureCelsiusIcon: import("react").ForwardRefExoticComponent<{
+    size?: number | string;
+    color?: string;
+    children?: never;
+} & import("react").SVGAttributes<SVGElement> & import("react").RefAttributes<SVGSVGElement>>;

package/dist/primitives/components/icons/temperature-celsius-icon.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createIcon } from './create-icon';
+export const TemperatureCelsiusIcon = createIcon({
+    displayName: 'TemperatureCelsiusIcon',
+    viewBox: '0 0 16 16',
+    defaultWidth: 16,
+    defaultHeight: 16,
+    path: ({ color }) => (_jsx("path", { d: "M11.7831 2.36304c.6543 0 1.2867.09521 1.897.28564.6104.19043 1.1694.45654 1.6773.79834l-.9961 2.46094c-.3418-.30274-.7325-.54443-1.1719-.7251-.4395-.18066-.9082-.27099-1.4063-.27099-.5371 0-1.0351.10253-1.4941.30761-.46875.19531-.87646.46631-1.22314.81299-.34668.34668-.62256.7544-.82764 1.22315-.19531.46875-.29297.96679-.29297 1.49414 0 .53711.09766 1.03515.29297 1.49414.20508.4687.48096.8765.82764 1.2231.34668.3467.75439.6226 1.22314.8277.459.1953.957.2929 1.4941.2929.4395 0 .857-.0683 1.2525-.205.3955-.1368.7544-.3321 1.0766-.586l.9668 2.4317c-.4785.2929-.9961.52-1.5527.6811-.5566.1612-1.1377.2417-1.7432.2417-.4296 0-.8496-.0439-1.2597-.1318-.4102-.0781-.80569-.1978-1.18655-.3589s-.74707-.3589-1.09863-.5933c-.35156-.2343-.67871-.498-.98145-.791-.29296-.3027-.55664-.6299-.79101-.9814-.23438-.3418-.43213-.7056-.59326-1.0913-.16114-.3858-.28076-.7837-.35889-1.1939-.08789-.41013-.13184-.83006-.13184-1.25974 0-.41993.04395-.83497.13184-1.24512.07813-.41016.19775-.80811.35889-1.19385.16113-.38574.35888-.75439.59326-1.10596.23437-.35156.49805-.67382.79101-.96679.30274-.30274.62989-.57129.98145-.80567.35156-.23437.71777-.42968 1.09863-.58593.38086-.15625.77635-.27832 1.18655-.36622.4101-.07812.8301-.11718 1.2597-.11718ZM2.83295.64917c.34179 0 .66894.065918.98144.197754s.58594.319826.82031.563966c.24415.23437.42969.50781.55665.82031.12695.3125.19042.63965.19042.98145 0 .34179-.06347.66894-.19042.98144s-.3125.58594-.55665.82031c-.23437.24414-.50781.43213-.82031.56397-.3125.13184-.63965.19775-.98144.19775-.3418 0-.66895-.06591-.98145-.19775s-.58594-.31983-.82031-.56397c-.244142-.23437-.43213-.50781-.563966-.82031-.131836-.3125-.197754-.63965-.197754-.98144 0-.3418.065918-.66895.197754-.98145s.319824-.58594.563966-.82031c.23437-.24414.50781-.43213.82031-.563966.3125-.131836.63965-.197754.98145-.197754Zm0 1.71387c-.11719 0-.22705.02197-.32959.06592-.10254.04394-.19287.10498-.271.1831-.07812.07813-.13916.16846-.1831.271-.04395.10254-.06592.2124-.06592.32959 0 .11718.02197.22705.06592.32959.04394.10254.10498.19287.1831.27099.07813.07813.16846.13916.271.18311.10254.04394.2124.06592.32959.06592.11718 0 .22705-.02198.32959-.06592.10254-.04395.19287-.10498.27099-.18311.07813-.07812.13916-.16845.18311-.27099.04394-.10254.06592-.21241.06592-.32959 0-.11719-.02198-.22705-.06592-.32959-.04395-.10254-.10498-.19287-.18311-.271-.07812-.07812-.16845-.13916-.27099-.1831-.10254-.04395-.21241-.06592-.32959-.06592Z", fill: color })),
+});

package/dist/primitives/components/icons/temperature-indicator-icon.d.ts

@@ -0,0 +1,5 @@
+export declare const TemperatureIndicatorIcon: import("react").ForwardRefExoticComponent<{
+    size?: number | string;
+    color?: string;
+    children?: never;
+} & import("react").SVGAttributes<SVGElement> & import("react").RefAttributes<SVGSVGElement>>;

package/dist/primitives/components/icons/temperature-indicator-icon.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createIcon } from './create-icon';
+export const TemperatureIndicatorIcon = createIcon({
+    displayName: 'TemperatureIndicatorIcon',
+    viewBox: '0 0 10 13',
+    defaultWidth: 10,
+    defaultHeight: 13,
+    path: ({ color }) => (_jsx("path", { d: "M5 0.25C6.60665 0.25 7.91832 1.30248 7.99633 2.62512L8 2.74989L8.00075 6.955L8.0423 6.991C8.63923 7.53369 9.01468 8.22325 9.10423 8.96619L9.11975 9.1385L9.125 9.3125C9.125 11.211 7.2782 12.75 5 12.75C2.72182 12.75 0.875 11.211 0.875 9.3125C0.875 8.49687 1.21844 7.72637 1.82454 7.11812L1.95841 6.99031L1.99925 6.95437L2 2.75C2 1.45432 3.18281 0.38885 4.69767 0.262538L4.8503 0.253062L5 0.25ZM5 1.5C4.2092 1.5 3.56135 2.00992 3.50412 2.65673L3.5 2.75002L3.49978 7.49569L3.25003 7.682C2.69647 8.09494 2.375 8.68137 2.375 9.3125C2.375 10.5206 3.55025 11.5 5 11.5C6.44975 11.5 7.625 10.5206 7.625 9.3125C7.625 8.72669 7.34802 8.17931 6.86555 7.7735L6.75058 7.68244L6.50105 7.49612L6.5 2.75C6.5 2.05964 5.82845 1.5 5 1.5ZM5 4C5.41423 4 5.75 4.27982 5.75 4.625L5.7506 7.88025C6.41248 8.1215 6.875 8.672 6.875 9.3125C6.875 10.1754 6.03552 10.875 5 10.875C3.96447 10.875 3.125 10.1754 3.125 9.3125C3.125 8.67175 3.58783 8.12106 4.25015 7.87994L4.25 4.625C4.25 4.27982 4.58577 4 5 4Z", fill: color })),
+});

package/dist/primitives/components/icons/temperature-weather-icon.d.ts

@@ -0,0 +1,5 @@
+export declare const TemperatureWeatherIcon: import("react").ForwardRefExoticComponent<{
+    size?: number | string;
+    color?: string;
+    children?: never;
+} & import("react").SVGAttributes<SVGElement> & import("react").RefAttributes<SVGSVGElement>>;

package/dist/primitives/components/icons/temperature-weather-icon.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createIcon } from './create-icon';
+export const TemperatureWeatherIcon = createIcon({
+    displayName: 'TemperatureWeatherIcon',
+    viewBox: '0 0 15 47',
+    defaultWidth: 15,
+    defaultHeight: 47,
+    multiColor: true,
+    path: (_jsx("path", { d: "M9.934 5.33415C9.934 4.06082 8.8221 3.02858 7.4505 3.02858C6.0789 3.02858 4.967 4.06082 4.967 5.33415V33.3945C5.74378 33.1396 6.5797 33.0009 7.4505 33.0009C8.3213 33.0009 9.15721 33.1396 9.934 33.3945V30.6953H8.69225C8.00645 30.6953 7.4505 30.1792 7.4505 29.5425C7.4505 28.9059 8.00645 28.3898 8.69225 28.3898H9.934V26.0842H8.69225C8.00645 26.0842 7.4505 25.5681 7.4505 24.9314C7.4505 24.2948 8.00645 23.7786 8.69225 23.7786H9.934V21.4731H8.69225C8.00645 21.4731 7.4505 20.957 7.4505 20.3203C7.4505 19.6836 8.00645 19.1675 8.69225 19.1675H9.934V16.862H8.69225C8.00645 16.862 7.4505 16.3458 7.4505 15.7092C7.4505 15.0725 8.00645 14.5564 8.69225 14.5564H9.934V12.2508H8.69225C8.00645 12.2508 7.4505 11.7347 7.4505 11.098C7.4505 10.4614 8.00645 9.94527 8.69225 9.94527H9.934V7.63971H8.69225C8.00645 7.63971 7.4505 7.12359 7.4505 6.48693C7.4505 5.85026 8.00645 5.33415 8.69225 5.33415H9.934ZM2.4835 34.7621V5.33415C2.4835 2.78749 4.7073 0.723022 7.4505 0.723022C10.1937 0.723022 12.4175 2.78749 12.4175 5.33415V34.7621C13.9417 36.0286 14.901 37.8691 14.901 39.9176C14.901 43.7375 11.5653 46.8343 7.4505 46.8343C3.3357 46.8343 0 43.7375 0 39.9176C0 37.8691 0.959253 36.0286 2.4835 34.7621ZM4.44864 36.2435C3.25454 37.0857 2.4835 38.418 2.4835 39.9176C2.4835 42.4642 4.7073 44.5287 7.4505 44.5287C10.1937 44.5287 12.4175 42.4642 12.4175 39.9176C12.4175 38.418 11.6465 37.0857 10.4524 36.2435C10.4378 36.2338 10.4234 36.2238 10.4093 36.2135C9.58285 35.6436 8.55909 35.3064 7.4505 35.3064C6.34191 35.3064 5.31815 35.6436 4.4917 36.2135C4.47759 36.2238 4.46323 36.2338 4.44864 36.2435ZM7.4505 42.2231C6.0789 42.2231 4.967 41.1909 4.967 39.9176C4.967 38.6442 6.0789 37.612 7.4505 37.612C8.8221 37.612 9.934 38.6442 9.934 39.9176C9.934 41.1909 8.8221 42.2231 7.4505 42.2231Z", fill: "#EFE1E1" })),
+});

package/dist/primitives/components/icons/types.d.ts

@@ -0,0 +1,21 @@
+import type { ReactNode, SVGAttributes } from 'react';
+export type IconProps = {
+    /** Sets both width and height */
+    size?: number | string;
+    /**
+     * Only affects single-color icons (default: 'currentColor')
+     * @default 'currentColor'
+     */
+    color?: string;
+    children?: never;
+} & SVGAttributes<SVGElement>;
+export type CreateIconOptions = {
+    displayName: string;
+    viewBox: string;
+    defaultWidth?: number;
+    defaultHeight?: number;
+    multiColor?: boolean;
+    path: ReactNode | ((props: {
+        color: string;
+    }) => ReactNode);
+};

package/dist/primitives/components/icons/types.js

@@ -0,0 +1 @@
+export {};

package/dist/primitives/components/icons/unpin-icon.d.ts

@@ -0,0 +1,5 @@
+export declare const UnPinIcon: import("react").ForwardRefExoticComponent<{
+    size?: number | string;
+    color?: string;
+    children?: never;
+} & import("react").SVGAttributes<SVGElement> & import("react").RefAttributes<SVGSVGElement>>;

package/dist/primitives/components/icons/unpin-icon.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createIcon } from './create-icon';
+export const UnPinIcon = createIcon({
+    displayName: 'UnPinIcon',
+    viewBox: '0 0 214 213',
+    defaultWidth: 32,
+    defaultHeight: 32,
+    path: ({ color }) => (_jsx("path", { d: "M190.308 191.297C191.735 192.867 192.48 194.94 192.379 197.059C192.278 199.178 191.339 201.171 189.769 202.598C188.199 204.025 186.126 204.77 184.007 204.669C181.887 204.568 179.895 203.63 178.468 202.059L152.044 172.994C149.59 187.167 142.158 199.21 136.67 206.505C135.295 208.333 133.544 209.844 131.535 210.936C129.525 212.028 127.305 212.676 125.023 212.836C124.648 212.862 124.274 212.875 123.899 212.875C121.797 212.875 119.715 212.461 117.773 211.656C115.831 210.851 114.066 209.671 112.58 208.184L64.3876 159.992L30.0448 194.335C28.5446 195.835 26.5097 196.678 24.3879 196.678C22.2662 196.678 20.2313 195.836 18.7309 194.335C17.2305 192.835 16.3875 190.8 16.3874 188.678C16.3873 186.557 17.2301 184.522 18.7304 183.021L53.0736 148.678L4.6835 100.288C3.09583 98.6984 1.8604 96.7926 1.05751 94.6943C0.254614 92.596 -0.0977721 90.3523 0.0232524 88.1089C0.144277 85.8655 0.736003 83.6727 1.75997 81.673C2.78394 79.6733 4.21723 77.9114 5.9667 76.5018C22.1435 63.4516 37.8764 60.3412 49.9267 60.6644L18.4677 26.0594C17.0405 24.4894 16.2954 22.4167 16.3964 20.2973C16.4974 18.1779 17.4362 16.1854 19.0063 14.7582C20.5763 13.3309 22.6491 12.5859 24.7684 12.6869C26.8878 12.7879 28.8803 13.7267 30.3075 15.2967L190.308 191.297ZM208.388 65.3646L147.701 4.67711C144.698 1.68179 140.629 -0.000187445 136.387 1.56679e-08C132.145 0.000187476 128.076 1.68253 125.073 4.67811L87.0976 42.6542C85.644 44.1079 84.8058 46.0654 84.7569 48.1206C84.708 50.1759 85.4521 52.171 86.8349 53.6923L155.406 129.121C156.135 129.922 157.018 130.567 158.003 131.017C158.988 131.466 160.053 131.711 161.136 131.737C161.199 131.739 161.263 131.74 161.326 131.74C163.448 131.74 165.483 130.897 166.983 129.396L208.387 87.9926C209.873 86.507 211.051 84.7432 211.856 82.8019C212.66 80.8607 213.074 78.7801 213.074 76.6788C213.074 74.5776 212.66 72.4969 211.856 70.5556C211.052 68.6143 209.873 66.8504 208.388 65.3646Z", fill: color })),
+});

package/dist/primitives/components/icons/user-avatar-icon.d.ts

@@ -0,0 +1,5 @@
+export declare const UserAvatarIcon: import("react").ForwardRefExoticComponent<{
+    size?: number | string;
+    color?: string;
+    children?: never;
+} & import("react").SVGAttributes<SVGElement> & import("react").RefAttributes<SVGSVGElement>>;

package/dist/primitives/components/icons/user-avatar-icon.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createIcon } from './create-icon';
+export const UserAvatarIcon = createIcon({
+    displayName: 'UserAvatarIcon',
+    viewBox: '0 0 16 16',
+    defaultWidth: 16,
+    defaultHeight: 16,
+    path: ({ color }) => (_jsx("path", { d: "M4 13.5V12.9999C4 11.343 5.34315 10 7 10H9C10.6569 10 12 11.343 12 12.9999V13.5M8 4C6.89543 4 6 4.89543 6 6C6 7.10457 6.89543 8 8 8C9.10457 8 10 7.10457 10 6C10 4.89543 9.10457 4 8 4ZM8 15C4.13401 15 1 11.866 1 8C1 4.13401 4.13401 1 8 1C11.866 1 15 4.13401 15 8C15 11.866 11.866 15 8 15Z", stroke: color, strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })),
+});

package/dist/primitives/components/icons/user-management-nav-icon.d.ts

@@ -0,0 +1,5 @@
+export declare const UserManagementNavIcon: import("react").ForwardRefExoticComponent<{
+    size?: number | string;
+    color?: string;
+    children?: never;
+} & import("react").SVGAttributes<SVGElement> & import("react").RefAttributes<SVGSVGElement>>;

package/dist/primitives/components/icons/user-management-nav-icon.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createIcon } from './create-icon';
+export const UserManagementNavIcon = createIcon({
+    displayName: 'UserManagementNavIcon',
+    viewBox: '0 0 33 24',
+    defaultWidth: 33,
+    defaultHeight: 24,
+    path: ({ color }) => (_jsx("path", { fill: color, d: "M16.3052 15.9156c4.9326 0 9.1443.782 9.1443 3.9113 0 3.128-4.1847 3.9385-9.1443 3.9385-4.9326 0-9.14439-.782-9.14439-3.91 0-3.1293 4.18469-3.9398 9.14439-3.9398Zm7.8866-1.8843c1.8858-.0349 3.9131.224 4.6623.4079 1.5871.312 2.631.949 3.0636 1.8747.3655.76.3655 1.6416 0 2.4003-.6617 1.4358-2.7946 1.8968-3.6236 2.0159-.1712.0259-.3089-.123-.2909-.2952.4235-3.9786-2.9451-5.865-3.8165-6.2987-.0374-.0194-.0451-.0492-.0412-.0673.0025-.013.018-.0337.0463-.0376Zm-15.98085-.0027.35511.0032c.02832.0039.04248.0246.04505.0363.00386.0194-.00386.0479-.0399.0686-.87273.4337-4.24137 2.3201-3.81788 6.2974.01803.1735-.11842.3211-.28962.2965-.82896-.1191-2.96188-.58-3.623505-2.0158-.366855-.76-.366855-1.6404 0-2.4004.432505-.9257 1.475145-1.5627 3.062285-1.876.75044-.1826 2.77652-.4415 4.66357-.4066l-.35511-.0032ZM16.3052.764069c3.3583 0 6.0512 2.705911 6.0512 6.085061 0 3.37787-2.6929 6.08637-6.0512 6.08637-3.3584 0-6.0512-2.7085-6.0512-6.08637 0-3.37915 2.6928-6.085061 6.0512-6.085061ZM24.52 1.77885c3.2438 0 5.7912 3.06972 4.9236 6.48901-.5856 2.30194-2.7057 3.83104-5.0677 3.76884-.2369-.0065-.4699-.0285-.6951-.0673-.1635-.0285-.2459-.2136-.1532-.3509.901-1.3335 1.4146-2.93763 1.4146-4.65958 0-1.79703-.5612-3.47237-1.5356-4.84604-.0309-.04272-.0541-.10875-.0232-.15795.0258-.04014.0734-.06085.1185-.07121.3282-.06732.6654-.10487 1.0181-.10487ZM8.23589 1.77872c.3527 0 .68995.03755 1.01947.10487.04377.01036.09268.03237.11843.07121.0296.0492.00772.11523-.02317.15795-.97442 1.37367-1.53565 3.04901-1.53565 4.84604 0 1.72195.5136 3.32611 1.41465 4.65961.09268.1372.0103.3224-.15318.3509-.22655.0401-.45825.0608-.6951.0673-2.36203.0621-4.48207-1.4669-5.06775-3.76887-.86887-3.41929 1.67852-6.48901 4.9223-6.48901Z" })),
+});

package/dist/primitives/components/icons/volume-off-icon.d.ts

@@ -0,0 +1,5 @@
+export declare const VolumeOffIcon: import("react").ForwardRefExoticComponent<{
+    size?: number | string;
+    color?: string;
+    children?: never;
+} & import("react").SVGAttributes<SVGElement> & import("react").RefAttributes<SVGSVGElement>>;

package/dist/primitives/components/icons/volume-off-icon.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createIcon } from './create-icon';
+export const VolumeOffIcon = createIcon({
+    displayName: 'VolumeOffIcon',
+    viewBox: '0 0 20 20',
+    defaultWidth: 20,
+    defaultHeight: 20,
+    path: ({ color }) => (_jsx("path", { d: "M13.5859 8.58301L16.4139 11.4092M16.4142 8.58301L13.5862 11.4092M6 12.9941H4C3.447 12.9941 3 12.5474 3 11.9948V7.99731C3 7.44467 3.447 6.99805 4 6.99805H6L11 4V15.9922L6 12.9941Z", stroke: color, strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })),
+});

package/dist/primitives/components/icons/volume-on-icon.d.ts

@@ -0,0 +1,5 @@
+export declare const VolumeOnIcon: import("react").ForwardRefExoticComponent<{
+    size?: number | string;
+    color?: string;
+    children?: never;
+} & import("react").SVGAttributes<SVGElement> & import("react").RefAttributes<SVGSVGElement>>;

package/dist/primitives/components/icons/volume-on-icon.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createIcon } from './create-icon';
+export const VolumeOnIcon = createIcon({
+    displayName: 'VolumeOnIcon',
+    viewBox: '0 0 20 20',
+    defaultWidth: 20,
+    defaultHeight: 20,
+    path: ({ color }) => (_jsx("path", { d: "M13 8.5V11.5M15 6.5V13.5M17 4.5V15.5M6 12.9941H4C3.448 12.9941 3 12.5474 3 11.9948V7.99739C3 7.44475 3.448 6.99804 4 6.99804H6L11 4V15.9922L6 12.9941Z", stroke: color, strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })),
+});

package/dist/primitives/components/indicator/index.d.ts

@@ -0,0 +1,89 @@
+import { type ComponentPropsWithoutRef, type ReactNode } from 'react';
+import type { ComponentSize } from '../../types';
+export type IndicatorColor = 'red' | 'gray' | 'blue' | 'yellow' | 'green' | 'purple' | 'amber' | 'slate';
+export declare const INDICATOR_COLORS: Record<string, IndicatorColor>;
+export type IndicatorProps = {
+    /**
+     * Color variant of the indicator
+     * @default 'gray'
+     */
+    color?: IndicatorColor;
+    /**
+     * Size variant of the indicator
+     * @default 'md'
+     */
+    size?: ComponentSize;
+    /**
+     * Custom className for the root element
+     */
+    className?: string;
+    /**
+     * When true, adds extra spacing between child elements and stacks them vertically.
+     * Useful for displaying multiple pieces of information (e.g. status + count) in a clear way.
+     * @default false
+     */
+    vertical?: boolean;
+    /**
+     * Children content (can include text, icons, multiple elements)
+     */
+    children?: ReactNode;
+    /**
+     * Click handler
+     */
+    onClick?: VoidFunction;
+} & ComponentPropsWithoutRef<'div'>;
+/**
+ * Indicator component - display status with colored background and label
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <Indicator color="green" size="lg">Running</Indicator>
+ *
+ * // With icon
+ * <Indicator color="green">
+ *   <span>Functioning</span>
+ *   <ChevronDownIcon />
+ * </Indicator>
+ *
+ * // With count
+ * <Indicator color="green">
+ *   <span>Running</span>
+ *   <span>10</span>
+ * </Indicator>
+ * ```
+ * @category display
+ * @domain generic
+ * @tier agent-ready
+ */
+declare const Indicator: import("react").ForwardRefExoticComponent<{
+    /**
+     * Color variant of the indicator
+     * @default 'gray'
+     */
+    color?: IndicatorColor;
+    /**
+     * Size variant of the indicator
+     * @default 'md'
+     */
+    size?: ComponentSize;
+    /**
+     * Custom className for the root element
+     */
+    className?: string;
+    /**
+     * When true, adds extra spacing between child elements and stacks them vertically.
+     * Useful for displaying multiple pieces of information (e.g. status + count) in a clear way.
+     * @default false
+     */
+    vertical?: boolean;
+    /**
+     * Children content (can include text, icons, multiple elements)
+     */
+    children?: ReactNode;
+    /**
+     * Click handler
+     */
+    onClick?: VoidFunction;
+} & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export { Indicator };

package/dist/primitives/components/indicator/index.js

@@ -0,0 +1,42 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef } from 'react';
+import { cn } from '../../utils';
+export const INDICATOR_COLORS = {
+    RED: 'red',
+    GRAY: 'gray',
+    BLUE: 'blue',
+    YELLOW: 'yellow',
+    GREEN: 'green',
+    PURPLE: 'purple',
+    AMBER: 'amber',
+    SLATE: 'slate',
+};
+/**
+ * Indicator component - display status with colored background and label
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <Indicator color="green" size="lg">Running</Indicator>
+ *
+ * // With icon
+ * <Indicator color="green">
+ *   <span>Functioning</span>
+ *   <ChevronDownIcon />
+ * </Indicator>
+ *
+ * // With count
+ * <Indicator color="green">
+ *   <span>Running</span>
+ *   <span>10</span>
+ * </Indicator>
+ * ```
+ * @category display
+ * @domain generic
+ * @tier agent-ready
+ */
+const Indicator = forwardRef(({ className, color = 'gray', size = 'md', vertical = false, children, onClick, ...props }, ref) => {
+    return (_jsx("div", { ref: ref, className: cn('mdk-indicator', `mdk-indicator--${color}`, `mdk-indicator--${size}`, onClick && 'mdk-indicator--clickable', vertical && 'mdk-indicator--vertical', className), onClick: onClick, ...props, children: children }));
+});
+Indicator.displayName = 'Indicator';
+export { Indicator };

package/dist/primitives/components/indicator/indicator.example.d.ts

@@ -0,0 +1 @@
+export declare const IndicatorExample: () => import("react").JSX.Element;

package/dist/primitives/components/indicator/indicator.example.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Runnable example for Indicator.
+ */
+import { Indicator } from '@tetherto/mdk-react-devkit';
+export const IndicatorExample = () => (_jsxs("div", { className: "mdk-example-col", children: [_jsxs("div", { className: "mdk-example-row", children: [_jsx(Indicator, { color: "green", children: "Online" }), _jsx(Indicator, { color: "red", children: "Offline" }), _jsx(Indicator, { color: "amber", children: "Maintenance" }), _jsx(Indicator, { color: "gray", children: "Unknown" })] }), _jsxs("div", { className: "mdk-example-row", children: [_jsx(Indicator, { color: "green", size: "sm", children: "Running" }), _jsx(Indicator, { color: "blue", size: "md", children: "Syncing" }), _jsx(Indicator, { color: "purple", size: "lg", children: "Overclocked" })] }), _jsxs("div", { className: "mdk-example-row", children: [_jsxs(Indicator, { color: "green", vertical: true, children: [_jsx("span", { children: "Running" }), _jsx("span", { children: "142" })] }), _jsxs(Indicator, { color: "red", vertical: true, children: [_jsx("span", { children: "Offline" }), _jsx("span", { children: "23" })] })] })] }));

package/dist/primitives/components/input/index.d.ts

@@ -0,0 +1,63 @@
+import { type ComponentProps, type ReactNode } from 'react';
+export type InputSize = 'default' | 'medium';
+export type InputProps = Omit<ComponentProps<'input'>, 'prefix' | 'size'> & {
+    /**
+     * Optional label displayed above the input
+     */
+    label?: string;
+    /**
+     * HTML id for the input. Required when using label for accessibility.
+     * @default auto-generated
+     */
+    id?: string;
+    /**
+     * Variant of the input
+     * - `default`: Standard text input
+     * - `search`: Input with magnifying glass icon on the right
+     * @default 'default'
+     */
+    variant?: 'default' | 'search';
+    /**
+     * Size of the input
+     * - `default`: padding 10px 12px, icon 16px
+     * - `medium`: padding 6px 12px, icon 12px
+     * @default 'default'
+     */
+    size?: InputSize;
+    /**
+     * Validation error message. When provided, displays error styling (red border) and the message below the input.
+     */
+    error?: string;
+    /**
+     * Custom className for the root wrapper
+     */
+    wrapperClassName?: string;
+    /**
+     * Prefix element displayed before the input (left side)
+     */
+    prefix?: ReactNode;
+    /**
+     * Suffix element displayed after the input (right side)
+     */
+    suffix?: ReactNode;
+};
+/**
+ * Text input with optional label, prefix/suffix slots, and a `search`
+ * variant. Forwards refs and all native `<input>` attributes.
+ *
+ * @category forms
+ * @domain generic
+ * @tier agent-ready
+ *
+ * @example
+ * ```tsx
+ * import { UNITS, CURRENCY } from '../../constants/units'
+ *
+ * <Input label="MAC Address" placeholder="Enter MAC address" id="mac" />
+ * <Input variant="search" placeholder="Search" />
+ * <Input prefix={CURRENCY.USD} suffix="USD" placeholder="0.00" />
+ * <Input suffix={UNITS.TEMPERATURE_C} placeholder="Temperature" />
+ * ```
+ */
+declare const Input: import("react").ForwardRefExoticComponent<Omit<InputProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
+export { Input };

package/dist/primitives/components/input/index.js

@@ -0,0 +1,39 @@
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { forwardRef, useId } from 'react';
+import { cn } from '../../utils';
+import { Label } from '../label';
+const SearchIcon = () => (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 14 14", fill: "none", children: [_jsx("g", { clipPath: "url(#search-icon-clip)", children: _jsx("path", { d: "M11.375 5.6875C11.375 6.94258 10.9676 8.10195 10.2812 9.04258L13.743 12.507C14.0848 12.8488 14.0848 13.4039 13.743 13.7457C13.4012 14.0875 12.8461 14.0875 12.5043 13.7457L9.04258 10.2812C8.10195 10.9703 6.94258 11.375 5.6875 11.375C2.5457 11.375 0 8.8293 0 5.6875C0 2.5457 2.5457 0 5.6875 0C8.8293 0 11.375 2.5457 11.375 5.6875ZM5.6875 9.625C6.20458 9.625 6.7166 9.52315 7.19432 9.32528C7.67204 9.1274 8.1061 8.83736 8.47173 8.47173C8.83736 8.1061 9.1274 7.67204 9.32528 7.19432C9.52315 6.7166 9.625 6.20458 9.625 5.6875C9.625 5.17042 9.52315 4.6584 9.32528 4.18068C9.1274 3.70296 8.83736 3.2689 8.47173 2.90327C8.1061 2.53764 7.67204 2.2476 7.19432 2.04972C6.7166 1.85185 6.20458 1.75 5.6875 1.75C5.17042 1.75 4.6584 1.85185 4.18068 2.04972C3.70296 2.2476 3.2689 2.53764 2.90327 2.90327C2.53764 3.2689 2.2476 3.70296 2.04972 4.18068C1.85185 4.6584 1.75 5.17042 1.75 5.6875C1.75 6.20458 1.85185 6.7166 2.04972 7.19432C2.2476 7.67204 2.53764 8.1061 2.90327 8.47173C3.2689 8.83736 3.70296 9.1274 4.18068 9.32528C4.6584 9.52315 5.17042 9.625 5.6875 9.625Z", fill: "currentColor" }) }), _jsx("defs", { children: _jsx("clipPath", { id: "search-icon-clip", children: _jsx("path", { d: "M0 0H14V14H0V0Z", fill: "white" }) }) })] }));
+/**
+ * Text input with optional label, prefix/suffix slots, and a `search`
+ * variant. Forwards refs and all native `<input>` attributes.
+ *
+ * @category forms
+ * @domain generic
+ * @tier agent-ready
+ *
+ * @example
+ * ```tsx
+ * import { UNITS, CURRENCY } from '../../constants/units'
+ *
+ * <Input label="MAC Address" placeholder="Enter MAC address" id="mac" />
+ * <Input variant="search" placeholder="Search" />
+ * <Input prefix={CURRENCY.USD} suffix="USD" placeholder="0.00" />
+ * <Input suffix={UNITS.TEMPERATURE_C} placeholder="Temperature" />
+ * ```
+ */
+const Input = forwardRef(({ className, wrapperClassName, label, id, variant = 'default', size = 'default', disabled, error, prefix, suffix, ...props }, ref) => {
+    const inputId = id ?? useId();
+    const errorId = `${inputId}-error`;
+    const showSearchIcon = variant === 'search';
+    const hasError = !!error;
+    const hasPrefix = !!prefix;
+    const hasSuffix = !!suffix || showSearchIcon;
+    const input = (_jsxs("div", { className: cn('mdk-input__wrapper', `mdk-input__wrapper--size-${size}`, showSearchIcon && 'mdk-input__wrapper--search', disabled && 'mdk-input__wrapper--disabled', hasError && 'mdk-input__wrapper--error', hasPrefix && 'mdk-input__wrapper--has-prefix', hasSuffix && 'mdk-input__wrapper--has-suffix', !label && wrapperClassName), children: [prefix && (_jsx("span", { className: "mdk-input__prefix", "aria-hidden": true, children: prefix })), _jsx("input", { ref: ref, id: inputId, disabled: disabled, className: cn('mdk-input', `mdk-input--size-${size}`, className), "aria-invalid": hasError || props['aria-invalid'], "aria-describedby": hasError ? errorId : props['aria-describedby'], ...props }), suffix && (_jsx("span", { className: "mdk-input__suffix", "aria-hidden": true, children: suffix })), showSearchIcon && (_jsx("span", { className: "mdk-input__icon", "aria-hidden": true, children: _jsx(SearchIcon, {}) }))] }));
+    const content = (_jsxs(_Fragment, { children: [input, hasError && (_jsx("span", { id: errorId, className: "mdk-input__error", role: "alert", children: error }))] }));
+    if (label) {
+        return (_jsxs("div", { className: cn('mdk-input-root', wrapperClassName), children: [_jsx(Label, { htmlFor: inputId, className: "mdk-input__label", children: label }), content] }));
+    }
+    return content;
+});
+Input.displayName = 'Input';
+export { Input };

package/dist/primitives/components/input/input.example.d.ts

@@ -0,0 +1 @@
+export declare const InputExample: () => import("react").JSX.Element;

package/dist/primitives/components/input/input.example.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Runnable example for Input.
+ */
+import { useState } from 'react';
+import { Input } from '@tetherto/mdk-react-devkit';
+export const InputExample = () => {
+    const [value, setValue] = useState('');
+    return (_jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: 16, maxWidth: 320 }, children: [_jsx(Input, { id: "mac", label: "MAC address", placeholder: "AA:BB:CC:00:00:01", value: value, onChange: (e) => setValue(e.target.value) }), _jsx(Input, { variant: "search", placeholder: "Search miners" }), _jsx(Input, { prefix: "$", suffix: "USD", placeholder: "0.00" }), _jsx(Input, { label: "Invalid", error: "Must be a hex string", defaultValue: "abc" })] }));
+};

package/dist/primitives/components/label/index.d.ts

@@ -0,0 +1,20 @@
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { type ComponentPropsWithoutRef } from 'react';
+type LabelRootProps = ComponentPropsWithoutRef<typeof LabelPrimitive.Root>;
+/**
+ * Accessible text label for form controls. Associates with an input via `htmlFor` and supports a required-mark indicator. Built on Radix Label.
+ *
+ * @example
+ * ```tsx
+ * <Label htmlFor="email">Email</Label>
+ * <input id="email" type="email" />
+ * ```
+ * @category forms
+ * @domain generic
+ * @tier agent-ready
+ */
+declare const Label: import("react").ForwardRefExoticComponent<Omit<LabelPrimitive.LabelProps & import("react").RefAttributes<HTMLLabelElement>, "ref"> & {
+    /** Id of the input being labelled */
+    htmlFor?: LabelRootProps['htmlFor'];
+} & import("react").RefAttributes<HTMLLabelElement>>;
+export { Label };

package/dist/primitives/components/label/index.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { cn } from '../../utils';
+import { forwardRef } from 'react';
+/**
+ * Accessible text label for form controls. Associates with an input via `htmlFor` and supports a required-mark indicator. Built on Radix Label.
+ *
+ * @example
+ * ```tsx
+ * <Label htmlFor="email">Email</Label>
+ * <input id="email" type="email" />
+ * ```
+ * @category forms
+ * @domain generic
+ * @tier agent-ready
+ */
+const Label = forwardRef(({ className, ...props }, ref) => (_jsx(LabelPrimitive.Root, { ref: ref, className: cn('mdk-label', className), ...props })));
+Label.displayName = LabelPrimitive.Root.displayName;
+export { Label };

package/dist/primitives/components/label/label.example.d.ts

@@ -0,0 +1 @@
+export declare const LabelExample: () => import("react").JSX.Element;

package/dist/primitives/components/label/label.example.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Runnable example for Label.
+ */
+import { Input, Label } from '@tetherto/mdk-react-devkit';
+export const LabelExample = () => {
+    return (_jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: 8, maxWidth: 320 }, children: [_jsx(Label, { htmlFor: "email", children: "Email" }), _jsx(Input, { id: "email", type: "email", placeholder: "you@example.com" })] }));
+};

package/dist/primitives/components/labeled-card/index.d.ts

@@ -0,0 +1 @@
+export * from './labeled-card';

package/dist/primitives/components/labeled-card/index.js

@@ -0,0 +1 @@
+export * from './labeled-card';

package/dist/primitives/components/labeled-card/labeled-card.d.ts

@@ -0,0 +1,116 @@
+import { type ReactNode } from 'react';
+export type LabeledCardNavigateOptions = Partial<{
+    href: string;
+    target: string;
+}>;
+export type LabeledCardProps = Partial<{
+    /**
+     * Applies a dark background modifier
+     * @default false
+     */
+    isDark: boolean;
+    /** Additional class for the root element */
+    className: string;
+    /**
+     * Prevents content from wrapping
+     * @default false
+     */
+    hasNoWrap: boolean;
+    /**
+     * Sets `position: relative` on the container
+     * @default false
+     */
+    isRelative: boolean;
+    /**
+     * Stretches the card to full container width
+     * @default false
+     */
+    isFullWidth: boolean;
+    /**
+     * Removes default margin
+     * @default false
+     */
+    hasNoMargin: boolean;
+    /**
+     * Removes the card border
+     * @default false
+     */
+    hasNoBorder: boolean;
+    /**
+     * Stretches the card to full container height
+     * @default false
+     */
+    isFullHeight: boolean;
+    /**
+     * Enables vertical scroll on the card body
+     * @default false
+     */
+    isScrollable: boolean;
+    /** Header content shown above the card body */
+    label: ReactNode;
+    /** Card body content */
+    children: ReactNode;
+    /** Returns a link `href`/`target` for the label when provided */
+    getNavigateOptions: (label: string) => LabeledCardNavigateOptions;
+    /** Tooltip shown when hovering the label, e.g. to explain what a count includes */
+    labelTooltip: ReactNode;
+}>;
+/**
+ * Card variant that pairs a tiny label above the body — used for compact stat or metadata blocks.
+ *
+ * @category layout
+ * @domain generic
+ * @tier agent-ready
+ */
+export declare const LabeledCard: import("react").ForwardRefExoticComponent<Partial<{
+    /**
+     * Applies a dark background modifier
+     * @default false
+     */
+    isDark: boolean;
+    /** Additional class for the root element */
+    className: string;
+    /**
+     * Prevents content from wrapping
+     * @default false
+     */
+    hasNoWrap: boolean;
+    /**
+     * Sets `position: relative` on the container
+     * @default false
+     */
+    isRelative: boolean;
+    /**
+     * Stretches the card to full container width
+     * @default false
+     */
+    isFullWidth: boolean;
+    /**
+     * Removes default margin
+     * @default false
+     */
+    hasNoMargin: boolean;
+    /**
+     * Removes the card border
+     * @default false
+     */
+    hasNoBorder: boolean;
+    /**
+     * Stretches the card to full container height
+     * @default false
+     */
+    isFullHeight: boolean;
+    /**
+     * Enables vertical scroll on the card body
+     * @default false
+     */
+    isScrollable: boolean;
+    /** Header content shown above the card body */
+    label: ReactNode;
+    /** Card body content */
+    children: ReactNode;
+    /** Returns a link `href`/`target` for the label when provided */
+    getNavigateOptions: (label: string) => LabeledCardNavigateOptions;
+    /** Tooltip shown when hovering the label, e.g. to explain what a count includes */
+    labelTooltip: ReactNode;
+}> & import("react").RefAttributes<HTMLDivElement>>;