@tsiky/components-r19 1.3.0 → 1.3.2

package/src/components/TrendList/TrendList.tsx

@@ -1,72 +0,0 @@
-import React from 'react';
-import './TrendList.css';
-import { TrendItem } from '../TrendItem/TrendItem';
-import type { TrendItemProps } from '../TrendItem/TrendItem';
-import { Move } from 'lucide-react';
-
-type TrendListProps = {
-  items: TrendItemProps[];
-  header?: string;
-  headerStyle?: React.CSSProperties;
-  listStyle?: React.CSSProperties;
-  size?: number | string;
-  gap?: number;
-  className?: string;
-  background?: string;
-  draggable?: boolean; // nouvelle prop
-};
-
-export const TrendList: React.FC<TrendListProps> = ({
-  items,
-  header = 'Tendance',
-  headerStyle,
-  listStyle,
-  size,
-  gap = 0,
-  className = '',
-  background = 'var(--color-card-background)',
-  draggable = false,
-}) => {
-  return (
-    <div
-      className={`trend-list ${className}`}
-      style={{
-        width: size,
-        gap: `${gap}px`,
-        background,
-        position: 'relative', // nécessaire pour overlay
-        ...listStyle,
-      }}
-    >
-      <h3 className='trend-header' style={headerStyle}>
-        {header}
-      </h3>
-
-      {/* Liste réelle */}
-      <div style={{ opacity: draggable ? 0 : 1 }}>
-        {items.map((item, idx) => (
-          <TrendItem key={idx} {...item} />
-        ))}
-      </div>
-
-      {/* Overlay Move */}
-      {draggable && (
-        <div
-          style={{
-            position: 'absolute',
-            top: 0,
-            left: 0,
-            width: '100%',
-            height: '100%',
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-            pointerEvents: 'none', // laisse passer les événements si nécessaire
-          }}
-        >
-          <Move size={48} strokeWidth={1.5} style={{ opacity: 0.8 }} />
-        </div>
-      )}
-    </div>
-  );
-};

package/src/components/TrendList/index.ts

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

package/src/components/theme/ThemeSwitcherButton.tsx

@@ -1,64 +0,0 @@
-'use client';
-import { useEffect, useState } from 'react';
-import { useThemeSwitcher } from './context/useThemeSwitcher';
-import { Switcher } from '../Switcher/Switcher';
-
-export interface ThemeSwitcherButtonProps {
-  lightTheme?: string;
-  darkTheme?: string;
-  leftIcon?: string;
-  rightIcon?: string;
-  colors?: {
-    bg?: string;
-    activeBg?: string;
-    border?: string;
-    circle?: string;
-    icon?: string;
-    icon2?: string;
-  };
-  size?: number;
-}
-
-export const ThemeSwitcherButton = ({
-  lightTheme = 'light',
-  darkTheme = 'dark',
-  leftIcon = 'Sun',
-  rightIcon = 'Moon',
-  colors = {
-    bg: '#e5e7eb',
-    activeBg: '#3b82f6',
-    border: '#ffffff',
-    circle: '#ffffff',
-    icon: '#3b82f6',
-    icon2: '#ffffff',
-  },
-  size = 24,
-}: ThemeSwitcherButtonProps) => {
-  const { currentTheme, switchTheme } = useThemeSwitcher();
-  const [mounted, setMounted] = useState(false);
-
-  useEffect(() => {
-    setMounted(true);
-  }, []);
-
-  if (!mounted) return null;
-
-  const isDarkTheme = currentTheme === darkTheme;
-
-  const handleToggle = (checked: boolean) => {
-    switchTheme(checked ? darkTheme : lightTheme);
-  };
-
-  return (
-    <Switcher
-      leftIcon={leftIcon}
-      rightIcon={rightIcon}
-      checked={isDarkTheme}
-      onToggle={handleToggle}
-      colors={colors}
-      size={size}
-    />
-  );
-};
-
-export default ThemeSwitcherButton;

package/src/components/theme/context/ThemeContext.tsx

@@ -1,61 +0,0 @@
-'use client';
-import { createContext, useContext, useState, useCallback, useEffect } from 'react';
-import type { ReactNode } from 'react';
-
-interface ThemeContextType {
-  themeName: string;
-  setTheme: (themeName: string) => void;
-}
-
-const ThemeContext = createContext<ThemeContextType | undefined>(undefined);
-
-interface ThemeProviderProps {
-  children: ReactNode;
-  initialTheme: string;
-}
-
-export const ThemeProvider = ({ children, initialTheme }: ThemeProviderProps) => {
-  const [themeName, setThemeName] = useState<string>(() => {
-    if (typeof window !== 'undefined') {
-      try {
-        return localStorage.getItem('app-theme') || initialTheme;
-      } catch (error) {
-        console.error('Error reading theme from localStorage:', error);
-        return initialTheme;
-      }
-    }
-    return initialTheme;
-  });
-
-  useEffect(() => {
-    const htmlElement = document.documentElement;
-
-    htmlElement.removeAttribute('data-theme');
-
-    if (themeName && themeName !== 'default') {
-      htmlElement.setAttribute('data-theme', themeName);
-    }
-
-    if (typeof window !== 'undefined') {
-      try {
-        localStorage.setItem('app-theme', themeName);
-      } catch (error) {
-        console.error('Error saving theme to localStorage:', error);
-      }
-    }
-  }, [themeName]);
-
-  const setTheme = useCallback((newThemeName: string) => {
-    setThemeName(newThemeName);
-  }, []);
-
-  return <ThemeContext.Provider value={{ themeName, setTheme }}>{children}</ThemeContext.Provider>;
-};
-
-export const useThemeContext = () => {
-  const context = useContext(ThemeContext);
-  if (!context) {
-    throw new Error('useThemeContext must be used within a ThemeProvider');
-  }
-  return context;
-};

