Repository navigation
AdminKit 4.0.0 - #154
Merged
Merged
AdminKit 4.0.0#154
Conversation
Require Node 24 via .nvmrc and package.json engines. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Enforce Conventional Commits on commit-msg and run eslint and prettier on staged files in pre-commit. Hooks install through the prepare script. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Replace .eslintrc and babel-eslint with eslint.config.mjs (@eslint/js recommended, browser and node globals). Add prettier, .editorconfig and .gitattributes with LF line endings. Vendored jsvectormap map data in src/js/modules/vector-maps is excluded from both tools. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
npm ci in CI and reproducible local installs need a committed lockfile. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Replace the committed key with a YOUR_GOOGLE_MAPS_API_KEY placeholder. The old key must still be restricted or rotated in Google Cloud. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Move CONTRIBUTING.md to the repo root and rewrite it for the new setup, convert CHANGELOG.md to Keep a Changelog 1.1.0 with an Unreleased section, and add AGENTS.md with CLAUDE.md pointing at it. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
The Metalsmith pages, layouts, partials, inline scripts, helpers and
data that used to live in the separate adminkit-builder repo move into
src/ so this repo builds its own pages. Pages are .html (Vite only
treats .html as entries) and keep their frontmatter, layouts receive the
page through {{> @partial-block }}, the bundle is loaded as an ES module,
images move to public/img and are referenced as /img/, and the Google
Maps key is the YOUR_GOOGLE_MAPS_API_KEY placeholder. Helpers are ES
modules.
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Vite 8 builds every src/pages/*.html through vite-plugin-handlebars plus a small in-repo plugin for frontmatter and layouts, formats the output with js-beautify and emits js/app.js and css/app.css under the same names as before. The Sass deprecations that are still silenced all come from Bootstrap 5.3. Drops webpack, its loaders and plugins, Babel, core-js and cross-env. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
dist/ is the build output and stays gitignored. Vercel runs npm run build and deploys dist/. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Import chart.js/auto and move the global defaults to Chart.defaults.color and Chart.defaults.font.family. Bars get rounded tops through elements.bar.borderRadius, lines keep the 0.4 tension Chart.js 2 drew by default. Every chart config moves to the v4 options shape: scales.x/y, grid and border, plugins.legend and plugins.tooltip, cutout as a percentage. The .chart containers set an explicit height because Chart.js 3+ derives the canvas height from the container. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The API, class names and the template's overrides are unchanged; the stylesheet is imported by its exported file name. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The dashboard keeps its inline month calendar with the selected day, 45px tiles and today marker, now drawn by Vanilla Calendar Pro and coloured through its --vc-* custom properties. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
ESLint 10 passes with the existing flat config, so it comes along with @eslint/js 10 and autoprefixer 10.6. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
- The Chart.js module imports the theme module whose colours it reads while it evaluates, instead of relying on import order in app.js - browserslist matches the browsers Vite 8 actually compiles for (baseline widely available: Chrome and Edge 111, Firefox 114, Safari and iOS 16.4); the README browser table says the same - Fonts and images that go through the asset pipeline get a content hash so same-named files from different packages cannot overwrite each other; css/app.css keeps its name; .svg lands in img - The build throws when a page name clashes with a bundle entry name - The dev server reloads on added and removed layouts and partials too, and vite-plugin-handlebars' own reload is off so a change reloads once - The beautifier comment says what js-beautify does with inline scripts - release.yml scopes contents: write to the release job Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Markup uses data-lucide with Lucide's canonical names and js/app.js bundles only the 26 icons the templates use. The icons page becomes icons-lucide and lists every Lucide icon through a separate js/icons-all.js entry that shares no chunk with js/app.js; icons-feather redirects to it on Vercel. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Filter the 1,900+ icons by name and tag as you type. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
npm run lint now fails when a template uses a Lucide icon that src/js/modules/icons.js does not import, uses a deprecated alias, or when icons.js imports an icon no template uses. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
css/app.css gets a dark mode with AdminKit PRO's dark palette: Bootstrap's color modes with the dark values in 1-variables/_dark.scss, data-bs-theme on <html> picks the mode. Components use custom properties for colours that follow the mode (--bs-gray-*, which turn around in dark mode, and --ak-surface-bg) and color-mode(dark) rules where a component picks another colour. An inline script in <head> sets data-bs-theme from the stored mode (light, dark or auto) before the first paint; modules/color-mode.js changes it afterwards and follows the system setting in auto mode. The page title badge stays readable in both modes and the upgrade page no longer lists dark mode as PRO only. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
window.theme is built from the computed --bs-* and --ak-* properties of the current color mode instead of a hardcoded object, keeping its keys (white and black are inverted in dark mode), and adds id, name, body-bg, body-color and border-color. It is rebuilt when data-bs-theme changes and announced with an adminkit:themechange event on document. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Pages create their charts and the world map through adminkit.chartjs() and adminkit.vectorMap(), which take a function of window.theme and call it again with the new colours on adminkit:themechange: Chart.js charts get the new data, options and default colours, the map restyles its regions and markers. The dashboard calendar follows data-bs-theme through Vanilla Calendar Pro's themeAttrDetect. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
A Light / Dark / Auto dropdown before the user menu, in the pattern of getbootstrap.com: buttons with aria-pressed, the toggle's aria-label names the current mode and its icon shows it. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Vite emits ES module chunks. Loaded with a classic <script src>, as the npm package and the CDN are, their minified top-level declarations (e, t, n, ...) became window globals and could overwrite variables of other scripts. Wrap the self-contained bundles in a function scope at build time; the build fails if one of them ever gains an import or export. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Replace the deprecated .text-muted with .text-body-secondary and drop the IE-only rules. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Ported from AdminKit PRO with free plugins only. Pricing has monthly and annual plans in Bootstrap tabs (annual prices billed yearly) and written FAQ answers; the invoice is a receipt whose line items, discount and total add up, with a Print button. Print styles leave out the sidebar, navbar, footer and the upgrade badge. Sidebar entries follow PRO: Invoice after Profile, Pricing with the other pages before Blank. Free now has 20 pages. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The calendar kept Vanilla Calendar Pro's popup sizing: a 17rem minimum width, 1fr day columns with 1.875rem minimums and a padded header, wider than the quarter-width card from xxl up. The inline calendar now drops those minimums, shares its width over seven minmax(0, 1fr) columns and, in cards under 18rem (container query), uses smaller arrows, title and rows. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
PRO 4.0.0 counts the AI chat as a PRO feature; the comparison row reads No / Yes. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Retake every AdminKit PRO screenshot from PRO 4.0.0 (new dashboard names, the inline calendar that fits its card) and the README dashboard shots. The CRM dashboard joins the gallery; the DataTables shot no longer closes a notice PRO dropped. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…ys on phones The auth layout's .container has 6px padding ($container-padding-x is 0.75rem) while its .row keeps the 12px gutter margins, so the row stuck out 6px on each side. The row has no gutter now; the content keeps its place. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Rewrite the Unreleased section in the style of the released entries: one short imperative line per change a template user notices, without internal tooling. AGENTS.md and CONTRIBUTING.md describe the style. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
{{#push "scripts"}}...{{/push}} adds the block's output to a named stack and
{{stack "scripts"}} prints it in push order. The stacks live on @root, the
context of one page render, so pages never see each other's stacks in the
dev server or the build.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Every inline script moves next to the markup it drives, in a
{{#push "scripts"}} block that the layouts print with {{stack "scripts"}}
after js/app.js:
- a widget's script into the widget's partial, now grouped in
src/partials/charts/ and src/partials/dashboard/ (named by path,
e.g. dashboard/line-chart)
- a page's script, and the icons page's bundle, at the end of the page
src/scripts, site-scripts.hbs and the scripts partial directory are gone;
check-icons names partials by their path.
The built pages keep their markup and scripts; on the dashboard the inline
scripts now follow document order.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
AGENTS.md gains a "Page scripts" section: page scripts at the end of the page, widget scripts in the widget's partial, push and stack, and the DOMContentLoaded rule. README points at the new places. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The PRO snapshot already carries PRO's final names and counts (stats:sync leaves it unchanged). The PRO screenshots are retaken from the current PRO release, so the analytics shots show the "Analytics" name, and the README dashboard shots are retaken with them. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The color mode and the reveal flag were two inline scripts in <head>. They are now one small blocking classic script, built as its own Vite entry and wrapped like js/app.js, so pages need no 'unsafe-inline' and the file is cached, linted and minified. The build fails if js/head.js gains an import. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…dded later Icons, the sidebar toggle, SimpleBar, the color mode controls, reveal and count-up were set up once on DOMContentLoaded, and createIcons replaced each <i data-lucide> with an <svg>. Frameworks had to call createIcons after every navigation, lost the custom scrollbar, rebuilt the sidebar toggle and crashed when they removed an <i> that was gone. mount(selector, setup) sets markup up on DOMContentLoaded (or at once when app.js loads later) and through one MutationObserver on <body> when it is added later; changing data-lucide renders the new icon. SimpleBar and the sidebar sheet are disposed when their element is removed. Icons render as an <svg> child of the <i>, which gets display: contents once it is filled, so the layout is unchanged. lucide.createIcons() renders the same way and is no longer needed. The sidebar toggle and link handlers listen on document. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Turbo Drive and Astro's view transitions replace <body>, which took the MutationObserver's target with it: icons and SimpleBar stayed unset after such a navigation. Observe <html> instead, so the new body is an added element like any other. A late import (a client-only plugin, an effect) also starts right away when the navigation entry is missing, instead of waiting for a DOMContentLoaded that has already fired. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Next.js, Nuxt, SvelteKit, Astro and Angular evaluate imports on the server, where there is no window. The classic-script wrapper now returns early there, so js/app.js, js/head.js and js/icons-all.js do nothing instead of throwing. With no import or export the bundles parse as a classic script, an ES module and a CommonJS module alike. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
- exports: "@adminkit/core" (dist/js/app.js), "@adminkit/core/css", "@adminkit/core/head", and "./dist/*" so every 3.x deep import and CDN path keeps working; main, types, style and sideEffects - dist/js/app.d.ts declares the side-effect import, the theme type and the globals js/app.js adds; dist/css/app.d.css.ts lets TypeScript 6 (noUncheckedSideEffectImports) resolve the stylesheet import - sideEffects lists every .css and .js file: a narrower list made the build tree-shake its own modules - allowScripts lets npm 11.19 run lefthook's install script Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Turbo and Astro remove the old sidebar while a link click is still
closing its sheet. Disposing the Offcanvas then broke Bootstrap's
transition callback ("Cannot read properties of null"); the sheet now
finishes its transition before it is disposed.
Astro's view transitions give <html> the new page's attributes, which
dropped data-bs-theme. The color mode is set again when it disappears.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Load Inter with font-display: swap instead of optional, so pages no longer stay in Arial when the font arrives late. Clip .main instead of hiding its overflow. overflow: hidden made it a scroll container, so position: sticky inside the page never stuck. Slide dropdown menus in with translate instead of a held transform, which overrode the transform Popper positions menus with. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
10BC8
Port the redesigned pages from AdminKit PRO: an invoice with status, billing details, totals, payment details, an activity list and a send dialog; three plans with a billing switch, a sticky comparison table and an FAQ; a profile with stats, about and skills, team, projects and activity. Links to PRO-only pages are dropped: the Edit profile button, All projects and the project and task links in the activity feed. The team message buttons send an email instead of opening the chat page. Port the light badges, .progress-sm and Bootstrap's progress component the pages use. Printing keeps the page white and the invoice in light colors in dark mode. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Open with a hero that says what PRO adds, with the counts from the stats, a CRM screenshot and two calls to action: pricing and the PRO live demo. The PRO screenshots follow in a three-column grid with shorter captions, then the generated comparison with the PRO column tinted, the license tiers in one line and a short FAQ. Describe capabilities instead of naming plugins, so the copy stays true when plugins change. The screenshot partial takes an image class and sizes for the hero. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The list group uses PRO's surface background and padding, so the ported profile team list and the navbar dropdown lists look the same in both editions. The upgrade FAQ no longer states support months, which live on the pricing page. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Captured from the final PRO pages and the free dashboard. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This branch was successfully deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
AdminKit 4.0.0. Full list in
CHANGELOG.md.Changes
icons-lucidepage,icons-featherredirectscss/app.css, Light/Dark/Auto toggleprefers-reduced-motionexportsmap (@adminkit/core,/css,/head) with TypeScript types; SSR-safe importjs/head.jssets the color mode before first paintDevelopers
dist/no longer committed{{#push "scripts"}})src/data/stats.json; lint fails when staleAGENTS.mdBreaking
data-feather→data-lucide,feather.replace()→lucide.createIcons()data-bs-theme="dark"on<html>adminkit.chartjs()🤖 Generated with Claude Code