@lancar/lxui 1.0.0 → 1.0.1

package/CHANGELOG.md

@@ -6,71 +6,231 @@ This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.htm
 
 ---
 
-## [1.0.0] — 2025-06-03
+## [1.0.1] — 2026-06-03
 
 ### Added
 
-#### CSS Components
-- `lx-divider` — horizontal & vertical dividers with optional text label, dashed, primary variants
-- `lx-chip` — interactive filter chips with color, size, dismiss, dot variants
-- `lx-tag` — square label-style tags with solid and soft color variants
-- `lx-steps` / `lx-step` — horizontal & vertical steppers (active / done / error states)
-- `lx-stat` — metric/KPI card with trend indicators (up/down), stat icon
-- `lx-file-drop` — drag-and-drop upload zone with file list
-- `lx-empty` — empty state component with icon, title, description
-- `lx-number-input` — +/− increment control
-- `lx-rating` — interactive and readonly star rating
-- `lx-callout` — notice/callout blocks (primary, success, warning, danger, info)
-- `lx-fab` — floating action button (fixed position)
-- `lx-back-top` — scroll-to-top button with auto show/hide
-- `lx-code-block` + `lx-code-copy` — code block with copy button
-- `lx-gradient-text`, `lx-gradient-primary/warm/cool/purple` — gradient helpers
-- `lx-animate-slide-*`, `lx-animate-zoom-in`, `lx-animate-bounce-in`, `lx-animate-pulse-ring` — animation utilities
-- `lx-delay-{100|200|300|500|700}` — animation delay helpers
-- Dark mode semantic overrides via `[data-mode="dark"]` and `.dark`
+#### Self-hosted Fonts (zero Google Fonts / CDN dependency)
+- **38 woff2 files** — 10 font families didownload dari Google Fonts
+- Struktur modular per kategori:
+  - `fonts/sans/` — Plus Jakarta Sans, Inter, Manrope, IBM Plex Sans
+  - `fonts/serif/` — Literata, Source Serif 4, Merriweather
+  - `fonts/accessibility/` — Atkinson Hyperlegible
+  - `fonts/mono/` — JetBrains Mono, Fira Code
+- Per-family CSS: `[family].css` + `[family].min.css` (individual @font-face)
+- Per-category CSS: `sans.css`, `serif.css`, `mono.css`, `accessibility.css`
+- Bundle: `fonts/fonts.css` + `fonts/fonts.min.css` (semua font)
+- `scripts/download-fonts.js` — script untuk re-download font
+
+#### Versioned Distribution Folders
+- `1.0.0/` — snapshot v1.0.0 (90 files: CSS + JS + types)
+- `1.0.1/` — snapshot v1.0.1 (90 files: CSS + JS + types)
+- `fonts/` — shared di root, tidak ikut versioning
+- `scripts/build.js version` — auto-generate versioned folder
+
+### Changed
+- Semua CDN links → jsDelivr `@1.0.1` (konsisten dengan versi npm)
+- Version string di semua source files: `v1.0.0` → `v1.0.1`
+- `package.json files[]` — hapus source unminified (lxui.css, lxui.rtl.css, lxui.js, lxui.esm.js, lxui.bundle.js)
+- `scripts/build.js` BANNER — update ke v1.0.1
 
