kynjal-cli 2.0.6

package/dist/registry/charts/radial-bar-chart.ts

@@ -0,0 +1,121 @@
+// templates/registry/charts/radial-bar-chart.ts
+// Registry configuration for radial-bar-chart component and demos
+
+export const radialBarChartRegistry = {
+  // Main radial-bar-chart component
+  'radial-bar-chart': {
+    name: 'radial-bar-chart',
+    description:
+      'A customizable radial bar chart component with smooth animations, gradient support, and center value display.',
+    type: 'registry:ui',
+    dependencies: [
+      'react-native-svg',
+      'react-native-reanimated',
+      'react-native-gesture-handler',
+    ],
+    registryDependencies: [],
+    hooks: ['useColor'],
+    theme: ['globals'],
+    files: [
+      {
+        type: 'registry:ui',
+        path: 'templates/components/charts/radial-bar-chart.tsx',
+        target: 'components/charts/radial-bar-chart.tsx',
+      },
+    ],
+    preview: {
+      light:
+        'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 61.MOV',
+      dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 61.MOV',
+    },
+  },
+
+  // Basic radial bar chart demo
+  'radial-bar-chart-demo': {
+    name: 'radial-bar-chart-demo',
+    description: 'A radial bar chart with smooth animations and center totals',
+    type: 'registry:example',
+    registryDependencies: ['radial-bar-chart', 'chart-container'],
+    hooks: [],
+    theme: [],
+    files: [
+      {
+        type: 'registry:example',
+        path: 'templates/demo/charts/radial-bar-chart/radial-bar-chart-demo.tsx',
+        target:
+          'components/demo/charts/radial-bar-chart/radial-bar-chart-demo.tsx',
+      },
+    ],
+    preview: {
+      light:
+        'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 61.MOV',
+      dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 61.MOV',
+    },
+  },
+
+  'radial-bar-chart-sample': {
+    name: 'radial-bar-chart-sample',
+    description: 'A sample radial bar chart with custom data',
+    type: 'registry:example',
+    registryDependencies: ['radial-bar-chart', 'chart-container'],
+    hooks: ['useColor'],
+    theme: [],
+    files: [
+      {
+        type: 'registry:example',
+        path: 'templates/demo/charts/radial-bar-chart/radial-bar-chart-sample.tsx',
+        target:
+          'components/demo/charts/radial-bar-chart/radial-bar-chart-sample.tsx',
+      },
+    ],
+    preview: {
+      light:
+        'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 27.MOV',
+      dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 27.MOV',
+    },
+  },
+
+  'radial-bar-chart-gradient': {
+    name: 'radial-bar-chart-gradient',
+    description: 'A radial bar chart with gradient effects',
+    type: 'registry:example',
+    registryDependencies: ['radial-bar-chart', 'chart-container'],
+    hooks: ['useColor'],
+    theme: [],
+    files: [
+      {
+        type: 'registry:example',
+        path: 'templates/demo/charts/radial-bar-chart/radial-bar-chart-gradient.tsx',
+        target:
+          'components/demo/charts/radial-bar-chart/radial-bar-chart-gradient.tsx',
+      },
+    ],
+    preview: {
+      light:
+        'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 26.MOV',
+      dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 26.MOV',
+    },
+  },
+
+  'radial-bar-chart-large': {
+    name: 'radial-bar-chart-large',
+    description: 'A radial bar chart with large dataset',
+    type: 'registry:example',
+    registryDependencies: ['radial-bar-chart', 'chart-container'],
+    hooks: [],
+    theme: [],
+    files: [
+      {
+        type: 'registry:example',
+        path: 'templates/demo/charts/radial-bar-chart/radial-bar-chart-large.tsx',
+        target:
+          'components/demo/charts/radial-bar-chart/radial-bar-chart-large.tsx',
+      },
+    ],
+    preview: {
+      light:
+        'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 30.MOV',
+      dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 30.MOV',
+    },
+  },
+};

package/dist/registry/charts/scatter-chart.d.ts

