@makroz/web 1.2.0 → 1.2.2

package/dist/auth/useMkAuth.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMkAuth.d.ts","sourceRoot":"","sources":["../../src/auth/useMkAuth.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAE1D;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,SAAS,IAAI,kBAAkB,CAM9C"}

package/dist/auth/useMkAuth.js

@@ -0,0 +1,26 @@
+import { useContext } from 'react';
+import { MkAuthContext } from './MkAuthContext';
+/**
+ * Hook to consume the value exposed by `<MkAuthProvider>`.
+ *
+ * Throws if used outside of a provider — this is intentional. We don't
+ * want auth code to silently no-op when the provider is missing, which
+ * is a real source of bugs (e.g. a deeply nested page that forgets to
+ * mount the auth context).
+ *
+ * The error message is deliberately short and includes the provider name
+ * so the dev can grep for it.
+ *
+ * @example
+ * ```tsx
+ * const { user, isAuthenticated, hasAbility, login, logout } = useMkAuth();
+ * ```
+ */
+export function useMkAuth() {
+    const ctx = useContext(MkAuthContext);
+    if (!ctx) {
+        throw new Error('MkAuthProvider missing');
+    }
+    return ctx;
+}
+//# sourceMappingURL=useMkAuth.js.map

package/dist/auth/useMkAuth.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMkAuth.js","sourceRoot":"","sources":["../../src/auth/useMkAuth.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAGhD;;;;;;;;;;;;;;;GAeG;AACH,MAAM,UAAU,SAAS;IACrB,MAAM,GAAG,GAAG,UAAU,CAAC,aAAa,CAAC,CAAC;IACtC,IAAI,CAAC,GAAG,EAAE,CAAC;QACP,MAAM,IAAI,KAAK,CAAC,wBAAwB,CAAC,CAAC;IAC9C,CAAC;IACD,OAAO,GAAG,CAAC;AACf,CAAC"}

package/dist/components/FormField.d.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+/**
+ * @module FormField
+ * @description Form-level wrapper around MkInput that adds label, error state,
+ * helper text, and standard validation messages. Maps to a single input field
+ * used in forms (text, email, password, etc.).
+ */
+export type FormFieldType = 'text' | 'email' | 'password' | 'number' | 'tel' | 'url';
+export interface FormFieldProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'onChange'> {
+    /** Form field semantic type — maps to the underlying <input type="..."> */
+    type?: FormFieldType;
+    /** Field label displayed above the input */
+    label?: string;
+    /** Error message (renders error state and replaces helper text) */
+    error?: string;
+    /** Helper text shown below the input when no error is present */
+    helperText?: string;
+    /** Mark the field as required (adds visual indicator to label) */
+    required?: boolean;
+    /** Placeholder text */
+    placeholder?: string;
+    /** Disable interaction */
+    disabled?: boolean;
+    onChange?: (value: string) => void;
+}
+export declare const FormField: React.FC<FormFieldProps>;
+//# sourceMappingURL=FormField.d.ts.map

package/dist/components/FormField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormField.d.ts","sourceRoot":"","sources":["../../src/components/FormField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B;;;;;GAKG;AAEH,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,GAAG,QAAQ,GAAG,KAAK,GAAG,KAAK,CAAC;AAErF,MAAM,WAAW,cACb,SAAQ,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IAC9E,2EAA2E;IAC3E,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,mEAAmE;IACnE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,iEAAiE;IACjE,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,kEAAkE;IAClE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,uBAAuB;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAyB9C,CAAC"}

package/dist/components/FormField.js

@@ -0,0 +1,18 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { MkInput } from './MkInput';
+export const FormField = (_a) => {
+    var { type = 'text', label, error, helperText, required, placeholder, disabled, onChange } = _a, props = __rest(_a, ["type", "label", "error", "helperText", "required", "placeholder", "disabled", "onChange"]);
+    return (_jsx("div", { style: { display: 'flex', flexDirection: 'column', minWidth: 280 }, children: _jsx(MkInput, Object.assign({ type: type, label: label ? `${label}${required ? ' *' : ''}` : undefined, error: error, helperText: helperText, placeholder: placeholder, disabled: disabled, onChange: onChange }, props)) }));
+};
+//# sourceMappingURL=FormField.js.map

package/dist/components/FormField.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormField.js","sourceRoot":"","sources":["../../src/components/FormField.tsx"],"names":[],"mappings":";;;;;;;;;;;;AACA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AA8BpC,MAAM,CAAC,MAAM,SAAS,GAA6B,CAAC,EAUnD,EAAE,EAAE;QAV+C,EAChD,IAAI,GAAG,MAAM,EACb,KAAK,EACL,KAAK,EACL,UAAU,EACV,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,QAAQ,OAEX,EADM,KAAK,cATwC,2FAUnD,CADW;IAER,OAAO,CACH,cAAK,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,EAAE,YACnE,KAAC,OAAO,kBACJ,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,SAAS,EAC5D,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,EACxB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,IACd,KAAK,EACX,GACA,CACT,CAAC;AACN,CAAC,CAAC"}