-#### JavaScript
-- `Clipboard` — copy text with `execCommand` fallback for non-HTTPS contexts
-- `Counter` — animated number counter with easing + `IntersectionObserver` auto-start
-- `NumberInput` — keyboard-accessible +/− number control with min/max/step
-- `Rating` — interactive & readonly star rating component
-- `initLazy()` — `IntersectionObserver`-based lazy loading for images/iframes/backgrounds
-- `initBackTop()` — scroll-to-top auto show/hide
-- `initCodeCopy()` — code block copy button handler
-- `initFileDrops()` — drag-and-drop file zone with custom events (`lx.file.drop`, `lx.file.select`)
-
-#### Package
-- `lxui.esm.js` — proper ES Module with named and default exports
-- `lxui.esm.min.js` — minified ESM build
-- `types/index.d.ts` — full TypeScript declaration file
-- `package.json` — npm-ready manifest with `exports`, `files`, `browserslist`
-- `.npmignore` — excludes dev/build artifacts from published package
-- `CHANGELOG.md` — this file
-- `scripts/build.js` — reproducible build script
+### Fixed
+- Font `@font-face` URL pakai jsDelivr CDN (`@1.0.1`)
+- `.npmignore` — exclude `1.0.0/` dan `1.0.1/` version folders (terlalu besar untuk npm)
+
+### Usage — Fonts via jsDelivr
+```html
+<!-- Semua font self-hosted -->
+<link href="https://cdn.jsdelivr.net/npm/@lancar/lxui@1.0.1/fonts/fonts.min.css"
+      rel="stylesheet">
+
+<!-- Hanya sans-serif -->
+<link href="https://cdn.jsdelivr.net/npm/@lancar/lxui@1.0.1/fonts/sans/sans.min.css"
+      rel="stylesheet">
+
+<!-- Hanya Inter -->
+<link href="https://cdn.jsdelivr.net/npm/@lancar/lxui@1.0.1/fonts/sans/inter/inter.min.css"
+      rel="stylesheet">
+```
+
+---
+
+## [1.0.0] — 2026-06-03
+
+### Published
+- **npm:** `@lancar/lxui@1.0.0` — https://www.npmjs.com/package/@lancar/lxui
+- **jsDelivr CDN:** https://www.jsdelivr.com/package/npm/@lancar/lxui
+- **GitHub Release:** https://github.com/lancar-id/lxui/releases/tag/v1.0.0
+- 94 files · 212.8 KB packed · 1.0 MB unpacked
+
+> Package name `lxui` ditolak npm (mirip `lx-ui`); diterbitkan sebagai scoped `@lancar/lxui`.
+
+---
+
+### Added
+
+#### CSS Components (44 individual files — `css/components/`)
+- `accordion` — Collapse/expand panel dengan animasi height
+- `alert` — Dismissible alert dengan 6 warna variant
+- `animations` — Keyframe utilities: slide, zoom, bounce, pulse, spin
+- `avatar` — Gambar/inisial dengan status badge dan group
+- `back-top` — Scroll-to-top button dengan auto show/hide
+- `badge` — Inline label dengan solid, soft, dan outline variants
+- `breadcrumb` — Navigation breadcrumb
+- `button` — Full button system: solid, outline, ghost, link, group
+- `callout` — Notice/callout block dengan icon dan title
+- `card` — Content card dengan header, body, footer, overlay
+- `carousel` — Image slider dengan touch support dan sliding transform
+- `chip` — Interactive filter chip dengan dismiss button
+- `code-block` — Code block dengan copy button
+- `collapse` — Animated height collapse/expand
+- `compat` — `@supports` fallback untuk Safari < 15, Firefox lama
+- `dark-mode` — Semantic overrides untuk `[data-mode="dark"]`
+- `divider` — Horizontal/vertical divider dengan optional text
+- `dropdown` — Dropdown menu dengan dropup/dropend/dropstart
+- `empty` — Empty state dengan icon, title, description
+- `fab` — Floating Action Button
+- `file-drop` — Drag-and-drop upload zone
+- `forms` — Input, textarea, select, checkbox, radio, switch, range, validation
+- `kbd` — Keyboard shortcut display
+- `list-group` — Vertikal/horizontal list group
+- `modal` — Dialog modal dengan backdrop, focus trap, keyboard
+- `nav` — Navigation tabs dan pills
+- `navbar` — Responsive navbar dengan mobile toggle
+- `number-input` — +/− increment control
+- `offcanvas` — Drawer/offcanvas dari 4 arah
+- `pagination` — Page navigation
+- `popover` — Floating popover dengan title dan konten
+- `progress` — Progress bar dengan striped dan animasi
+- `rating` — Interactive/readonly star rating
+- `section` — Section/hero layout helpers
+- `skeleton` — Loading skeleton dengan wave dan pulse animasi
+- `spinner` — Border dan grow spinner dengan 4 ukuran
+- `stat` — Metric/KPI card dengan trend indicator
+- `steps` — Horizontal/vertical stepper (done/active/error)
+- `table` — Data table dengan striped, hover, bordered, compact
+- `tag` — Square label-style tag
+- `timeline` — Vertikal event timeline
+- `toast` — Static toast component (CSS-only)
+- `toggler` — Hamburger icon dengan animasi buka/tutup
+- `tooltip` — Floating tooltip dengan 4 posisi
+
+#### CSS Base & Layout
+- `css/base/reset.css` — CSS reset modern
+- `css/base/tokens.css` — Design tokens (brand colors, spacing, radius, shadow)
+- `css/base/tokens-extended.css` — Extended tokens (semantic aliases, gray scale)
+- `css/base/typography.css` — Heading, display, lead, blockquote, code
+- `css/base/utils.css` — Scroll lock, fade utility
+- `css/layout/grid.css` — 12-column CSS Grid system
+- `css/layout/utilities.css` — Display, flex, spacing, text, border, shadow, sizing
+- `css/index.css` — Full @import bundle (51 imports)
+
+#### JavaScript Modules (19 individual ESM files — `js/`)
+- `utils.js` — Shared helpers: `qs`, `qsa`, `on`, `off`, `emit`, `trap`
+- `modal.js` — Modal class dengan focus trap
+- `toast.js` — Toast notifications dengan 6 posisi
+- `collapse.js` — Animated collapse
+- `dropdown.js` — Dropdown dengan outside-click
+- `offcanvas.js` — Offcanvas/drawer
+- `tooltip.js` — Positioned tooltip
+- `popover.js` — Click popover
+- `tab.js` — Tab panel switcher
+- `carousel.js` — Image carousel dengan touch swipe
+- `scrollspy.js` — Active nav link berdasarkan scroll
+- `clipboard.js` — Copy to clipboard dengan execCommand fallback
+- `counter.js` — Animated number counter dengan IntersectionObserver
+- `number-input.js` — Keyboard-accessible +/− control
+- `rating.js` — Star rating component
+- `theme.js` — Theme/dark-mode manager
+- `breakpoint.js` — Responsive breakpoint utilities
+- `init.js` — Auto-init semua komponen via data attributes
+- `index.js` — Re-export semua modul
+
+#### Package & Tooling
+- `lxui.esm.js` / `lxui.esm.min.js` — Proper ES Module dengan named `export`
+- `types/index.d.ts` — TypeScript declarations lengkap (semua class + interface)
+- `package.json` — npm manifest dengan `exports` map 85 entry, `files[]`, `browserslist`
+- `.npmignore` — Excludes dev files dari npm package
+- `.eslintrc.json` — ESLint config (optional)
+- `.stylelintrc.json` — Stylelint config (optional)
+- `.prettierrc` — Prettier config (optional)
+- `jest.config.js` — Jest config dengan jsdom (optional)
+- `scripts/build.js` — Build script: `node scripts/build.js [css|js|all]`
+- `scripts/split.js` — Split source ke individual component files
+
+#### Documentation
+- `index.html` — Full dokumentasi page:
+  - Hero dengan CDN/npm/ESM install tabs
+  - 100 sidebar items × 10 group
+  - Fallback docs (bekerja tanpa server lokal)
+  - Smart script loader dengan CDN fallback
+  - Dark mode toggle
+  - Search (⌘K / Ctrl+K)
+  - Responsive sidebar mobile
+- `CHANGELOG.md` — Changelog ini
+
+---
 
 ### Fixed
 
 #### CSS
