le-kit 0.1.1 → 0.1.3

package/dist/admin/index.d.ts

@@ -7,13 +7,11 @@ export { setAssetPath } from '../components/index';
 
 export { LeBox } from '../components/le-box';
 export { LeButton } from '../components/le-button';
-export { LeButton2 } from '../components/le-button2';
 export { LeCard } from '../components/le-card';
 export { LeCheckbox } from '../components/le-checkbox';
 export { LeComponent } from '../components/le-component';
 export { LeNumberInput } from '../components/le-number-input';
 export { LePopover } from '../components/le-popover';
-export { LePopover2 } from '../components/le-popover2';
 export { LePopup } from '../components/le-popup';
 export { LeRoundProgress } from '../components/le-round-progress';
 export { LeSlot } from '../components/le-slot';

package/dist/admin/index.js

@@ -11,13 +11,11 @@ export { setAssetPath } from '../components/index.js';
 // Component imports
 import { LeBox } from '../components/le-box.js';
 import { LeButton } from '../components/le-button.js';
-import { LeButton2 } from '../components/le-button2.js';
 import { LeCard } from '../components/le-card.js';
 import { LeCheckbox } from '../components/le-checkbox.js';
 import { LeComponent } from '../components/le-component.js';
 import { LeNumberInput } from '../components/le-number-input.js';
 import { LePopover } from '../components/le-popover.js';
-import { LePopover2 } from '../components/le-popover2.js';
 import { LePopup } from '../components/le-popup.js';
 import { LeRoundProgress } from '../components/le-round-progress.js';
 import { LeSlot } from '../components/le-slot.js';