package/dist/components/FormField.stories.d.ts

@@ -0,0 +1,11 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { FormField } from './FormField';
+declare const meta: Meta<typeof FormField>;
+export default meta;
+type Story = StoryObj<typeof FormField>;
+export declare const Text: Story;
+export declare const Email: Story;
+export declare const Password: Story;
+export declare const WithError: Story;
+export declare const Disabled: Story;
+//# sourceMappingURL=FormField.stories.d.ts.map

package/dist/components/FormField.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormField.stories.d.ts","sourceRoot":"","sources":["../../src/components/FormField.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,SAAS,CAehC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,SAAS,CAAC,CAAC;AAExC,eAAO,MAAM,IAAI,EAAE,KAOlB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAQnB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAOtB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAOvB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAQtB,CAAC"}

package/dist/components/FormField.stories.js

@@ -0,0 +1,61 @@
+import { FormField } from './FormField';
+const meta = {
+    title: 'Forms/FormField',
+    component: FormField,
+    parameters: {
+        layout: 'centered',
+    },
+    tags: ['autodocs'],
+    argTypes: {
+        type: {
+            control: { type: 'select' },
+            options: ['text', 'email', 'password', 'number', 'tel', 'url'],
+        },
+        disabled: { control: 'boolean' },
+        required: { control: 'boolean' },
+    },
+};
+export default meta;
+export const Text = {
+    args: {
+        type: 'text',
+        label: 'Full Name',
+        placeholder: 'Enter your full name',
+        helperText: 'As it appears on your ID',
+    },
+};
+export const Email = {
+    args: {
+        type: 'email',
+        label: 'Email Address',
+        placeholder: 'you@example.com',
+        helperText: 'We will never share your email',
+        required: true,
+    },
+};
+export const Password = {
+    args: {
+        type: 'password',
+        label: 'Password',
+        placeholder: '••••••••',
+        helperText: 'Minimum 8 characters',
+    },
+};
+export const WithError = {
+    args: {
+        type: 'email',
+        label: 'Email Address',
+        value: 'not-an-email',
+        error: 'Please enter a valid email address',
+    },
+};
+export const Disabled = {
+    args: {
+        type: 'text',
+        label: 'Username',
+        value: 'locked-user',
+        disabled: true,
+        helperText: 'Contact admin to change',
+    },
+};
+//# sourceMappingURL=FormField.stories.js.map

package/dist/components/FormField.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormField.stories.js","sourceRoot":"","sources":["../../src/components/FormField.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,MAAM,IAAI,GAA2B;IACjC,KAAK,EAAE,iBAAiB;IACxB,SAAS,EAAE,SAAS;IACpB,UAAU,EAAE;QACR,MAAM,EAAE,UAAU;KACrB;IACD,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACN,IAAI,EAAE;YACF,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE;YAC3B,OAAO,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,CAAC;SACjE;QACD,QAAQ,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;QAChC,QAAQ,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;KACnC;CACJ,CAAC;AAEF,eAAe,IAAI,CAAC;AAGpB,MAAM,CAAC,MAAM,IAAI,GAAU;IACvB,IAAI,EAAE;QACF,IAAI,EAAE,MAAM;QACZ,KAAK,EAAE,WAAW;QAClB,WAAW,EAAE,sBAAsB;QACnC,UAAU,EAAE,0BAA0B;KACzC;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,KAAK,GAAU;IACxB,IAAI,EAAE;QACF,IAAI,EAAE,OAAO;QACb,KAAK,EAAE,eAAe;QACtB,WAAW,EAAE,iBAAiB;QAC9B,UAAU,EAAE,gCAAgC;QAC5C,QAAQ,EAAE,IAAI;KACjB;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC3B,IAAI,EAAE;QACF,IAAI,EAAE,UAAU;QAChB,KAAK,EAAE,UAAU;QACjB,WAAW,EAAE,UAAU;QACvB,UAAU,EAAE,sBAAsB;KACrC;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAU;IAC5B,IAAI,EAAE;QACF,IAAI,EAAE,OAAO;QACb,KAAK,EAAE,eAAe;QACtB,KAAK,EAAE,cAAc;QACrB,KAAK,EAAE,oCAAoC;KAC9C;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC3B,IAAI,EAAE;QACF,IAAI,EAAE,MAAM;QACZ,KAAK,EAAE,UAAU;QACjB,KAAK,EAAE,aAAa;QACpB,QAAQ,EAAE,IAAI;QACd,UAAU,EAAE,yBAAyB;KACxC;CACJ,CAAC"}

