@diwacopilot/components-react 1.2.3 → 1.3.0

package/dist/server/index.d.ts

@@ -0,0 +1,91 @@
+/**
+ * @diwacopilot/components-react/server
+ *
+ * RSC-safe (React Server Component-safe) exports.
+ *
+ * These are pure function components that render Diwa custom element shells as
+ * plain HTML attributes. They do NOT import `createReactComponent`, do NOT call
+ * `defineCustomElements()`, and do NOT extend React.Component — so they are safe
+ * to import in Next.js Server Components (and any other RSC-compatible runtime).
+ *
+ * On the server they produce the correct HTML skeleton; the browser upgrades the
+ * custom elements and attaches shadow DOM once the Stencil bundle loads.
+ *
+ * Supported components (presentational / no event delegation or refs needed):
+ *   DHeading, DText, DDivider, DBadge, DIcon
+ *
+ * Interactive components (DButton, DInput*, DModal, DFlyout, …) are intentionally
+ * excluded — they rely on refs, DOM event delegation, and the custom element
+ * registry. Import them from '@diwacopilot/components-react' inside a 'use client'
+ * file as before.
+ */
+import React from 'react';
+type Theme = 'light' | 'dark';
+export type HeadingSize = 'display' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'inherit';
+export type HeadingTag = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'div';
+export type HeadingAlign = 'start' | 'center' | 'end';
+export type HeadingColor = 'primary' | 'secondary' | 'inherit';
+export type HeadingWeight = 'semibold' | 'bold';
+export interface DHeadingProps {
+    size?: HeadingSize;
+    tag?: HeadingTag;
+    weight?: HeadingWeight;
+    align?: HeadingAlign;
+    color?: HeadingColor;
+    theme?: Theme;
+    className?: string;
+    style?: React.CSSProperties;
+    children?: React.ReactNode;
+}
+export declare function DHeading({ size, tag, weight, align, color, theme, className, style, children, }: DHeadingProps): React.DOMElement<Record<string, unknown>, Element>;
+export type TextTag = 'p' | 'span' | 'div' | 'label' | 'li';
+export type TextSize = 'x-small' | 'small' | 'medium' | 'large' | 'x-large' | 'xx-large';
+export type TextWeight = 'regular' | 'semibold' | 'bold';
+export type TextAlign = 'start' | 'center' | 'end';
+export type TextColor = 'primary' | 'secondary' | 'tertiary' | 'inherit';
+export interface DTextProps {
+    tag?: TextTag;
+    size?: TextSize;
+    weight?: TextWeight;
+    align?: TextAlign;
+    color?: TextColor;
+    ellipsis?: boolean;
+    theme?: Theme;
+    className?: string;
+    style?: React.CSSProperties;
+    children?: React.ReactNode;
+}
+export declare function DText({ tag, size, weight, align, color, ellipsis, theme, className, style, children, }: DTextProps): React.DOMElement<Record<string, unknown>, Element>;
+export type DividerOrientation = 'horizontal' | 'vertical';
+export interface DDividerProps {
+    orientation?: DividerOrientation;
+    theme?: Theme;
+    className?: string;
+    style?: React.CSSProperties;
+}
+export declare function DDivider({ orientation, theme, className, style, }: DDividerProps): React.DOMElement<Record<string, unknown>, Element>;
+export type BadgeVariant = 'neutral' | 'accent' | 'success' | 'warning' | 'danger';
+export type BadgeSize = 'sm' | 'md';
+export interface DBadgeProps {
+    variant?: BadgeVariant;
+    size?: BadgeSize;
+    label?: string;
+    dot?: boolean;
+    theme?: Theme;
+    className?: string;
+    style?: React.CSSProperties;
+    children?: React.ReactNode;
+}
+export declare function DBadge({ variant, size, label, dot, theme, className, style, children, }: DBadgeProps): React.DOMElement<Record<string, unknown>, Element>;
+export interface DIconProps {
+    name: string;
+    size?: number;
+    color?: string;
+    label?: string;
+    theme?: Theme;
+    className?: string;
+    style?: React.CSSProperties;
+}
+export declare function DIcon({ name, size, color, label, theme, className, style, }: DIconProps): React.DOMElement<Record<string, unknown>, Element>;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/server/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/server/index.tsx"],"names":[],"mappings":"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"}

