@pixpilot/shadcn-ui 3.5.0 → 3.6.0

package/dist/absolute-fill/AbsoluteFill.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime5 from "react/jsx-runtime";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 import React from "react";
 
 //#region src/absolute-fill/AbsoluteFill.d.ts
@@ -10,7 +10,7 @@ import React from "react";
  */
 declare function AbsoluteFill(props: React.HTMLAttributes<HTMLDivElement> & {
   ref?: React.Ref<HTMLDivElement>;
-}): react_jsx_runtime5.JSX.Element;
+}): react_jsx_runtime0.JSX.Element;
 declare namespace AbsoluteFill {
   var displayName: string;
 }

package/dist/button/Button.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as react_jsx_runtime1 from "react/jsx-runtime";
 import { Button, Tooltip, TooltipContent, TooltipTrigger, buttonVariants } from "@pixpilot/shadcn";
 import React from "react";
 import { VariantProps } from "class-variance-authority";
@@ -27,7 +27,7 @@ interface ButtonProps extends React.ComponentProps<typeof Button>, VariantProps<
 }
 declare function Button$1(props: ButtonProps & {
   ref?: React.Ref<HTMLButtonElement>;
-}): react_jsx_runtime0.JSX.Element;
+}): react_jsx_runtime1.JSX.Element;
 declare namespace Button$1 {
   var displayName: string;
 }

package/dist/button-extended/ButtonExtended.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime3 from "react/jsx-runtime";
+import * as react_jsx_runtime5 from "react/jsx-runtime";
 import { Button, Tooltip, TooltipContent, TooltipTrigger, buttonVariants } from "@pixpilot/shadcn";
 import React from "react";
 import { VariantProps } from "class-variance-authority";
@@ -50,7 +50,7 @@ interface ButtonExtendedProps extends React.ComponentProps<typeof Button>, Varia
 }
 declare function ButtonExtended(props: ButtonExtendedProps & {
   ref?: React.Ref<HTMLButtonElement>;
-}): react_jsx_runtime3.JSX.Element;
+}): react_jsx_runtime5.JSX.Element;
 declare namespace ButtonExtended {
   var displayName: string;
 }

package/dist/card/Card.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime1 from "react/jsx-runtime";
+import * as react_jsx_runtime3 from "react/jsx-runtime";
 import { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "@pixpilot/shadcn";
 import React from "react";
 
@@ -6,10 +6,10 @@ import React from "react";
 declare function CardTitle$1({
   className,
   ...props
-}: React.ComponentProps<typeof CardTitle>): react_jsx_runtime1.JSX.Element;
+}: React.ComponentProps<typeof CardTitle>): react_jsx_runtime3.JSX.Element;
 declare function CardHeader$1({
   className,
   ...props
-}: React.ComponentProps<typeof CardHeader>): react_jsx_runtime1.JSX.Element;
+}: React.ComponentProps<typeof CardHeader>): react_jsx_runtime3.JSX.Element;
 //#endregion
 export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader$1 as CardHeader, CardTitle$1 as CardTitle };

package/dist/color-select/ColorSelect.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime4 from "react/jsx-runtime";
+import * as react_jsx_runtime2 from "react/jsx-runtime";
 import { Select, SelectContent } from "@pixpilot/shadcn";
 import React, { ComponentProps } from "react";
 
@@ -17,6 +17,6 @@ type BaseColorSelectProps = {
   keyboardMode?: 'cycle' | 'dropdown';
   className?: string;
 } & Omit<ComponentProps<typeof Select>, 'value' | 'onValueChange' | 'children'>;
-declare function ColorSelect(props: BaseColorSelectProps): react_jsx_runtime4.JSX.Element;
+declare function ColorSelect(props: BaseColorSelectProps): react_jsx_runtime2.JSX.Element;
 //#endregion
 export { BaseColorSelectProps, ColorSelect, ColorSelectOption };

package/dist/file-upload-inline/FileUploadInline.d.cts