package/dist/components/MkAccordion.d.ts

@@ -0,0 +1,36 @@
+import React from 'react';
+/**
+ * @module MkAccordion
+ * @description Collapsible accordion sections. Supports single or multiple open items.
+ *
+ * @example
+ * ```tsx
+ * <MkAccordion
+ *   items={[
+ *     { key: 'faq1', title: '¿Cómo funciona?', content: <p>Explicación aquí...</p> },
+ *     { key: 'faq2', title: 'Precios', content: <p>Gratis para siempre</p> },
+ *   ]}
+ *   multiple
+ * />
+ * ```
+ */
+export interface MkAccordionItem {
+    key: string;
+    title: string | React.ReactNode;
+    content: React.ReactNode;
+    disabled?: boolean;
+}
+export interface MkAccordionProps {
+    items: MkAccordionItem[];
+    /** Allow multiple items open at once. Default false. */
+    multiple?: boolean;
+    /** Initially expanded keys. */
+    defaultExpanded?: string[];
+    /** Controlled expanded keys. */
+    expanded?: string[];
+    onChange?: (expandedKeys: string[]) => void;
+    variant?: 'default' | 'bordered' | 'separated';
+    className?: string;
+}
+export declare const MkAccordion: React.FC<MkAccordionProps>;
+//# sourceMappingURL=MkAccordion.d.ts.map

package/dist/components/MkAccordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MkAccordion.d.ts","sourceRoot":"","sources":["../../src/components/MkAccordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgC,MAAM,OAAO,CAAC;AAGrD;;;;;;;;;;;;;;GAcG;AAEH,MAAM,WAAW,eAAe;IAC5B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAChC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,WAAW,gBAAgB;IAC7B,KAAK,EAAE,eAAe,EAAE,CAAC;IACzB,wDAAwD;IACxD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,+BAA+B;IAC/B,eAAe,CAAC,EAAE,MAAM,EAAE,CAAC;IAC3B,gCAAgC;IAChC,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,YAAY,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC5C,OAAO,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,WAAW,CAAC;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAqDlD,CAAC"}