package/src/components/theme/context/useThemeSwitcher.ts

@@ -1,18 +0,0 @@
-import { useCallback } from 'react';
-import { useThemeContext } from './ThemeContext';
-
-export const useThemeSwitcher = () => {
-  const { themeName, setTheme } = useThemeContext();
-
-  const switchTheme = useCallback(
-    (newThemeName: string) => {
-      setTheme(newThemeName);
-    },
-    [setTheme]
-  );
-
-  return {
-    currentTheme: themeName,
-    switchTheme,
-  };
-};

package/src/components/theme/index.ts

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

package/src/index.css

@@ -1,68 +0,0 @@
-:root {
-  font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
-  line-height: 1.5;
-  font-weight: 400;
-
-  color-scheme: light dark;
-  color: rgba(255, 255, 255, 0.87);
-  background-color: #242424;
-
-  font-synthesis: none;
-  text-rendering: optimizeLegibility;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-a {
-  font-weight: 500;
-  color: #646cff;
-  text-decoration: inherit;
-}
-a:hover {
-  color: #535bf2;
-}
-
-body {
-  margin: 0;
-  display: flex;
-  place-items: center;
-  min-width: 320px;
-  min-height: 100vh;
-}
-
-h1 {
-  font-size: 3.2em;
-  line-height: 1.1;
-}
-
-button {
-  border-radius: 8px;
-  border: 1px solid transparent;
-  padding: 0.6em 1.2em;
-  font-size: 1em;
-  font-weight: 500;
-  font-family: inherit;
-  background-color: #1a1a1a;
-  cursor: pointer;
-  transition: border-color 0.25s;
-}
-button:hover {
-  border-color: #646cff;
-}
-button:focus,
-button:focus-visible {
-  outline: 4px auto -webkit-focus-ring-color;
-}
-
-@media (prefers-color-scheme: light) {
-  :root {
-    color: #213547;
-    background-color: #ffffff;
-  }
-  a:hover {
-    color: #747bff;
-  }
-  button {
-    background-color: #f9f9f9;
-  }
-}

package/src/main.tsx

@@ -1,10 +0,0 @@
-import { StrictMode } from 'react';
-import { createRoot } from 'react-dom/client';
-import './index.css';
-import App from './App.tsx';
-
-createRoot(document.getElementById('root')!).render(
-  <StrictMode>
-    <App />
-  </StrictMode>
-);

package/src/vite-env.d.ts

@@ -1 +0,0 @@
-/// <reference types="vite/client" />

package/tsconfig.app.json

@@ -1,27 +0,0 @@
-{
-  "compilerOptions": {
-    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
-    "target": "ES2022",
-    "useDefineForClassFields": true,
-    "lib": ["ES2022", "DOM", "DOM.Iterable"],
-    "module": "ESNext",
-    "skipLibCheck": true,
-
-    /* Bundler mode */
-    "moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
-    "verbatimModuleSyntax": true,
-    "moduleDetection": "force",
-    "noEmit": true,
-    "jsx": "react-jsx",
-
-    /* Linting */
-    "strict": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "erasableSyntaxOnly": true,
-    "noFallthroughCasesInSwitch": true,
-    "noUncheckedSideEffectImports": true
-  },
-  "include": ["src", "index.ts", "chart.ts"]
-}

package/tsconfig.json

@@ -1,4 +0,0 @@
-{
-  "files": [],
-  "references": [{ "path": "./tsconfig.app.json" }, { "path": "./tsconfig.node.json" }]
-}

package/tsconfig.node.json

@@ -1,25 +0,0 @@
-{
-  "compilerOptions": {
-    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
-    "target": "ES2023",
-    "lib": ["ES2023"],
-    "module": "ESNext",
-    "skipLibCheck": true,
-
-    /* Bundler mode */
-    "moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
-    "verbatimModuleSyntax": true,
-    "moduleDetection": "force",
-    "noEmit": true,
-
-    /* Linting */
-    "strict": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "erasableSyntaxOnly": true,
-    "noFallthroughCasesInSwitch": true,
-    "noUncheckedSideEffectImports": true
-  },
-  "include": ["vite.config.ts"]
-}

package/vite.config.ts

@@ -1,43 +0,0 @@
-/// <reference types="vitest/config" />
-import { defineConfig } from 'vite';
-import react from '@vitejs/plugin-react';
-
-// https://vite.dev/config/
-import path from 'node:path';
-import { fileURLToPath } from 'node:url';
-import { storybookTest } from '@storybook/addon-vitest/vitest-plugin';
-const dirname =
-  typeof __dirname !== 'undefined' ? __dirname : path.dirname(fileURLToPath(import.meta.url));
-
-// More info at: https://storybook.js.org/docs/next/writing-tests/integrations/vitest-addon
-export default defineConfig({
-  plugins: [react()],
-  test: {
-    projects: [
-      {
-        extends: true,
-        plugins: [
-          // The plugin will run tests for the stories defined in your Storybook config
-          // See options at: https://storybook.js.org/docs/next/writing-tests/integrations/vitest-addon#storybooktest
-          storybookTest({
-            configDir: path.join(dirname, '.storybook'),
-          }),
-        ],
-        test: {
-          name: 'storybook',
-          browser: {
-            enabled: true,
-            headless: true,
-            provider: 'playwright',
-            instances: [
-              {
-                browser: 'chromium',
-              },
-            ],
-          },
-          setupFiles: ['.storybook/vitest.setup.ts'],
-        },
-      },
-    ],
-  },
-});

package/vitest.shims.d.ts

@@ -1 +0,0 @@
-/// <reference types="@vitest/browser/providers/playwright" />