@@ -1,10 +1,10 @@
 import { FileUploadInlineProps } from "./types.cjs";
-import * as react_jsx_runtime17 from "react/jsx-runtime";
+import * as react_jsx_runtime18 from "react/jsx-runtime";
 
 //#region src/file-upload-inline/FileUploadInline.d.ts
 /**
  * FileUploadInline - An inline file upload component using FileUpload primitives
  */
-declare function FileUploadInline(props: FileUploadInlineProps): react_jsx_runtime17.JSX.Element;
+declare function FileUploadInline(props: FileUploadInlineProps): react_jsx_runtime18.JSX.Element;
 //#endregion
 export { FileUploadInline };

package/dist/input/Input.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime18 from "react/jsx-runtime";
+import * as react_jsx_runtime17 from "react/jsx-runtime";
 import { InputProps } from "@pixpilot/shadcn";
 import * as React$1 from "react";
 
@@ -10,6 +10,6 @@ type InputProps$1 = InputProps & {
   prefixClassName?: string;
   suffixClassName?: string;
 };
-declare function Input(props: InputProps$1): react_jsx_runtime18.JSX.Element;
+declare function Input(props: InputProps$1): react_jsx_runtime17.JSX.Element;
 //#endregion
 export { Input, InputProps$1 as InputProps };

package/dist/rich-text-editor/RichTextEditor.cjs

@@ -135,7 +135,10 @@ const RichTextEditor = ({ value, onChange, extensions = defaultExtensions, edita
 			allowLinkTarget
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 			className: "flex-1 min-h-0 overflow-y-auto",
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__tiptap_react.EditorContent, { editor: editorInstance })
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__tiptap_react.EditorContent, {
+				editor: editorInstance,
+				"data-slot": "editor-content"
+			})
 		})]
 	});
 };

package/dist/rich-text-editor/RichTextEditor.d.cts

@@ -1,6 +1,6 @@
 import { ToolbarButtonTooltipMode } from "./ToolbarButton.cjs";
 import React from "react";
-import { Editor, Extension } from "@tiptap/core";
+import { Editor, Extensions } from "@tiptap/core";
 import { UseEditorOptions } from "@tiptap/react";
 
 //#region src/rich-text-editor/RichTextEditor.d.ts
@@ -39,9 +39,12 @@ interface RichTextEditorProps {
    */
   onChange?: (content: string) => void;
   /**
-   * Additional extensions to add to the editor
+   * Additional TipTap extensions to add to the editor. These are appended to
+   * the built-in extensions (StarterKit, Link, TextAlign, Placeholder), so you
+   * can plug in any TipTap `Extension`, `Node`, or `Mark` — official packages
+   * (e.g. `@tiptap/extension-highlight`) or your own custom ones.
    */
-  extensions?: Extension[];
+  extensions?: Extensions;
   /**
    * Whether the editor is editable
    * @default true

package/dist/rich-text-editor/RichTextEditor.d.ts

@@ -1,7 +1,7 @@
 import { ToolbarButtonTooltipMode } from "./ToolbarButton.js";
 import React from "react";
 import { UseEditorOptions } from "@tiptap/react";
-import { Editor, Extension } from "@tiptap/core";
+import { Editor, Extensions } from "@tiptap/core";
 
 //#region src/rich-text-editor/RichTextEditor.d.ts
 type EditorProps = Editor['options']['editorProps'];
@@ -39,9 +39,12 @@ interface RichTextEditorProps {
    */
   onChange?: (content: string) => void;
   /**
-   * Additional extensions to add to the editor
+   * Additional TipTap extensions to add to the editor. These are appended to
+   * the built-in extensions (StarterKit, Link, TextAlign, Placeholder), so you
+   * can plug in any TipTap `Extension`, `Node`, or `Mark` — official packages
+   * (e.g. `@tiptap/extension-highlight`) or your own custom ones.
    */
-  extensions?: Extension[];
+  extensions?: Extensions;
   /**
    * Whether the editor is editable
    * @default true

package/dist/rich-text-editor/RichTextEditor.js

@@ -126,7 +126,10 @@ const RichTextEditor = ({ value, onChange, extensions = defaultExtensions, edita
 			allowLinkTarget
 		}), /* @__PURE__ */ jsx("div", {
 			className: "flex-1 min-h-0 overflow-y-auto",
-			children: /* @__PURE__ */ jsx(EditorContent, { editor: editorInstance })
+			children: /* @__PURE__ */ jsx(EditorContent, {
+				editor: editorInstance,
+				"data-slot": "editor-content"
+			})
 		})]
 	});
 };