package/dist/components/MkAccordion.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useCallback } from 'react';
+import styles from './MkAccordion.module.css';
+export const MkAccordion = ({ items = [], multiple = false, defaultExpanded = [], expanded: controlledExpanded, onChange, variant = 'default', className, }) => {
+    const [internalExpanded, setInternalExpanded] = useState(defaultExpanded);
+    const expandedKeys = controlledExpanded !== null && controlledExpanded !== void 0 ? controlledExpanded : internalExpanded;
+    const toggleItem = useCallback((key) => {
+        let next;
+        if (expandedKeys.includes(key)) {
+            next = expandedKeys.filter((k) => k !== key);
+        }
+        else {
+            next = multiple ? [...expandedKeys, key] : [key];
+        }
+        setInternalExpanded(next);
+        onChange === null || onChange === void 0 ? void 0 : onChange(next);
+    }, [expandedKeys, multiple, onChange]);
+    return (_jsx("div", { className: `${styles.accordion} ${styles[variant]} ${className || ''}`, children: items.map((item) => {
+            const isOpen = expandedKeys.includes(item.key);
+            return (_jsxs("div", { className: `${styles.item} ${isOpen ? styles.open : ''}`, children: [_jsxs("button", { className: styles.header, onClick: () => !item.disabled && toggleItem(item.key), disabled: item.disabled, "aria-expanded": isOpen, children: [_jsx("span", { className: styles.title, children: item.title }), _jsx("span", { className: `${styles.chevron} ${isOpen ? styles.chevronOpen : ''}`, children: _jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", children: _jsx("polyline", { points: "4 6 8 10 12 6" }) }) })] }), _jsx("div", { className: `${styles.body} ${isOpen ? styles.bodyOpen : ''}`, children: _jsx("div", { className: styles.content, children: item.content }) })] }, item.key));
+        }) }));
+};
+//# sourceMappingURL=MkAccordion.js.map

package/dist/components/MkAccordion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MkAccordion.js","sourceRoot":"","sources":["../../src/components/MkAccordion.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AACrD,OAAO,MAAM,MAAM,0BAA0B,CAAC;AAsC9C,MAAM,CAAC,MAAM,WAAW,GAA+B,CAAC,EACpD,KAAK,GAAG,EAAE,EACV,QAAQ,GAAG,KAAK,EAChB,eAAe,GAAG,EAAE,EACpB,QAAQ,EAAE,kBAAkB,EAC5B,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,SAAS,GACZ,EAAE,EAAE;IACD,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAW,eAAe,CAAC,CAAC;IACpF,MAAM,YAAY,GAAG,kBAAkB,aAAlB,kBAAkB,cAAlB,kBAAkB,GAAI,gBAAgB,CAAC;IAE5D,MAAM,UAAU,GAAG,WAAW,CAC1B,CAAC,GAAW,EAAE,EAAE;QACZ,IAAI,IAAc,CAAC;QACnB,IAAI,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;YAC7B,IAAI,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC;QACjD,CAAC;aAAM,CAAC;YACJ,IAAI,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,GAAG,YAAY,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;QACrD,CAAC;QACD,mBAAmB,CAAC,IAAI,CAAC,CAAC;QAC1B,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAG,IAAI,CAAC,CAAC;IACrB,CAAC,EACD,CAAC,YAAY,EAAE,QAAQ,EAAE,QAAQ,CAAC,CACrC,CAAC;IAEF,OAAO,CACH,cAAK,SAAS,EAAE,GAAG,MAAM,CAAC,SAAS,IAAI,MAAM,CAAC,OAAO,CAAC,IAAI,SAAS,IAAI,EAAE,EAAE,YACtE,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;YAChB,MAAM,MAAM,GAAG,YAAY,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YAC/C,OAAO,CACH,eAAoB,SAAS,EAAE,GAAG,MAAM,CAAC,IAAI,IAAI,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,aACxE,kBACI,SAAS,EAAE,MAAM,CAAC,MAAM,EACxB,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,IAAI,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,EACrD,QAAQ,EAAE,IAAI,CAAC,QAAQ,mBACR,MAAM,aAErB,eAAM,SAAS,EAAE,MAAM,CAAC,KAAK,YAAG,IAAI,CAAC,KAAK,GAAQ,EAClD,eAAM,SAAS,EAAE,GAAG,MAAM,CAAC,OAAO,IAAI,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,EAAE,YACpE,cAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAC,WAAW,EAAC,GAAG,EAAC,aAAa,EAAC,OAAO,YACnH,mBAAU,MAAM,EAAC,eAAe,GAAG,GACjC,GACH,IACF,EACT,cAAK,SAAS,EAAE,GAAG,MAAM,CAAC,IAAI,IAAI,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,EAAE,YAC7D,cAAK,SAAS,EAAE,MAAM,CAAC,OAAO,YAAG,IAAI,CAAC,OAAO,GAAO,GAClD,KAhBA,IAAI,CAAC,GAAG,CAiBZ,CACT,CAAC;QACN,CAAC,CAAC,GACA,CACT,CAAC;AACN,CAAC,CAAC"}

package/dist/components/MkAccordion.module.css

@@ -0,0 +1,79 @@
+.accordion { 
+    --mk-accordion-border: var(--mk-border);
+    --mk-accordion-bg: transparent;
+    --mk-accordion-header-hover: var(--mk-muted);
+    --mk-accordion-radius: var(--mk-radius, 8px);
+    --mk-accordion-color: var(--mk-foreground);
+    --mk-accordion-muted-color: var(--mk-muted-foreground);
+
+    width: 100%; 
+    color: var(--mk-accordion-color);
+}
+
+/* ── Default ── */
+.default .item { border-bottom: 1px solid var(--mk-accordion-border); }
+.default .item:last-child { border-bottom: none; }
+
+/* ── Bordered ── */
+.bordered { 
+    border: 1px solid var(--mk-accordion-border); 
+    border-radius: var(--mk-accordion-radius); 
+    overflow: hidden; 
+}
+.bordered .item + .item { border-top: 1px solid var(--mk-accordion-border); }
+
+/* ── Separated ── */
+.separated { display: flex; flex-direction: column; gap: 0.5rem; }
+.separated .item { 
+    border: 1px solid var(--mk-accordion-border); 
+    border-radius: var(--mk-accordion-radius); 
+    overflow: hidden; 
+}
+
+/* ── Header ── */
+.header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    width: 100%;
+    padding: 0.875rem 1rem;
+    background-color: var(--mk-accordion-bg);
+    border: none;
+    cursor: pointer;
+    color: inherit;
+    font-size: 0.9375rem;
+    font-weight: 500;
+    outline: none;
+    transition: background-color 0.15s ease;
+    text-align: left;
+}
+
+.header:hover { background-color: var(--mk-accordion-header-hover); }
+.header:focus-visible { box-shadow: inset 0 0 0 2px var(--mk-primary); }
+.header:disabled { opacity: 0.4; cursor: not-allowed; }
+
+.title { flex: 1; }
+
+.chevron {
+    display: flex;
+    color: var(--mk-accordion-muted-color);
+    transition: transform 0.2s ease;
+    flex-shrink: 0;
+}
+.chevronOpen { transform: rotate(180deg); }
+
+/* ── Body ── */
+.body {
+    max-height: 0;
+    overflow: hidden;
+    transition: max-height 0.25s ease;
+}
+
+.bodyOpen { max-height: 1000px; }
+
+.content {
+    padding: 0 1rem 1rem;
+    font-size: 0.875rem;
+    color: var(--mk-accordion-muted-color);
+    line-height: 1.6;
+}

package/dist/components/MkAccordion.stories.d.ts

@@ -0,0 +1,13 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { MkAccordion } from './MkAccordion';
+declare const meta: Meta<typeof MkAccordion>;
+export default meta;
+type Story = StoryObj<typeof MkAccordion>;
+export declare const Default: Story;
+export declare const Multiple: Story;
+export declare const WithDefaultExpanded: Story;
+export declare const Bordered: Story;
+export declare const Separated: Story;
+export declare const WithDisabledItem: Story;
+export declare const RichContent: Story;
+//# sourceMappingURL=MkAccordion.stories.d.ts.map

package/dist/components/MkAccordion.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MkAccordion.stories.d.ts","sourceRoot":"","sources":["../../src/components/MkAccordion.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CASlC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,WAAW,CAAC,CAAC;AAyB1C,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAEtB,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KAEjC,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAEtB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAEvB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAQ9B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAyBzB,CAAC"}

package/dist/components/MkAccordion.stories.js

@@ -0,0 +1,76 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { MkAccordion } from './MkAccordion';
+const meta = {
+    title: 'Components/MkAccordion',
+    component: MkAccordion,
+    parameters: { layout: 'padded' },
+    tags: ['autodocs'],
+    argTypes: {
+        multiple: { control: 'boolean' },
+        variant: { control: { type: 'select' }, options: ['default', 'bordered', 'separated'] },
+    },
+};
+export default meta;
+const FAQ_ITEMS = [
+    {
+        key: 'what',
+        title: '¿Qué es mk-director?',
+        content: _jsx("p", { children: "Es un framework full-stack para construir aplicaciones modulares con React y Laravel." }),
+    },
+    {
+        key: 'how',
+        title: '¿Cómo funciona?',
+        content: _jsx("p", { children: "Cada m\u00F3dulo expone una API p\u00FAblica (Api/*). La comunicaci\u00F3n inter-m\u00F3dulo pasa solo por ah\u00ED." }),
+    },
+    {
+        key: 'price',
+        title: '¿Cuánto cuesta?',
+        content: _jsx("p", { children: "Es open source bajo licencia MIT. Gratis para siempre." }),
+    },
+    {
+        key: 'support',
+        title: '¿Tienen soporte?',
+        content: _jsx("p", { children: "Soporte comunitario en GitHub Discussions. Para soporte empresarial, contactanos." }),
+    },
+];
+export const Default = {
+    args: { items: FAQ_ITEMS },
+};
+export const Multiple = {
+    args: { items: FAQ_ITEMS, multiple: true },
+};
+export const WithDefaultExpanded = {
+    args: { items: FAQ_ITEMS, defaultExpanded: ['how', 'price'] },
+};
+export const Bordered = {
+    args: { items: FAQ_ITEMS, variant: 'bordered' },
+};
+export const Separated = {
+    args: { items: FAQ_ITEMS, variant: 'separated', multiple: true },
+};
+export const WithDisabledItem = {
+    args: {
+        items: [
+            { key: 'a', title: 'Active item', content: _jsx("p", { children: "This one is clickable." }) },
+            { key: 'b', title: 'Disabled item', content: _jsx("p", { children: "This one is locked." }), disabled: true },
+            { key: 'c', title: 'Another active item', content: _jsx("p", { children: "Clickable too." }) },
+        ],
+    },
+};
+export const RichContent = {
+    args: {
+        items: [
+            {
+                key: 'features',
+                title: 'Features',
+                content: (_jsxs("ul", { children: [_jsx("li", { children: "Multi-tenant opt-in" }), _jsx("li", { children: "Storybook stories" }), _jsx("li", { children: "Module boundaries" })] })),
+            },
+            {
+                key: 'code',
+                title: 'Example code',
+                content: (_jsx("pre", { style: { background: '#f3f4f6', padding: 12, borderRadius: 4 }, children: _jsx("code", { children: `const greeting = 'Hello, mk-director!';` }) })),
+            },
+        ],
+    },
+};
+//# sourceMappingURL=MkAccordion.stories.js.map

package/dist/components/MkAccordion.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MkAccordion.stories.js","sourceRoot":"","sources":["../../src/components/MkAccordion.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,MAAM,IAAI,GAA6B;IACnC,KAAK,EAAE,wBAAwB;IAC/B,SAAS,EAAE,WAAW;IACtB,UAAU,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE;IAChC,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,QAAQ,EAAE;QACN,QAAQ,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE;QAChC,OAAO,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,OAAO,EAAE,CAAC,SAAS,EAAE,UAAU,EAAE,WAAW,CAAC,EAAE;KAC1F;CACJ,CAAC;AAEF,eAAe,IAAI,CAAC;AAGpB,MAAM,SAAS,GAAG;IACd;QACI,GAAG,EAAE,MAAM;QACX,KAAK,EAAE,sBAAsB;QAC7B,OAAO,EAAE,gHAA4F;KACxG;IACD;QACI,GAAG,EAAE,KAAK;QACV,KAAK,EAAE,iBAAiB;QACxB,OAAO,EAAE,+IAAkG;KAC9G;IACD;QACI,GAAG,EAAE,OAAO;QACZ,KAAK,EAAE,iBAAiB;QACxB,OAAO,EAAE,iFAA6D;KACzE;IACD;QACI,GAAG,EAAE,SAAS;QACd,KAAK,EAAE,kBAAkB;QACzB,OAAO,EAAE,4GAAwF;KACpG;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAU;IAC1B,IAAI,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE;CAC7B,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC3B,IAAI,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,IAAI,EAAE;CAC7C,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAU;IACtC,IAAI,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,EAAE;CAChE,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAU;IAC3B,IAAI,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,UAAU,EAAE;CAClD,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAU;IAC5B,IAAI,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,IAAI,EAAE;CACnE,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAU;IACnC,IAAI,EAAE;QACF,KAAK,EAAE;YACH,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,aAAa,EAAE,OAAO,EAAE,iDAA6B,EAAE;YAC1E,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,eAAe,EAAE,OAAO,EAAE,8CAA0B,EAAE,QAAQ,EAAE,IAAI,EAAE;YACzF,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,qBAAqB,EAAE,OAAO,EAAE,yCAAqB,EAAE;SAC7E;KACJ;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAU;IAC9B,IAAI,EAAE;QACF,KAAK,EAAE;YACH;gBACI,GAAG,EAAE,UAAU;gBACf,KAAK,EAAE,UAAU;gBACjB,OAAO,EAAE,CACL,yBACI,+CAA4B,EAC5B,6CAA0B,EAC1B,6CAA0B,IACzB,CACR;aACJ;YACD;gBACI,GAAG,EAAE,MAAM;gBACX,KAAK,EAAE,cAAc;gBACrB,OAAO,EAAE,CACL,cAAK,KAAK,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,EAAE,EAAE,YAAY,EAAE,CAAC,EAAE,YAC/D,yBAAO,yCAAyC,GAAQ,GACtD,CACT;aACJ;SACJ;KACJ;CACJ,CAAC"}

package/dist/components/MkAccordion.stories.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=MkAccordion.stories.test.d.ts.map

package/dist/components/MkAccordion.stories.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MkAccordion.stories.test.d.ts","sourceRoot":"","sources":["../../src/components/MkAccordion.stories.test.tsx"],"names":[],"mappings":""}

package/dist/components/MkAccordion.stories.test.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Smoke snapshot for MkAccordion — required by R-MK-002.
+ */
+import { describe, it, expect, afterEach } from 'vitest';
+import { render, cleanup } from '@testing-library/react';
+import { MkAccordion } from './MkAccordion';
+describe('MkAccordion story smoke', () => {
+    afterEach(cleanup);
+    it('renders with items', () => {
+        const { container } = render(_jsx(MkAccordion, { items: [
+                { key: 'a', title: 'First', content: _jsx("p", { children: "First content" }) },
+                { key: 'b', title: 'Second', content: _jsx("p", { children: "Second content" }) },
+            ] }));
+        expect(container.firstChild).toMatchSnapshot();
+    });
+});
+//# sourceMappingURL=MkAccordion.stories.test.js.map

package/dist/components/MkAccordion.stories.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MkAccordion.stories.test.js","sourceRoot":"","sources":["../../src/components/MkAccordion.stories.test.tsx"],"names":[],"mappings":";AAAA;;GAEG;AACH,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,QAAQ,CAAC,yBAAyB,EAAE,GAAG,EAAE;IACrC,SAAS,CAAC,OAAO,CAAC,CAAC;IAEnB,EAAE,CAAC,oBAAoB,EAAE,GAAG,EAAE;QAC1B,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CACxB,KAAC,WAAW,IACR,KAAK,EAAE;gBACH,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,wCAAoB,EAAE;gBAC3D,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,yCAAqB,EAAE;aAChE,GACH,CACL,CAAC;QACF,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,eAAe,EAAE,CAAC;IACnD,CAAC,CAAC,CAAC;AACP,CAAC,CAAC,CAAC"}

package/dist/components/MkAlert.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+/**
+ * @module MkAlert
+ * @description Inline alert banner for validation messages, warnings, and info.
+ * Not a toast — renders inline in the document flow.
+ *
+ * @example
+ * ```tsx
+ * <MkAlert variant="warning" title="Atención">
+ *   Esta acción no se puede deshacer.
+ * </MkAlert>
+ * ```
+ */
+export interface MkAlertProps {
+    variant?: 'info' | 'success' | 'warning' | 'error' | 'default';
+    title?: string;
+    children?: React.ReactNode;
+    icon?: React.ReactNode;
+    dismissible?: boolean;
+    onDismiss?: () => void;
+    action?: React.ReactNode;
+    className?: string;
+}
+export declare const MkAlert: React.FC<MkAlertProps>;
+//# sourceMappingURL=MkAlert.d.ts.map

package/dist/components/MkAlert.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MkAlert.d.ts","sourceRoot":"","sources":["../../src/components/MkAlert.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B;;;;;;;;;;;GAWG;AAEH,MAAM,WAAW,YAAY;IACzB,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;IAC/D,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAUD,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAgC1C,CAAC"}

package/dist/components/MkAlert.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import styles from './MkAlert.module.css';
+const DEFAULT_ICONS = {
+    info: 'ℹ️',
+    success: '✅',
+    warning: '⚠️',
+    error: '❌',
+    default: '🔔',
+};
+export const MkAlert = ({ variant = 'default', title, children, icon, dismissible = false, onDismiss, action, className, }) => {
+    const [dismissed, setDismissed] = React.useState(false);
+    const handleDismiss = () => {
+        setDismissed(true);
+        onDismiss === null || onDismiss === void 0 ? void 0 : onDismiss();
+    };
+    if (dismissed)
+        return null;
+    return (_jsxs("div", { className: `${styles.alert} ${styles[variant]} ${className || ''}`, role: "alert", children: [_jsx("span", { className: styles.icon, children: icon || DEFAULT_ICONS[variant] }), _jsxs("div", { className: styles.body, children: [title && _jsx("strong", { className: styles.title, children: title }), children && _jsx("p", { className: styles.content, children: children }), action && _jsx("div", { className: styles.action, children: action })] }), dismissible && (_jsx("button", { className: styles.dismiss, onClick: handleDismiss, "aria-label": "Cerrar", children: "\u2715" }))] }));
+};
+//# sourceMappingURL=MkAlert.js.map

package/dist/components/MkAlert.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MkAlert.js","sourceRoot":"","sources":["../../src/components/MkAlert.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,MAAM,MAAM,sBAAsB,CAAC;AA0B1C,MAAM,aAAa,GAA2B;IAC1C,IAAI,EAAE,IAAI;IACV,OAAO,EAAE,GAAG;IACZ,OAAO,EAAE,IAAI;IACb,KAAK,EAAE,GAAG;IACV,OAAO,EAAE,IAAI;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAA2B,CAAC,EAC5C,OAAO,GAAG,SAAS,EACnB,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,WAAW,GAAG,KAAK,EACnB,SAAS,EACT,MAAM,EACN,SAAS,GACZ,EAAE,EAAE;IACD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAExD,MAAM,aAAa,GAAG,GAAG,EAAE;QACvB,YAAY,CAAC,IAAI,CAAC,CAAC;QACnB,SAAS,aAAT,SAAS,uBAAT,SAAS,EAAI,CAAC;IAClB,CAAC,CAAC;IAEF,IAAI,SAAS;QAAE,OAAO,IAAI,CAAC;IAE3B,OAAO,CACH,eAAK,SAAS,EAAE,GAAG,MAAM,CAAC,KAAK,IAAI,MAAM,CAAC,OAAO,CAAC,IAAI,SAAS,IAAI,EAAE,EAAE,EAAE,IAAI,EAAC,OAAO,aACjF,eAAM,SAAS,EAAE,MAAM,CAAC,IAAI,YAAG,IAAI,IAAI,aAAa,CAAC,OAAO,CAAC,GAAQ,EACrE,eAAK,SAAS,EAAE,MAAM,CAAC,IAAI,aACtB,KAAK,IAAI,iBAAQ,SAAS,EAAE,MAAM,CAAC,KAAK,YAAG,KAAK,GAAU,EAC1D,QAAQ,IAAI,YAAG,SAAS,EAAE,MAAM,CAAC,OAAO,YAAG,QAAQ,GAAK,EACxD,MAAM,IAAI,cAAK,SAAS,EAAE,MAAM,CAAC,MAAM,YAAG,MAAM,GAAO,IACtD,EACL,WAAW,IAAI,CACZ,iBAAQ,SAAS,EAAE,MAAM,CAAC,OAAO,EAAE,OAAO,EAAE,aAAa,gBAAa,QAAQ,uBAAW,CAC5F,IACC,CACT,CAAC;AACN,CAAC,CAAC"}

package/dist/components/MkAlert.module.css

@@ -0,0 +1,103 @@
+.alert {
+    --mk-alert-bg: var(--mk-muted);
+    --mk-alert-border: var(--mk-primary);
+    --mk-alert-color: var(--mk-foreground);
+
+    display: flex;
+    align-items: flex-start;
+    gap: 0.75rem;
+    padding: 0.875rem 1rem;
+    border-radius: var(--mk-radius, 8px);
+    border-left: 4px solid var(--mk-alert-border);
+    background-color: var(--mk-alert-bg);
+    color: var(--mk-alert-color);
+    transition: all 0.2s ease;
+}
+
+.icon {
+    font-size: 1.1rem;
+    flex-shrink: 0;
+    padding-top: 1px;
+    color: var(--mk-alert-border);
+}
+
+.body {
+    flex: 1;
+    min-width: 0;
+}
+.title {
+    display: block;
+    font-size: 0.9375rem;
+    font-weight: 600;
+    margin-bottom: 0.25rem;
+}
+.content {
+    margin: 0;
+    font-size: 0.875rem;
+    line-height: 1.5;
+}
+.action {
+    margin-top: 0.5rem;
+}
+
+.dismiss {
+    background: none;
+    border: none;
+    cursor: pointer;
+    font-size: 0.875rem;
+    flex-shrink: 0;
+    padding: 2px 4px;
+    border-radius: 4px;
+    line-height: 1;
+    color: currentColor;
+    opacity: 0.6;
+    transition: opacity 0.15s;
+}
+.dismiss:hover {
+    opacity: 1;
+    background-color: rgba(0, 0, 0, 0.05);
+}
+
+/* Variants - solid tinted backgrounds (12% color, not 90% transparent) */
+.info {
+    --mk-alert-border: #3b82f6;
+    --mk-alert-bg: color-mix(in srgb, #3b82f6 12%, var(--mk-background));
+    --mk-alert-color: #1e3a5f;
+}
+
+.success {
+    --mk-alert-border: #22c55e;
+    --mk-alert-bg: color-mix(in srgb, #22c55e 12%, var(--mk-background));
+    --mk-alert-color: #14532d;
+}
+
+.warning {
+    --mk-alert-border: #f59e0b;
+    --mk-alert-bg: color-mix(in srgb, #f59e0b 12%, var(--mk-background));
+    --mk-alert-color: #78350f;
+}
+
+.error {
+    --mk-alert-border: #ef4444;
+    --mk-alert-bg: color-mix(in srgb, #ef4444 12%, var(--mk-background));
+    --mk-alert-color: #7f1d1d;
+}
+
+.default {
+    --mk-alert-border: var(--mk-primary);
+    --mk-alert-bg: var(--mk-muted);
+}
+
+/* Dark mode overrides */
+.mk-dark .info {
+    --mk-alert-color: #bfdbfe;
+}
+.mk-dark .success {
+    --mk-alert-color: #bbf7d0;
+}
+.mk-dark .warning {
+    --mk-alert-color: #fde68a;
+}
+.mk-dark .error {
+    --mk-alert-color: #fecaca;
+}

package/dist/components/MkAlert.stories.d.ts

@@ -0,0 +1,13 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { MkAlert } from './MkAlert';
+declare const meta: Meta<typeof MkAlert>;
+export default meta;
+type Story = StoryObj<typeof MkAlert>;
+export declare const Info: Story;
+export declare const Success: Story;
+export declare const Warning: Story;
+export declare const Error: Story;
+export declare const DefaultVariant: Story;
+export declare const Dismissible: Story;
+export declare const WithAction: Story;
+//# sourceMappingURL=MkAlert.stories.d.ts.map

package/dist/components/MkAlert.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MkAlert.stories.d.ts","sourceRoot":"","sources":["../../src/components/MkAlert.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,OAAO,CAe9B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,OAAO,CAAC,CAAC;AAEtC,eAAO,MAAM,IAAI,EAAE,KAMlB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,KAMnB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAI5B,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAOzB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAmBxB,CAAC"}