-- Removed `@import url('fonts.googleapis.com/...')` from `lxfonts.min.css` — zero external dependencies
-- Removed duplicate `*{box-sizing:border-box}` reset in grid section
-- Removed duplicate `.lx-order-*` utility declarations
-- Added `-webkit-backdrop-filter` to modal backdrop, offcanvas backdrop, loading overlay
-- Added `@-webkit-keyframes` for all 8 keyframe declarations (`lx-spin`, `lx-grow`, `lx-modal-in`, `lx-dropdown-in`, `lx-fadein`, `lx-skeleton-wave`, `lx-skeleton-pulse`, `lx-progress-stripes`)
-- Added `-webkit-linear-gradient` to skeleton shimmer
-- Added `@supports` fallbacks for `aspect-ratio` (Safari < 15), `inset`, and `gap`
-- Added `will-change: transform` to `.lx-carousel-inner`
+- Hapus `@import url('fonts.googleapis.com/...')` dari `lxfonts.min.css` — **zero external dependencies**
+- Hapus duplikat `*{box-sizing:border-box}` di grid section
+- Hapus duplikat `.lx-order-*` utility declarations
+- Tambah `-webkit-backdrop-filter` pada modal backdrop, offcanvas backdrop, loading overlay
+- Tambah `@-webkit-keyframes` untuk semua 8 keyframe declarations
+- Tambah `-webkit-linear-gradient` pada skeleton shimmer
+- Tambah `@supports` fallbacks untuk `aspect-ratio` (Safari < 15), `inset`, dan `gap`
+- Tambah `will-change: transform` pada `.lx-carousel-inner`
 
 #### JavaScript