@@ -0,0 +1,88 @@
+export declare const scatterChartRegistry: {
+    'scatter-chart': {
+        name: string;
+        description: string;
+        type: string;
+        dependencies: string[];
+        registryDependencies: never[];
+        hooks: string[];
+        theme: string[];
+        files: {
+            type: string;
+            path: string;
+            target: string;
+        }[];
+        preview: {
+            light: string;
+            dark: string;
+        };
+    };
+    'scatter-chart-demo': {
+        name: string;
+        description: string;
+        type: string;
+        registryDependencies: string[];
+        hooks: never[];
+        theme: never[];
+        files: {
+            type: string;
+            path: string;
+            target: string;
+        }[];
+        preview: {
+            light: string;
+            dark: string;
+        };
+    };
+    'scatter-chart-sample': {
+        name: string;
+        description: string;
+        type: string;
+        registryDependencies: string[];
+        hooks: never[];
+        theme: never[];
+        files: {
+            type: string;
+            path: string;
+            target: string;
+        }[];
+        preview: {
+            light: string;
+            dark: string;
+        };
+    };
+    'scatter-chart-styled': {
+        name: string;
+        description: string;
+        type: string;
+        registryDependencies: string[];
+        hooks: string[];
+        theme: never[];
+        files: {
+            type: string;
+            path: string;
+            target: string;
+        }[];
+        preview: {
+            light: string;
+            dark: string;
+        };
+    };
+    'scatter-chart-large': {
+        name: string;
+        description: string;
+        type: string;
+        registryDependencies: string[];
+        hooks: never[];
+        theme: never[];
+        files: {
+            type: string;
+            path: string;
+            target: string;
+        }[];
+        preview: {
+            light: string;
+            dark: string;
+        };
+    };
+};

package/dist/registry/charts/scatter-chart.js

@@ -0,0 +1,106 @@
+// templates/registry/charts/scatter-chart.ts
+// Registry configuration for scatter-chart component and demos
+export const scatterChartRegistry = {
+    // Main scatter-chart component
+    'scatter-chart': {
+        name: 'scatter-chart',
+        description: 'A customizable scatter plot component with smooth animations and flexible styling for visualizing data relationships.',
+        type: 'registry:ui',
+        dependencies: [
+            'react-native-svg',
+            'react-native-reanimated',
+            'react-native-gesture-handler',
+        ],
+        registryDependencies: [],
+        hooks: ['useColor'],
+        theme: ['globals'],
+        files: [
+            {
+                type: 'registry:ui',
+                path: 'templates/components/charts/scatter-chart.tsx',
+                target: 'components/charts/scatter-chart.tsx',
+            },
+        ],
+        preview: {
+            light: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 48.MOV',
+            dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 48.MOV',
+        },
+    },
+    // Basic scatter chart demo
+    'scatter-chart-demo': {
+        name: 'scatter-chart-demo',
+        description: 'A scatter plot with smooth animations',
+        type: 'registry:example',
+        registryDependencies: ['scatter-chart', 'chart-container'],
+        hooks: [],
+        theme: [],
+        files: [
+            {
+                type: 'registry:example',
+                path: 'templates/demo/charts/scatter-chart/scatter-chart-demo.tsx',
+                target: 'components/demo/charts/scatter-chart/scatter-chart-demo.tsx',
+            },
+        ],
+        preview: {
+            light: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 48.MOV',
+            dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 48.MOV',
+        },
+    },
+    'scatter-chart-sample': {
+        name: 'scatter-chart-sample',
+        description: 'A sample scatter chart with various data points',
+        type: 'registry:example',
+        registryDependencies: ['scatter-chart', 'chart-container'],
+        hooks: [],
+        theme: [],
+        files: [
+            {
+                type: 'registry:example',
+                path: 'templates/demo/charts/scatter-chart/scatter-chart-sample.tsx',
+                target: 'components/demo/charts/scatter-chart/scatter-chart-sample.tsx',
+            },
+        ],
+        preview: {
+            light: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 23.MOV',
+            dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 23.MOV',
+        },
+    },
+    'scatter-chart-styled': {
+        name: 'scatter-chart-styled',
+        description: 'A customized scatter chart with custom colors and styling',
+        type: 'registry:example',
+        registryDependencies: ['scatter-chart', 'chart-container'],
+        hooks: ['useColor'],
+        theme: [],
+        files: [
+            {
+                type: 'registry:example',
+                path: 'templates/demo/charts/scatter-chart/scatter-chart-styled.tsx',
+                target: 'components/demo/charts/scatter-chart/scatter-chart-styled.tsx',
+            },
+        ],
+        preview: {
+            light: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 22.MOV',
+            dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 22.MOV',
+        },
+    },
+    'scatter-chart-large': {
+        name: 'scatter-chart-large',
+        description: 'A scatter chart with large dataset',
+        type: 'registry:example',
+        registryDependencies: ['scatter-chart', 'chart-container'],
+        hooks: [],
+        theme: [],
+        files: [
+            {
+                type: 'registry:example',
+                path: 'templates/demo/charts/scatter-chart/scatter-chart-large.tsx',
+                target: 'components/demo/charts/scatter-chart/scatter-chart-large.tsx',
+            },
+        ],
+        preview: {
+            light: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 39.MOV',
+            dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 39.MOV',
+        },
+    },
+};

package/dist/registry/charts/scatter-chart.ts

@@ -0,0 +1,117 @@
+// templates/registry/charts/scatter-chart.ts
+// Registry configuration for scatter-chart component and demos
+
+export const scatterChartRegistry = {
+  // Main scatter-chart component
+  'scatter-chart': {
+    name: 'scatter-chart',
+    description:
+      'A customizable scatter plot component with smooth animations and flexible styling for visualizing data relationships.',
+    type: 'registry:ui',
+    dependencies: [
+      'react-native-svg',
+      'react-native-reanimated',
+      'react-native-gesture-handler',
+    ],
+    registryDependencies: [],
+    hooks: ['useColor'],
+    theme: ['globals'],
+    files: [
+      {
+        type: 'registry:ui',
+        path: 'templates/components/charts/scatter-chart.tsx',
+        target: 'components/charts/scatter-chart.tsx',
+      },
+    ],
+    preview: {
+      light:
+        'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 48.MOV',
+      dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 48.MOV',
+    },
+  },
+
+  // Basic scatter chart demo
+  'scatter-chart-demo': {
+    name: 'scatter-chart-demo',
+    description: 'A scatter plot with smooth animations',
+    type: 'registry:example',
+    registryDependencies: ['scatter-chart', 'chart-container'],
+    hooks: [],
+    theme: [],
+    files: [
+      {
+        type: 'registry:example',
+        path: 'templates/demo/charts/scatter-chart/scatter-chart-demo.tsx',
+        target: 'components/demo/charts/scatter-chart/scatter-chart-demo.tsx',
+      },
+    ],
+    preview: {
+      light:
+        'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 48.MOV',
+      dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 48.MOV',
+    },
+  },
+
+  'scatter-chart-sample': {
+    name: 'scatter-chart-sample',
+    description: 'A sample scatter chart with various data points',
+    type: 'registry:example',
+    registryDependencies: ['scatter-chart', 'chart-container'],
+    hooks: [],
+    theme: [],
+    files: [
+      {
+        type: 'registry:example',
+        path: 'templates/demo/charts/scatter-chart/scatter-chart-sample.tsx',
+        target: 'components/demo/charts/scatter-chart/scatter-chart-sample.tsx',
+      },
+    ],
+    preview: {
+      light:
+        'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 23.MOV',
+      dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 23.MOV',
+    },
+  },
+
+  'scatter-chart-styled': {
+    name: 'scatter-chart-styled',
+    description: 'A customized scatter chart with custom colors and styling',
+    type: 'registry:example',
+    registryDependencies: ['scatter-chart', 'chart-container'],
+    hooks: ['useColor'],
+    theme: [],
+    files: [
+      {
+        type: 'registry:example',
+        path: 'templates/demo/charts/scatter-chart/scatter-chart-styled.tsx',
+        target: 'components/demo/charts/scatter-chart/scatter-chart-styled.tsx',
+      },
+    ],
+    preview: {
+      light:
+        'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 22.MOV',
+      dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 22.MOV',
+    },
+  },
+
+  'scatter-chart-large': {
+    name: 'scatter-chart-large',
+    description: 'A scatter chart with large dataset',
+    type: 'registry:example',
+    registryDependencies: ['scatter-chart', 'chart-container'],
+    hooks: [],
+    theme: [],
+    files: [
+      {
+        type: 'registry:example',
+        path: 'templates/demo/charts/scatter-chart/scatter-chart-large.tsx',
+        target: 'components/demo/charts/scatter-chart/scatter-chart-large.tsx',
+      },
+    ],
+    preview: {
+      light:
+        'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 39.MOV',
+      dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 39.MOV',
+    },
+  },
+};

package/dist/registry/charts/stacked-area-chart.d.ts

@@ -0,0 +1,88 @@
+export declare const stackedAreaChartRegistry: {
+    'stacked-area-chart': {
+        name: string;
+        description: string;
+        type: string;
+        dependencies: string[];
+        registryDependencies: never[];
+        hooks: string[];
+        theme: string[];
+        files: {
+            type: string;
+            path: string;
+            target: string;
+        }[];
+        preview: {
+            light: string;
+            dark: string;
+        };
+    };
+    'stacked-area-chart-demo': {
+        name: string;
+        description: string;
+        type: string;
+        registryDependencies: string[];
+        hooks: never[];
+        theme: never[];
+        files: {
+            type: string;
+            path: string;
+            target: string;
+        }[];
+        preview: {
+            light: string;
+            dark: string;
+        };
+    };
+    'stacked-area-chart-sample': {
+        name: string;
+        description: string;
+        type: string;
+        registryDependencies: string[];
+        hooks: never[];
+        theme: never[];
+        files: {
+            type: string;
+            path: string;
+            target: string;
+        }[];
+        preview: {
+            light: string;
+            dark: string;
+        };
+    };
+    'stacked-area-chart-styled': {
+        name: string;
+        description: string;
+        type: string;
+        registryDependencies: string[];
+        hooks: never[];
+        theme: never[];
+        files: {
+            type: string;
+            path: string;
+            target: string;
+        }[];
+        preview: {
+            light: string;
+            dark: string;
+        };
+    };
+    'stacked-area-chart-large': {
+        name: string;
+        description: string;
+        type: string;
+        registryDependencies: string[];
+        hooks: never[];
+        theme: never[];
+        files: {
+            type: string;
+            path: string;
+            target: string;
+        }[];
+        preview: {
+            light: string;
+            dark: string;
+        };
+    };
+};

package/dist/registry/charts/stacked-area-chart.js

@@ -0,0 +1,106 @@
+// templates/registry/charts/stacked-area-chart.ts
+// Registry configuration for stacked-area-chart component and demos
+export const stackedAreaChartRegistry = {
+    // Main stacked-area-chart component
+    'stacked-area-chart': {
+        name: 'stacked-area-chart',
+        description: 'A customizable stacked area chart component with smooth animations and gradient fills for visualizing multiple data series over time.',
+        type: 'registry:ui',
+        dependencies: [
+            'react-native-svg',
+            'react-native-reanimated',
+            'react-native-gesture-handler',
+        ],
+        registryDependencies: [],
+        hooks: ['useColor'],
+        theme: ['globals'],
+        files: [
+            {
+                type: 'registry:ui',
+                path: 'templates/components/charts/stacked-area-chart.tsx',
+                target: 'components/charts/stacked-area-chart.tsx',
+            },
+        ],
+        preview: {
+            light: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 20.MOV',
+            dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 20.MOV',
+        },
+    },
+    // Basic stacked area chart demo
+    'stacked-area-chart-demo': {
+        name: 'stacked-area-chart-demo',
+        description: 'A stacked area chart with smooth animations and gradient fills',
+        type: 'registry:example',
+        registryDependencies: ['stacked-area-chart', 'chart-container'],
+        hooks: [],
+        theme: [],
+        files: [
+            {
+                type: 'registry:example',
+                path: 'templates/demo/charts/stacked-area-chart/stacked-area-chart-demo.tsx',
+                target: 'components/demo/charts/stacked-area-chart/stacked-area-chart-demo.tsx',
+            },
+        ],
+        preview: {
+            light: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 20.MOV',
+            dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 20.MOV',
+        },
+    },
+    'stacked-area-chart-sample': {
+        name: 'stacked-area-chart-sample',
+        description: 'A sample stacked area chart with revenue data',
+        type: 'registry:example',
+        registryDependencies: ['stacked-area-chart', 'chart-container'],
+        hooks: [],
+        theme: [],
+        files: [
+            {
+                type: 'registry:example',
+                path: 'templates/demo/charts/stacked-area-chart/stacked-area-chart-sample.tsx',
+                target: 'components/demo/charts/stacked-area-chart/stacked-area-chart-sample.tsx',
+            },
+        ],
+        preview: {
+            light: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 24.MOV',
+            dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 24.MOV',
+        },
+    },
+    'stacked-area-chart-styled': {
+        name: 'stacked-area-chart-styled',
+        description: 'A customized stacked area chart with custom colors and styling',
+        type: 'registry:example',
+        registryDependencies: ['stacked-area-chart', 'chart-container'],
+        hooks: [],
+        theme: [],
+        files: [
+            {
+                type: 'registry:example',
+                path: 'templates/demo/charts/stacked-area-chart/stacked-area-chart-styled.tsx',
+                target: 'components/demo/charts/stacked-area-chart/stacked-area-chart-styled.tsx',
+            },
+        ],
+        preview: {
+            light: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 25.MOV',
+            dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 25.MOV',
+        },
+    },
+    'stacked-area-chart-large': {
+        name: 'stacked-area-chart-large',
+        description: 'A stacked area chart with large dataset',
+        type: 'registry:example',
+        registryDependencies: ['stacked-area-chart', 'chart-container'],
+        hooks: [],
+        theme: [],
+        files: [
+            {
+                type: 'registry:example',
+                path: 'templates/demo/charts/stacked-area-chart/stacked-area-chart-large.tsx',
+                target: 'components/demo/charts/stacked-area-chart/stacked-area-chart-large.tsx',
+            },
+        ],
+        preview: {
+            light: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 21.MOV',
+            dark: 'https://cdn.jsdelivr.net/gh/ahmedbna/bna-ui-demo/ScreenRecording_07-12-2025 21.MOV',
+        },
+    },
+};