package/dist/server/index.js

@@ -0,0 +1,102 @@
+/**
+ * @diwacopilot/components-react/server
+ *
+ * RSC-safe (React Server Component-safe) exports.
+ *
+ * These are pure function components that render Diwa custom element shells as
+ * plain HTML attributes. They do NOT import `createReactComponent`, do NOT call
+ * `defineCustomElements()`, and do NOT extend React.Component — so they are safe
+ * to import in Next.js Server Components (and any other RSC-compatible runtime).
+ *
+ * On the server they produce the correct HTML skeleton; the browser upgrades the
+ * custom elements and attaches shadow DOM once the Stencil bundle loads.
+ *
+ * Supported components (presentational / no event delegation or refs needed):
+ *   DHeading, DText, DDivider, DBadge, DIcon
+ *
+ * Interactive components (DButton, DInput*, DModal, DFlyout, …) are intentionally
+ * excluded — they rely on refs, DOM event delegation, and the custom element
+ * registry. Import them from '@diwacopilot/components-react' inside a 'use client'
+ * file as before.
+ */
+import React from 'react';
+export function DHeading({ size = 'h2', tag, weight = 'bold', align = 'start', color = 'primary', theme = 'dark', className, style, children, }) {
+    const props = {
+        size,
+        weight,
+        align,
+        color,
+        theme,
+        suppressHydrationWarning: true,
+    };
+    if (tag !== undefined)
+        props['tag'] = tag;
+    if (className !== undefined)
+        props['class'] = className;
+    if (style !== undefined)
+        props['style'] = style;
+    return React.createElement('diwa-heading', props, children);
+}
+export function DText({ tag = 'p', size = 'small', weight = 'regular', align = 'start', color = 'primary', ellipsis = false, theme = 'dark', className, style, children, }) {
+    const props = {
+        tag,
+        size,
+        weight,
+        align,
+        color,
+        theme,
+        suppressHydrationWarning: true,
+    };
+    if (ellipsis)
+        props['ellipsis'] = true;
+    if (className !== undefined)
+        props['class'] = className;
+    if (style !== undefined)
+        props['style'] = style;
+    return React.createElement('diwa-text', props, children);
+}
+export function DDivider({ orientation = 'horizontal', theme = 'dark', className, style, }) {
+    const props = {
+        orientation,
+        theme,
+        suppressHydrationWarning: true,
+    };
+    if (className !== undefined)
+        props['class'] = className;
+    if (style !== undefined)
+        props['style'] = style;
+    return React.createElement('diwa-divider', props);
+}
+export function DBadge({ variant = 'neutral', size = 'md', label, dot = false, theme = 'dark', className, style, children, }) {
+    const props = {
+        variant,
+        size,
+        theme,
+        suppressHydrationWarning: true,
+    };
+    if (dot)
+        props['dot'] = true;
+    if (label !== undefined)
+        props['label'] = label;
+    if (className !== undefined)
+        props['class'] = className;
+    if (style !== undefined)
+        props['style'] = style;
+    return React.createElement('diwa-badge', props, children);
+}
+export function DIcon({ name, size = 24, color = 'currentColor', label, theme = 'dark', className, style, }) {
+    const props = {
+        name,
+        size,
+        color,
+        theme,
+        suppressHydrationWarning: true,
+    };
+    if (label !== undefined)
+        props['label'] = label;
+    if (className !== undefined)
+        props['class'] = className;
+    if (style !== undefined)
+        props['style'] = style;
+    return React.createElement('diwa-icon', props);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@diwacopilot/components-react",
-  "version": "1.2.3",
+  "version": "1.3.0",
   "description": "React wrapper package for Diwa Web Components.",
   "license": "MIT",
   "type": "module",
@@ -14,6 +14,10 @@
     ".": {
       "types": "./dist/index.d.ts",
       "import": "./dist/index.js"
+    },
+    "./server": {
+      "types": "./dist/server/index.d.ts",
+      "import": "./dist/server/index.js"
     }
   },
   "scripts": {