-- Fixed `Carousel` not sliding — now uses `translateX` on `.lx-carousel-inner` instead of class toggle only
-- Added touch direction guard (ignores vertical swipes) in Carousel `_initTouch`
-- Added `transitionend` sliding guard to prevent overlapping animations
-
-### Build
-- `lxui.min.css` rebuilt via clean-css level-2 (115 KB → 97 KB, −16%)
-- `lxui.min.js` rebuilt via terser 2-pass (37 KB → 23 KB, −39%)
-- `lxui.rtl.min.css` rebuilt (95 KB → 75 KB, −21%)
-- `lxui.bundle.min.js` rebuilt (25 KB → 16 KB, −37%)
-- All individual `.min.css` files rebuilt with license banner
+- **XSS hardening** — `Toast.show()` dan `Popover._show()` diganti dari `innerHTML` ke DOM API + `textContent`
+- Fix `Carousel` — sliding via `translateX` pada `.lx-carousel-inner` (bukan hanya class toggle)
+- Tambah touch direction guard di Carousel `_initTouch()` (ignore vertical swipes)
+- Tambah `transitionend` sliding guard untuk mencegah overlap animation
+
+#### index.html
+- Ganti semua CDN `cdn.lancar.id` → jsDelivr dengan SRI integrity hash
+- Fix MIME type error — `lxmarked.min.js` dengan onerror CDN fallback
+- Fix race condition: hapus `defer` dari bundle script
+- Tambah `waitForMarked()` guard — init hanya setelah marked tersedia
+
+---
+
+### CDN (jsDelivr) — SRI Hashes sha384
+
+| File | Integrity |
+|---|---|
+| `lxui.min.css` | `sha384-Vzif+wDuE90qTTy1G5up0ueqPdC6vUOP6NecH8QpFIJhfHOoMB93jVkyxiv1vlnM` |
+| `lxui.min.js` | `sha384-D+ge+vXYWwFL+gTJSDc0ipylsiNn8JupyzsmH3SPiqZx8K7et+yig9SoiVhYRzZp` |
+| `lxui.bundle.min.js` | `sha384-7QH/Btek+SMRJjgwUj76BLTCXnoDWJk9Qv6t0vOVZE8G0BrV1/iWEKfhuiqHCRU8` |
+| `lxui.esm.min.js` | `sha384-4uwfs5UigfLMnj2BUvkkUu3bnKMBAvCfZEedJAvLfNZ2N0VIZ6xjTub5uuJkpQE7` |
+| `lxui.rtl.min.css` | `sha384-plKaGJovfJnBS7MMlAxezdUpmgDJC/k4rVDpfCn8NR9T8NLo6x45uGGtp+v2xWyy` |
+| `lxthemes.min.css` | `sha384-ReH/S5ERyCGxqDyyrDbK2Laon9kK2jbHOjWbSVn+xDtl8jM2tyiJf+kIYE9WkuJ1` |
+| `lxfonts.min.css` | `sha384-q/+4TIfVl2NGD8abj5nLW2FVcJQf+JV5Kzw5xvuTepbNCDX4nBtgD4gorSiTsf9o` |
+| `lxicons.min.css` | `sha384-oygDeMMbXY9AksdFbSdGWwjSDpAaZCxIDIEoJ1O3hEPSKf+VlmSLw7D4ZwGj35k+` |
+| `lxeditor.min.css` | `sha384-7MQ36JMdVn8IBcrOO1zV2srOxLrEM/ZyTDP/BJjNM6ith6xM+QLHkSc3LbasM6X6` |
+| `lx-grid.min.css` | `sha384-jjOu6Zuc28mqZQF9G2ugUl35cRYvCydP3kPVhgSqvHCWJHath2LPZd0HjcOn9CT0` |
+| `lx-utilities.min.css` | `sha384-uFJC/gi86M43+UspUd8HAOnOiv6ftVMPwGl9LZEXFyTAWvxv9WjRpXI90BZC5wM0` |
+| `lxmarked.min.js` | `sha384-ZKkPR/5Ojl6LJ/38kdNa7yLA7vzzdVk9ubqkCUasgDFeG+keMEHQliMj51pr7kU7` |
+
+---
+
+### Build Output
+
+| File | Size |
+|---|---|
+| `lxui.min.css` | 97 KB |
+| `lxui.rtl.min.css` | 75 KB |
+| `lxui.min.js` | 23 KB |
+| `lxui.esm.min.js` | 22 KB |
+| `lxui.bundle.min.js` | 16 KB |
+| `lxthemes.min.css` | 16 KB |
+| `lxicons.min.css` | 32 KB |
+| `lxeditor.min.css` | 8 KB |
+| `lxfonts.min.css` | 4 KB |
+| `lx-grid.min.css` | 6 KB |
+| `lx-utilities.min.css` | 19 KB |
 
 ---
 

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2025 lancar.id
+Copyright (c) 2025–2026 lancar.id
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal