@c15t/dev-tools 0.0.1-rc.10

package/dist/router/router.js

@@ -0,0 +1,124 @@
+'use client';
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE_lucide_react_f128bbbb__ from "lucide-react";
+import * as __WEBPACK_EXTERNAL_MODULE_motion_react_9decfa63__ from "motion/react";
+import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
+import * as __WEBPACK_EXTERNAL_MODULE__components_ui_expandable_tabs_js_ecd49e25__ from "../components/ui/expandable-tabs.js";
+import * as __WEBPACK_EXTERNAL_MODULE__components_ui_scroll_area_js_68572765__ from "../components/ui/scroll-area.js";
+import * as __WEBPACK_EXTERNAL_MODULE__dev_tool_js_649ec346__ from "../dev-tool.js";
+import * as __WEBPACK_EXTERNAL_MODULE__components_ui_badge_js_d7eff882__ from "../components/ui/badge.js";
+const tabs = [
+    {
+        title: 'Consents',
+        icon: __WEBPACK_EXTERNAL_MODULE_lucide_react_f128bbbb__.ToggleLeft
+    },
+    {
+        title: 'Compliance',
+        icon: __WEBPACK_EXTERNAL_MODULE_lucide_react_f128bbbb__.GanttChartSquare
+    }
+];
+function Router({ onClose: _onClose }) {
+    const privacyConsent = (0, __WEBPACK_EXTERNAL_MODULE__dev_tool_js_649ec346__.getStore)();
+    const [activeSection, setActiveSection] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)('Consents');
+    const handleTabChange = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((index)=>{
+        if (null !== index) setActiveSection(tabs[index].title);
+    }, []);
+    const renderingState = [
+        {
+            componentName: 'MarketingContent',
+            consentType: 'marketing'
+        },
+        {
+            componentName: 'AnalyticsContent',
+            consentType: 'measurement'
+        },
+        {
+            componentName: 'PersonalizationComponent',
+            consentType: 'ad_personalization'
+        }
+    ];
+    const contentItems = (()=>{
+        switch(activeSection){
+            case 'Consents':
+                return Object.entries(privacyConsent.consents).map(([name, value])=>({
+                        title: name,
+                        status: value ? 'Enabled' : 'Disabled'
+                    }));
+            case 'Compliance':
+                return Object.entries(privacyConsent.complianceSettings).map(([region, settings])=>({
+                        title: region,
+                        status: settings.enabled ? 'Active' : 'Inactive'
+                    }));
+            case 'Conditional':
+                return renderingState.map((item)=>({
+                        title: item.componentName,
+                        status: 'Rendered',
+                        details: `Requires: ${item.consentType}`
+                    }));
+            default:
+                return [];
+        }
+    })();
+    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
+        children: [
+            /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+                className: "border-b p-4",
+                children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__components_ui_expandable_tabs_js_ecd49e25__.ExpandableTabs, {
+                    tabs: Array.from(tabs),
+                    activeColor: "text-primary",
+                    className: "border-muted",
+                    onChange: handleTabChange
+                })
+            }),
+            /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__components_ui_scroll_area_js_68572765__.ScrollArea, {
+                className: "h-[300px]",
+                children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_motion_react_9decfa63__.motion.div, {
+                    className: "space-y-2 p-4",
+                    initial: {
+                        opacity: 0
+                    },
+                    animate: {
+                        opacity: 1
+                    },
+                    exit: {
+                        opacity: 0
+                    },
+                    children: contentItems.map((item, index)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE_motion_react_9decfa63__.motion.div, {
+                            className: "flex items-center justify-between rounded-lg border bg-card p-3",
+                            initial: {
+                                opacity: 0,
+                                y: 20
+                            },
+                            animate: {
+                                opacity: 1,
+                                y: 0
+                            },
+                            transition: {
+                                delay: 0.05 * index
+                            },
+                            children: [
+                                /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("div", {
+                                    className: "flex flex-col",
+                                    children: [
+                                        /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("span", {
+                                            className: "font-medium text-sm",
+                                            children: item.title
+                                        }),
+                                        item.details && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("span", {
+                                            className: "text-muted-foreground text-xs",
+                                            children: item.details
+                                        })
+                                    ]
+                                }),
+                                /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__components_ui_badge_js_d7eff882__.Badge, {
+                                    variant: 'Enabled' === item.status || 'Active' === item.status || 'active' === item.status || 'Rendered' === item.status ? 'default' : 'destructive',
+                                    children: item.status
+                                })
+                            ]
+                        }, `${activeSection}-${item.title}`))
+                })
+            })
+        ]
+    });
+}
+export { Router };