package/dist/rich-text-editor/mcp.js

@@ -25,7 +25,7 @@ const meta = {
 			defaultValue: "true"
 		},
 		toolbarItems: "Explicit toolbar items: predefined command strings, \"|\" separators, or custom button objects.",
-		extensions: "Additional TipTap extensions to add to the editor.",
+		extensions: "Additional TipTap extensions appended to the built-in ones (StarterKit, Link, TextAlign, Placeholder). Accepts any TipTap Extension, Node, or Mark — official packages or your own custom ones. See the \"Add a custom extension\" example.",
 		editorProps: "Custom TipTap editorProps merged into the defaults.",
 		slots: "Class overrides for the root, toolbar (and its buttons/separators), and content area.",
 		placeholder: "Placeholder text shown when the editor is empty.",
@@ -58,13 +58,56 @@ const meta = {
 		name: "@tiptap/starter-kit",
 		type: "peer"
 	}],
-	examples: [{
-		title: "Basic editor",
-		code: "<RichTextEditor value={html} onChange={setHtml} placeholder=\"Write something…\" />"
-	}, {
-		title: "Custom toolbar",
-		code: "<RichTextEditor value={html} onChange={setHtml} toolbarItems={[\"bold\", \"italic\", \"|\", \"bulletList\"]} />"
-	}],
+	examples: [
+		{
+			title: "Basic editor",
+			code: "<RichTextEditor value={html} onChange={setHtml} placeholder=\"Write something…\" />"
+		},
+		{
+			title: "Custom toolbar",
+			code: "<RichTextEditor value={html} onChange={setHtml} toolbarItems={[\"bold\", \"italic\", \"|\", \"bulletList\"]} />"
+		},
+		{
+			title: "Add an official extension",
+			code: `// npm i @tiptap/extension-highlight
+import Highlight from '@tiptap/extension-highlight';
+
+// Extensions are appended to the built-in ones (StarterKit, Link, TextAlign, Placeholder).
+<RichTextEditor value={html} onChange={setHtml} extensions={[Highlight]} />`
+		},
+		{
+			title: "Add a custom extension (Mark/Node/Extension) with a toolbar button",
+			code: `import { Mark, mergeAttributes } from '@tiptap/core';
+
+// Any Mark.create / Node.create / Extension.create result can be passed to \`extensions\`.
+const Highlight = Mark.create({
+  name: 'highlight',
+  parseHTML() {
+    return [{ tag: 'mark' }];
+  },
+  renderHTML({ HTMLAttributes }) {
+    return ['mark', mergeAttributes(HTMLAttributes), 0];
+  },
+});
+
+<RichTextEditor
+  value={html}
+  onChange={setHtml}
+  extensions={[Highlight]}
+  toolbarItems={[
+    'bold',
+    'italic',
+    '|',
+    {
+      icon: '🖍️',
+      tooltip: 'Highlight',
+      onClick: (editor) => editor.chain().focus().toggleMark('highlight').run(),
+      isActive: (editor) => editor.isActive('highlight'),
+    },
+  ]}
+/>`
+		}
+	],
 	keywords: [
 		"rich text",
 		"editor",

package/dist/tags-input/TagsInput.d.cts

@@ -1,6 +1,6 @@
 import { CommandOptionListItem } from "../command-option-list/CommandOptionList.cjs";
 import { TagsInputInline } from "./TagsInputInline.cjs";
-import * as react_jsx_runtime24 from "react/jsx-runtime";
+import * as react_jsx_runtime25 from "react/jsx-runtime";
 import { ComponentProps } from "react";
 
 //#region src/tags-input/TagsInput.d.ts
@@ -32,6 +32,6 @@ interface TagsInputProps extends Omit<ComponentProps<typeof TagsInputInline>, 'o
  * - Options support with dropdown (like Select)
  * - freeSolo mode for custom tags (like MUI Autocomplete)
  */
-declare function TagsInput(props: TagsInputProps): react_jsx_runtime24.JSX.Element;
+declare function TagsInput(props: TagsInputProps): react_jsx_runtime25.JSX.Element;
 //#endregion
 export { TagsInput, TagsInputProps };

package/dist/theme-toggle/ThemeModeSwitchInside.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime27 from "react/jsx-runtime";
+import * as react_jsx_runtime28 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeSwitchInside.d.ts
 type ThemeModeSwitchInsideSize = 'sm' | 'md' | 'lg';
@@ -26,7 +26,7 @@ interface ThemeModeSwitchInsideProps {
  * Icons are embedded within the switch control.
  * Pure component - requires value and onChange props.
  */
-declare function ThemeModeSwitchInside(props: ThemeModeSwitchInsideProps): react_jsx_runtime27.JSX.Element;
+declare function ThemeModeSwitchInside(props: ThemeModeSwitchInsideProps): react_jsx_runtime28.JSX.Element;
 declare namespace ThemeModeSwitchInside {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeSwitchOutside.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime28 from "react/jsx-runtime";
+import * as react_jsx_runtime27 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeSwitchOutside.d.ts
 interface ThemeModeSwitchOutsideProps {
@@ -23,7 +23,7 @@ interface ThemeModeSwitchOutsideProps {
  * Icons flank the switch control on either side.
  * Pure component - requires value and onChange props.
  */
-declare function ThemeModeSwitchOutside(props: ThemeModeSwitchOutsideProps): react_jsx_runtime28.JSX.Element;
+declare function ThemeModeSwitchOutside(props: ThemeModeSwitchOutsideProps): react_jsx_runtime27.JSX.Element;
 declare namespace ThemeModeSwitchOutside {
   var displayName: string;
 }

package/dist/theme-toggle/ThemeModeToggleButton.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime25 from "react/jsx-runtime";
+import * as react_jsx_runtime24 from "react/jsx-runtime";
 
 //#region src/theme-toggle/ThemeModeToggleButton.d.ts
 interface ThemeModeToggleButtonProps {
@@ -14,7 +14,7 @@ interface ThemeModeToggleButtonProps {
  * Light/Dark toggle button.
  * Pure component - toggles between light and dark.
  */
-declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime25.JSX.Element;
+declare function ThemeModeToggleButton(props: ThemeModeToggleButtonProps): react_jsx_runtime24.JSX.Element;
 declare namespace ThemeModeToggleButton {
   var displayName: string;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pixpilot/shadcn-ui",
   "type": "module",
-  "version": "3.5.0",
+  "version": "3.6.0",
   "description": "Custom UI components and utilities built with shadcn/ui.",
   "author": "m.doaie <m.doaie@hotmail.com>",
   "license": "MIT",
@@ -72,9 +72,9 @@
     "tsx": "^4.21.0",
     "typescript": "^5.9.3",
     "@internal/eslint-config": "0.3.0",
-    "@internal/prettier-config": "0.0.1",
-    "@internal/mcp": "0.0.0",
     "@internal/hooks": "0.0.0",
+    "@internal/mcp": "0.0.0",
+    "@internal/prettier-config": "0.0.1",
     "@internal/tsconfig": "0.1.0",
     "@internal/tsdown-config": "0.1.0",
     "@internal/vitest-config": "0.1.0"