@@ -30,13 +28,11 @@ import { LeTurntable } from '../components/le-turntable.js';
 export {
   LeBox,
   LeButton,
-  LeButton2,
   LeCard,
   LeCheckbox,
   LeComponent,
   LeNumberInput,
   LePopover,
-  LePopover2,
   LePopup,
   LeRoundProgress,
   LeSlot,
@@ -56,13 +52,11 @@ export function defineCustomElements(win = typeof window !== 'undefined' ? windo
   const components = [
     ['le-box', LeBox],
     ['le-button', LeButton],
-    ['le-button2', LeButton2],
     ['le-card', LeCard],
     ['le-checkbox', LeCheckbox],
     ['le-component', LeComponent],
     ['le-number-input', LeNumberInput],
     ['le-popover', LePopover],
-    ['le-popover2', LePopover2],
     ['le-popup', LePopup],
     ['le-round-progress', LeRoundProgress],
     ['le-slot', LeSlot],

package/dist/admin/loader.js

@@ -0,0 +1,9 @@
+/**
+ * Le-Kit Admin - Auto-registering entry point
+ * Import this file to automatically register all admin components
+ * 
+ * Usage: import 'le-kit/admin';
+ */
+import { defineCustomElements } from './index.js';
+defineCustomElements();
+export * from './index.js';

package/dist/core/components/index.js

@@ -5,12 +5,10 @@ export { LeBox, defineCustomElement as defineCustomElementLeBox } from './le-box
 export { LeButton, defineCustomElement as defineCustomElementLeButton } from './le-button.js';
 export { LeCard, defineCustomElement as defineCustomElementLeCard } from './le-card.js';
 export { LeCheckbox, defineCustomElement as defineCustomElementLeCheckbox } from './le-checkbox.js';
-export { LeComponent, defineCustomElement as defineCustomElementLeComponent } from './le-component.js';
 export { LeNumberInput, defineCustomElement as defineCustomElementLeNumberInput } from './le-number-input.js';
 export { LePopover, defineCustomElement as defineCustomElementLePopover } from './le-popover.js';
 export { LePopup, defineCustomElement as defineCustomElementLePopup } from './le-popup.js';
 export { LeRoundProgress, defineCustomElement as defineCustomElementLeRoundProgress } from './le-round-progress.js';
-export { LeSlot, defineCustomElement as defineCustomElementLeSlot } from './le-slot.js';
 export { LeStack, defineCustomElement as defineCustomElementLeStack } from './le-stack.js';
 export { LeStringInput, defineCustomElement as defineCustomElementLeStringInput } from './le-string-input.js';
 export { LeText, defineCustomElement as defineCustomElementLeText } from './le-text.js';

package/dist/core/index.d.ts

@@ -7,12 +7,10 @@ export { setAssetPath } from './stencil-runtime';
 
 export { LeBox } from './components/le-box';
 export { LeButton } from './components/le-button';
-export { LeButton2 } from './components/le-button2';
 export { LeCard } from './components/le-card';
 export { LeCheckbox } from './components/le-checkbox';
 export { LeNumberInput } from './components/le-number-input';
 export { LePopover } from './components/le-popover';
-export { LePopover2 } from './components/le-popover2';
 export { LePopup } from './components/le-popup';
 export { LeRoundProgress } from './components/le-round-progress';
 export { LeStack } from './components/le-stack';

package/dist/core/index.js

@@ -11,12 +11,10 @@ export { setAssetPath } from './stencil-runtime.js';
 // Component imports
 import { LeBox } from './components/le-box.js';
 import { LeButton } from './components/le-button.js';
-import { LeButton2 } from './components/le-button2.js';
 import { LeCard } from './components/le-card.js';
 import { LeCheckbox } from './components/le-checkbox.js';
 import { LeNumberInput } from './components/le-number-input.js';
 import { LePopover } from './components/le-popover.js';
-import { LePopover2 } from './components/le-popover2.js';
 import { LePopup } from './components/le-popup.js';
 import { LeRoundProgress } from './components/le-round-progress.js';
 import { LeStack } from './components/le-stack.js';
@@ -28,12 +26,10 @@ import { LeTurntable } from './components/le-turntable.js';
 export {
   LeBox,
   LeButton,
-  LeButton2,
   LeCard,
   LeCheckbox,
   LeNumberInput,
   LePopover,
-  LePopover2,
   LePopup,
   LeRoundProgress,
   LeStack,
@@ -52,12 +48,10 @@ export function defineCustomElements(win = typeof window !== 'undefined' ? windo
   const components = [
     ['le-box', LeBox],
     ['le-button', LeButton],
-    ['le-button2', LeButton2],
     ['le-card', LeCard],
     ['le-checkbox', LeCheckbox],
     ['le-number-input', LeNumberInput],
     ['le-popover', LePopover],
-    ['le-popover2', LePopover2],
     ['le-popup', LePopup],
     ['le-round-progress', LeRoundProgress],
     ['le-stack', LeStack],

package/dist/core/loader.js

@@ -0,0 +1,9 @@
+/**
+ * Le-Kit Core - Auto-registering entry point
+ * Import this file to automatically register all core components
+ * 
+ * Usage: import 'le-kit/core';
+ */
+import { defineCustomElements } from './index.js';
+defineCustomElements();
+export * from './index.js';

package/dist/docs.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2025-12-13T17:39:35",
+  "timestamp": "2025-12-14T06:18:11",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.38.3",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "le-kit",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "description": "Themable web components library with CMS admin mode support",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -15,10 +15,18 @@
       "types": "./dist/types/index.d.ts"
     },
     "./core": {
+      "import": "./dist/core/loader.js",
+      "types": "./dist/core/index.d.ts"
+    },
+    "./core/define": {
       "import": "./dist/core/index.js",
       "types": "./dist/core/index.d.ts"
     },
     "./admin": {
+      "import": "./dist/admin/loader.js",
+      "types": "./dist/admin/index.d.ts"
+    },
+    "./admin/define": {
       "import": "./dist/admin/index.js",
       "types": "./dist/admin/index.d.ts"
     },
@@ -31,13 +39,39 @@
       "require": "./loader/index.cjs",
       "types": "./loader/index.d.ts"
     },
-    "./themes": "./dist/themes/index.css",
-    "./themes/base": "./dist/themes/base.css",
-    "./themes/default": "./dist/themes/default.css",
-    "./themes/dark": "./dist/themes/dark.css",
-    "./themes/gradient": "./dist/themes/gradient.css",
-    "./themes/minimal": "./dist/themes/minimal.css",
-    "./themes/warm": "./dist/themes/warm.css"
+    "./themes/*.css": {
+      "style": "./dist/themes/*.css",
+      "default": "./dist/themes/*.css"
+    },
+    "./themes": {
+      "style": "./dist/themes/index.css",
+      "default": "./dist/themes/index.css"
+    },
+    "./themes/base": {
+      "style": "./dist/themes/base.css",
+      "default": "./dist/themes/base.css"
+    },
+    "./themes/default": {
+      "style": "./dist/themes/default.css",
+      "default": "./dist/themes/default.css"
+    },
+    "./themes/dark": {
+      "style": "./dist/themes/dark.css",
+      "default": "./dist/themes/dark.css"
+    },
+    "./themes/gradient": {
+      "style": "./dist/themes/gradient.css",
+      "default": "./dist/themes/gradient.css"
+    },
+    "./themes/minimal": {
+      "style": "./dist/themes/minimal.css",
+      "default": "./dist/themes/minimal.css"
+    },
+    "./themes/warm": {
+      "style": "./dist/themes/warm.css",
+      "default": "./dist/themes/warm.css"
+    },
+    "./dist/themes/*.css": "./dist/themes/*.css"
   },
   "repository": {
     "type": "git",

package/readme.md

@@ -21,7 +21,7 @@ npm install le-kit
 
 ## Quick Start
 
-### Option 1: Lazy Loading (Recommended)
+### Option 1: Lazy Loading (Recommended for Stencil apps)
 
 The easiest way to use Le-Kit. Components are automatically loaded on-demand.
 
@@ -42,36 +42,28 @@ The easiest way to use Le-Kit. Components are automatically loaded on-demand.
 </le-card>
 ```
 
-### Option 2: Standalone Components (Tree-shakeable)
+### Option 2: Core Build (No Admin Code)
 
-Import only the components you need for smaller bundle sizes.
+The core build has all CMS editing functionality stripped out at build time for the smallest possible bundle. Components are auto-registered on import.
 
 ```tsx
-// Import specific components
-import { defineCustomElement as defineCard } from 'le-kit/components/le-card';
-import { defineCustomElement as defineButton } from 'le-kit/components/le-button';
-
-// Register them
-defineCard();
-defineButton();
+// Auto-registers all core components
+import 'le-kit/core';
 ```
 
-### Option 3: Core Build (No Admin Code)
-
-The core build has all CMS editing functionality stripped out at build time for the smallest possible bundle.
+Or if you need to control when components are registered:
 
 ```tsx
-import { defineCustomElements } from 'le-kit/core';
+import { defineCustomElements } from 'le-kit/core/define';
 defineCustomElements();
 ```
 
-> **Note for Stencil apps**: If you're using le-kit in another Stencil project, use the lazy-loading import (`import 'le-kit'`) instead to avoid runtime conflicts.
-
-### Option 4: Admin Build (CMS Editing)
+### Option 3: Admin Build (CMS Editing)
 
 Includes full CMS editing capabilities with inline editing and property panels.
 
 ```tsx
+// Auto-registers all admin components
 import 'le-kit/admin';
 ```
 
@@ -82,28 +74,44 @@ import 'le-kit/admin';
 </html>
 ```
 
+### Option 4: Individual Components (Tree-shakeable)
+
+Import only the components you need for smaller bundle sizes.
+
+```tsx
+// Import specific components
+import { defineCustomElement as defineCard } from 'le-kit/components/le-card';
+import { defineCustomElement as defineButton } from 'le-kit/components/le-button';
+
+// Register them
+defineCard();
+defineButton();
+```
+
 ## Theming
 
-Le-Kit ships with several built-in themes. Import the base styles plus your preferred theme:
+Le-Kit ships with several built-in themes.
+
+### Via HTML link
 
 ```html
-<!-- Base tokens (required) -->
-<link rel="stylesheet" href="le-kit/dist/themes/base.css" />
-
-<!-- Choose a theme -->
-<link rel="stylesheet" href="le-kit/dist/themes/default.css" />
-<!-- or -->
-<link rel="stylesheet" href="le-kit/dist/themes/dark.css" />
-<link rel="stylesheet" href="le-kit/dist/themes/minimal.css" />
-<link rel="stylesheet" href="le-kit/dist/themes/warm.css" />
-<link rel="stylesheet" href="le-kit/dist/themes/gradient.css" />
+<!-- From node_modules -->
+<link rel="stylesheet" href="node_modules/le-kit/dist/themes/base.css" />
+<link rel="stylesheet" href="node_modules/le-kit/dist/themes/default.css" />
+
+<!-- Or use a CDN like unpkg -->
+<link rel="stylesheet" href="https://unpkg.com/le-kit/dist/themes/base.css" />
+<link rel="stylesheet" href="https://unpkg.com/le-kit/dist/themes/default.css" />
 ```
 
-Or import in JavaScript:
+Available themes: `default`, `dark`, `minimal`, `warm`, `gradient`
+
+### Via JavaScript/CSS import
 
 ```tsx
-import 'le-kit/themes/base';
-import 'le-kit/themes/default';
+// With a bundler that handles CSS imports
+import 'le-kit/dist/themes/base.css';
+import 'le-kit/dist/themes/default.css';
 ```
 
 ### Custom Theming