package/dist/styles/theme.css

@@ -0,0 +1,42 @@
+.c15t-devtool-wrapper-overlay {
+  --c15t-dev-tools-background: #fff;
+  --c15t-dev-tools-foreground: #171717;
+  --c15t-dev-tools-primary: #171717;
+  --c15t-dev-tools-primary-foreground: #fff;
+  --c15t-dev-tools-secondary: #f5f5f5;
+  --c15t-dev-tools-secondary-foreground: #171717;
+  --c15t-dev-tools-accent: #f5f5f5;
+  --c15t-dev-tools-accent-foreground: #171717;
+  --c15t-dev-tools-muted: #f5f5f5;
+  --c15t-dev-tools-muted-foreground: #5c5c5c;
+  --c15t-dev-tools-card: #fff;
+  --c15t-dev-tools-card-foreground: #171717;
+  --c15t-dev-tools-border: #ebebeb;
+  --c15t-dev-tools-input: #ebebeb;
+  --c15t-dev-tools-ring: #5c5c5c;
+  --c15t-dev-tools-destructive: #ef4343;
+  --c15t-dev-tools-destructive-foreground: #fff;
+  --c15t-dev-tools-overlay: #0003;
+}
+
+.dark .c15t-devtool-wrapper-overlay {
+  --c15t-dev-tools-background: #1a1a1a;
+  --c15t-dev-tools-foreground: #e6e6e6;
+  --c15t-dev-tools-primary: #e6e6e6;
+  --c15t-dev-tools-primary-foreground: #1a1a1a;
+  --c15t-dev-tools-secondary: #333;
+  --c15t-dev-tools-secondary-foreground: #e6e6e6;
+  --c15t-dev-tools-accent: #333;
+  --c15t-dev-tools-accent-foreground: #e6e6e6;
+  --c15t-dev-tools-muted: #333;
+  --c15t-dev-tools-muted-foreground: #999;
+  --c15t-dev-tools-card: #1a1a1a;
+  --c15t-dev-tools-card-foreground: #e6e6e6;
+  --c15t-dev-tools-border: #333;
+  --c15t-dev-tools-input: #333;
+  --c15t-dev-tools-ring: #999;
+  --c15t-dev-tools-destructive: #8d0c0c;
+  --c15t-dev-tools-destructive-foreground: #e6e6e6;
+  --c15t-dev-tools-overlay: #00000080;
+}
+

package/package.json

@@ -0,0 +1,49 @@
+{
+  "name": "@c15t/dev-tools",
+  "version": "0.0.1-rc.10",
+  "license": "GPL-3.0-only",
+  "type": "module",
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "browserslist": [
+    ">0.2%",
+    "not dead",
+    "not op_mini all"
+  ],
+  "dependencies": {
+    "@radix-ui/react-accordion": "1.2.3",
+    "@radix-ui/react-scroll-area": "^1.2.3",
+    "@radix-ui/react-slot": "1.1.2",
+    "@radix-ui/react-switch": "1.1.3",
+    "@radix-ui/react-tooltip": "^1.1.8",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "2.1.1",
+    "lucide-react": "^0.475.0",
+    "motion": "^12.4.7",
+    "react-draggable": "^4.4.6",
+    "tailwind-merge": "3.0.2",
+    "tsc-alias": "^1.8.10",
+    "usehooks-ts": "^3.1.1",
+    "zustand": "^5.0.3",
+    "c15t": "0.0.1-rc.10"
+  },
+  "devDependencies": {
+    "postcss": "^8.5.3",
+    "@c15t/typescript-config": "0.0.1-beta.1"
+  },
+  "peerDependencies": {
+    "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+    "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "rslib build",
+    "check-types": "tsc --noEmit",
+    "dev": "rslib build --watch",
+    "fmt": "pnpm biome format --write .",
+    "lint": "pnpm biome lint ./src"
+  }
+}

package/tsconfig.json

@@ -0,0 +1,12 @@
+{
+	"extends": "@c15t/typescript-config/react-library.json",
+	"compilerOptions": {
+		"baseUrl": ".",
+		"lib": ["dom", "dom.iterable", "esnext"],
+		"paths": {
+			"~/*": ["./src/*"]
+		}
+	},
+	"include": ["src"],
+	"exclude": ["node_modules"]
+}