@grantcodes/ui 2.9.2 → 2.10.1

package/src/exports.test.js

@@ -1,119 +1,125 @@
-import { describe, it } from 'node:test'
-import assert from 'node:assert'
-import fs from 'node:fs'
-import path from 'node:path'
-import { fileURLToPath } from 'node:url'
+import { describe, it } from "node:test";
+import assert from "node:assert";
+import fs from "node:fs";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
 
-const __dirname = path.dirname(fileURLToPath(import.meta.url))
-const pkgPath = path.resolve(__dirname, '..', 'package.json')
-const pkgRoot = path.dirname(pkgPath)
-const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf-8'))
-const exports = pkg.exports
+const __dirname = path.dirname(fileURLToPath(import.meta.url));
+const pkgPath = path.resolve(__dirname, "..", "package.json");
+const pkgRoot = path.dirname(pkgPath);
+const pkg = JSON.parse(fs.readFileSync(pkgPath, "utf-8"));
+const exports = pkg.exports;
 
 // All 34 component CSS files expected to exist on disk
 // These are resolved via the ./components/* wildcard export
 const expectedComponentCss = [
-	'accordion/accordion.css',
-	'app-bar/app-bar.css',
-	'avatar/avatar.css',
-	'badge/badge.css',
-	'breadcrumb/breadcrumb.css',
-	'button/button.css',
-	'button-group/button-group.css',
-	'card/card.css',
-	'code-preview/code-preview.css',
-	'container/container.css',
-	'cta/cta.css',
-	'dialog/dialog.css',
-	'dropdown/dropdown.css',
-	'dropzone/dropzone.css',
-	'feature-list/feature-list.css',
-	'footer/footer.css',
-	'footer/footer-column.css',
-	'form-field/form-field.css',
-	'gallery/gallery.css',
-	'hero/hero.css',
-	'icon/icon.css',
-	'loading/loading.css',
-	'logo-cloud/logo-cloud.css',
-	'media-text/media-text.css',
-	'newsletter/newsletter.css',
-	'notice/notice.css',
-	'pagination/pagination.css',
-	'pricing/pricing.css',
-	'sidebar/sidebar.css',
-	'stats/stats.css',
-	'tabs/tabs.css',
-	'testimonials/testimonials.css',
-	'toast/toast.css',
-	'tooltip/tooltip.css',
-]
+	"accordion/accordion.css",
+	"app-bar/app-bar.css",
+	"avatar/avatar.css",
+	"badge/badge.css",
+	"breadcrumb/breadcrumb.css",
+	"button/button.css",
+	"button-group/button-group.css",
+	"card/card.css",
+	"code-preview/code-preview.css",
+	"container/container.css",
+	"cta/cta.css",
+	"dialog/dialog.css",
+	"dropdown/dropdown.css",
+	"dropzone/dropzone.css",
+	"feature-list/feature-list.css",
+	"footer/footer.css",
+	"footer/footer-column.css",
+	"form-field/form-field.css",
+	"gallery/gallery.css",
+	"hero/hero.css",
+	"icon/icon.css",
+	"loading/loading.css",
+	"logo-cloud/logo-cloud.css",
+	"media-text/media-text.css",
+	"newsletter/newsletter.css",
+	"notice/notice.css",
+	"pagination/pagination.css",
+	"pricing/pricing.css",
+	"sidebar/sidebar.css",
+	"stats/stats.css",
+	"tabs/tabs.css",
+	"testimonials/testimonials.css",
+	"toast/toast.css",
+	"tooltip/tooltip.css",
+];
 
-describe('package.json exports', () => {
-	describe('component CSS files exist (resolved via ./components/* wildcard)', () => {
+describe("package.json exports", () => {
+	describe("component CSS files exist (resolved via ./components/* wildcard)", () => {
 		for (const cssFile of expectedComponentCss) {
 			it(`src/components/${cssFile} exists on disk`, () => {
-				const fullPath = path.resolve(pkgRoot, 'src', 'components', cssFile)
+				const fullPath = path.resolve(pkgRoot, "src", "components", cssFile);
 				assert.ok(
 					fs.existsSync(fullPath),
 					`CSS file does not exist: ${fullPath}`,
-				)
-			})
+				);
+			});
 		}
 
-		it('has ./components/* wildcard export that covers CSS files', () => {
+		it("has ./components/* wildcard export that covers CSS files", () => {
 			assert.ok(
-				exports['./components/*'],
-				'Missing ./components/* wildcard export',
-			)
-		})
-	})
+				exports["./components/*"],
+				"Missing ./components/* wildcard export",
+			);
+		});
+	});
 
-	describe('focus-ring shared styles export', () => {
-		it('has export for ./styles/focus-ring.css', () => {
+	describe("focus-ring shared styles export", () => {
+		it("has export for ./styles/focus-ring.css", () => {
 			assert.ok(
-				exports['./styles/focus-ring.css'] !== undefined,
-				'Missing export for ./styles/focus-ring.css',
-			)
-		})
+				exports["./styles/focus-ring.css"] !== undefined,
+				"Missing export for ./styles/focus-ring.css",
+			);
+		});
 
-		it('./styles/focus-ring.css points to an existing file', () => {
-			const exportValue = exports['./styles/focus-ring.css']
+		it("./styles/focus-ring.css points to an existing file", () => {
+			const exportValue = exports["./styles/focus-ring.css"];
 			const filePath =
-				typeof exportValue === 'string' ? exportValue : exportValue?.import
-			assert.ok(filePath, 'No file path found for ./styles/focus-ring.css')
-			const fullPath = path.resolve(pkgRoot, filePath)
-			assert.ok(
-				fs.existsSync(fullPath),
-				`File does not exist: ${fullPath}`,
-			)
-		})
-	})
+				typeof exportValue === "string" ? exportValue : exportValue?.import;
+			assert.ok(filePath, "No file path found for ./styles/focus-ring.css");
+			const fullPath = path.resolve(pkgRoot, filePath);
+			assert.ok(fs.existsSync(fullPath), `File does not exist: ${fullPath}`);
+		});
+	});
 
-	describe('existing exports preserved', () => {
-		it('has root export (.)', () => {
-			assert.ok(exports['.'], 'Missing root export')
-			assert.ok(exports['.'].import, 'Missing root import')
-		})
+	describe("existing exports preserved", () => {
+		it("has root export (.)", () => {
+			assert.ok(exports["."], "Missing root export");
+			assert.ok(exports["."].import, "Missing root import");
+		});
 
-		it('has ./icons export', () => {
-			assert.ok(exports['./icons'], 'Missing ./icons export')
-		})
+		it("has ./icons export", () => {
+			assert.ok(exports["./icons"], "Missing ./icons export");
+		});
 
-		it('has ./styles/base.css export', () => {
-			assert.ok(exports['./styles/base.css'], 'Missing ./styles/base.css export')
-		})
+		it("has ./styles/base.css export", () => {
+			assert.ok(
+				exports["./styles/base.css"],
+				"Missing ./styles/base.css export",
+			);
+		});
 
-		it('has ./styles/themes/* export', () => {
-			assert.ok(exports['./styles/themes/*'], 'Missing ./styles/themes/* export')
-		})
+		it("has ./styles/themes/* export", () => {
+			assert.ok(
+				exports["./styles/themes/*"],
+				"Missing ./styles/themes/* export",
+			);
+		});
 
-		it('has ./components/* wildcard export', () => {
-			assert.ok(exports['./components/*'], 'Missing ./components/* wildcard export')
-		})
+		it("has ./components/* wildcard export", () => {
+			assert.ok(
+				exports["./components/*"],
+				"Missing ./components/* wildcard export",
+			);
+		});
 
-		it('has ./fonts/* export', () => {
-			assert.ok(exports['./fonts/*'], 'Missing ./fonts/* export')
-		})
-	})
-})
+		it("has ./fonts/* export", () => {
+			assert.ok(exports["./fonts/*"], "Missing ./fonts/* export");
+		});
+	});
+});

package/src/lib/styles/all.css

@@ -1,39 +1,39 @@
 @layer components {
-  @import "./focus-ring.css";
-  @import "../../components/accordion/accordion.css";
-  @import "../../components/app-bar/app-bar.css";
-  @import "../../components/avatar/avatar.css";
-  @import "../../components/badge/badge.css";
-  @import "../../components/breadcrumb/breadcrumb.css";
-  @import "../../components/button/button.css";
-  @import "../../components/button-group/button-group.css";
-  @import "../../components/card/card.css";
-  @import "../../components/code-preview/code-preview.css";
-  @import "../../components/container/container.css";
-  @import "../../components/countdown/countdown.css";
-  @import "../../components/cta/cta.css";
-  @import "../../components/dialog/dialog.css";
-  @import "../../components/dropdown/dropdown.css";
-  @import "../../components/dropzone/dropzone.css";
-  @import "../../components/feature-list/feature-list.css";
-  @import "../../components/footer/footer.css";
-  @import "../../components/footer/footer-column.css";
-  @import "../../components/form-field/form-field.css";
-  @import "../../components/gallery/gallery.css";
-  @import "../../components/hero/hero.css";
-  @import "../../components/icon/icon.css";
-  @import "../../components/loading/loading.css";
-  @import "../../components/logo-cloud/logo-cloud.css";
-  @import "../../components/map/map.css";
-  @import "../../components/media-text/media-text.css";
-  @import "../../components/newsletter/newsletter.css";
-  @import "../../components/notice/notice.css";
-  @import "../../components/pagination/pagination.css";
-  @import "../../components/pricing/pricing.css";
-  @import "../../components/sidebar/sidebar.css";
-  @import "../../components/stats/stats.css";
-  @import "../../components/tabs/tabs.css";
-  @import "../../components/testimonials/testimonials.css";
-  @import "../../components/toast/toast.css";
-  @import "../../components/tooltip/tooltip.css";
+	@import "./focus-ring.css";
+	@import "../../components/accordion/accordion.css";
+	@import "../../components/app-bar/app-bar.css";
+	@import "../../components/avatar/avatar.css";
+	@import "../../components/badge/badge.css";
+	@import "../../components/breadcrumb/breadcrumb.css";
+	@import "../../components/button/button.css";
+	@import "../../components/button-group/button-group.css";
+	@import "../../components/card/card.css";
+	@import "../../components/code-preview/code-preview.css";
+	@import "../../components/container/container.css";
+	@import "../../components/countdown/countdown.css";
+	@import "../../components/cta/cta.css";
+	@import "../../components/dialog/dialog.css";
+	@import "../../components/dropdown/dropdown.css";
+	@import "../../components/dropzone/dropzone.css";
+	@import "../../components/feature-list/feature-list.css";
+	@import "../../components/footer/footer.css";
+	@import "../../components/footer/footer-column.css";
+	@import "../../components/form-field/form-field.css";
+	@import "../../components/gallery/gallery.css";
+	@import "../../components/hero/hero.css";
+	@import "../../components/icon/icon.css";
+	@import "../../components/loading/loading.css";
+	@import "../../components/logo-cloud/logo-cloud.css";
+	@import "../../components/map/map.css";
+	@import "../../components/media-text/media-text.css";
+	@import "../../components/newsletter/newsletter.css";
+	@import "../../components/notice/notice.css";
+	@import "../../components/pagination/pagination.css";
+	@import "../../components/pricing/pricing.css";
+	@import "../../components/sidebar/sidebar.css";
+	@import "../../components/stats/stats.css";
+	@import "../../components/tabs/tabs.css";
+	@import "../../components/testimonials/testimonials.css";
+	@import "../../components/toast/toast.css";
+	@import "../../components/tooltip/tooltip.css";
 }

package/src/lib/styles/focus-ring.css

@@ -1,30 +1,30 @@
 .focus-ring,
 :host(.focus-ring) {
-  outline: 0px solid transparent;
-  outline-offset: var(--g-theme-focus-ring-offset-default);
-  transition-duration: var(--g-animation-duration-20);
-  transition-property: outline-color, width;
+	outline: 0px solid transparent;
+	outline-offset: var(--g-theme-focus-ring-offset-default);
+	transition-duration: var(--g-animation-duration-20);
+	transition-property: outline-color, width;
 }
 
 .focus-ring:focus-visible,
 :host(.focus-ring):focus-visible {
-  outline: var(--g-theme-focus-ring-width-default) solid
-    var(--g-theme-focus-ring-color-default);
+	outline: var(--g-theme-focus-ring-width-default) solid
+		var(--g-theme-focus-ring-color-default);
 }
 
 @media (prefers-contrast: more) {
-  .focus-ring:focus-visible,
-  :host(.focus-ring):focus-visible {
-    outline: var(--g-theme-focus-ring-width-default) solid
-      var(--g-theme-focus-ring-color-contrast);
-    box-shadow: 0 0 0
-      calc(
-        (
-            var(--g-theme-focus-ring-width-default) +
-              var(--g-theme-focus-ring-offset-default)
-          ) *
-          1.5
-      )
-      var(--g-theme-focus-ring-color-contrast-shadow);
-  }
+	.focus-ring:focus-visible,
+	:host(.focus-ring):focus-visible {
+		outline: var(--g-theme-focus-ring-width-default) solid
+			var(--g-theme-focus-ring-color-contrast);
+		box-shadow: 0 0 0
+			calc(
+				(
+					var(--g-theme-focus-ring-width-default) +
+					var(--g-theme-focus-ring-offset-default)
+				) *
+				1.5
+			)
+			var(--g-theme-focus-ring-color-contrast-shadow);
+	}
 }

package/src/react.js

@@ -1,39 +1,45 @@
-export { Accordion } from "./components/accordion/accordion.react.js"
-export { AppBar } from "./components/app-bar/app-bar.react.js"
-export { NavLink } from "./components/app-bar/nav-link.react.js"
-export { Avatar } from "./components/avatar/avatar.react.js"
-export { Badge } from "./components/badge/badge.react.js"
-export { Breadcrumb, BreadcrumbItem } from "./components/breadcrumb/breadcrumb.react.js"
-export { Button } from "./components/button/button.react.js"
-export { ButtonGroup } from "./components/button-group/button-group.react.js"
-export { Card } from "./components/card/card.react.js"
-export { CodePreview } from "./components/code-preview/code-preview.react.js"
-export { Container } from "./components/container/container.react.js"
-export { Countdown } from "./components/countdown/countdown.react.js"
-export { Cta } from "./components/cta/cta.react.js"
-export { Dialog } from "./components/dialog/dialog.react.js"
-export { Dropdown, DropdownItem } from "./components/dropdown/dropdown.react.js"
-export { Dropzone } from "./components/dropzone/dropzone.react.js"
-export { FeatureList } from "./components/feature-list/feature-list.react.js"
-export { Footer, FooterColumn } from "./components/footer/footer.react.js"
-export { FormField } from "./components/form-field/form-field.react.js"
-export { Gallery } from "./components/gallery/gallery.react.js"
-export { GalleryImage } from "./components/gallery/gallery-image.react.js"
-export { Hero } from "./components/hero/hero.react.js"
-export { Icon } from "./components/icon/icon.react.js"
-export { Loading } from "./components/loading/loading.react.js"
-export { LogoCloud } from "./components/logo-cloud/logo-cloud.react.js"
-export { MapEmbed } from "./components/map/map.react.js"
-export { MediaText } from "./components/media-text/media-text.react.js"
-export { Newsletter } from "./components/newsletter/newsletter.react.js"
-export { Notice } from "./components/notice/notice.react.js"
-export { Pagination } from "./components/pagination/pagination.react.js"
-export { Pricing } from "./components/pricing/pricing.react.js"
-export { Sidebar } from "./components/sidebar/sidebar.react.js"
-export { Stats } from "./components/stats/stats.react.js"
-export { Tab } from "./components/tabs/tab.react.js"
-export { Tabs } from "./components/tabs/tabs.react.js"
-export { TabsButton } from "./components/tabs/internal/tabs-button.react.js"
-export { Testimonials } from "./components/testimonials/testimonials.react.js"
-export { Toast, ToastContainer } from "./components/toast/toast.react.js"
-export { Tooltip } from "./components/tooltip/tooltip.react.js"
+export { Accordion } from "./components/accordion/accordion.react.js";
+export { AppBar } from "./components/app-bar/app-bar.react.js";
+export { NavLink } from "./components/app-bar/nav-link.react.js";
+export { Avatar } from "./components/avatar/avatar.react.js";
+export { Badge } from "./components/badge/badge.react.js";
+export {
+	Breadcrumb,
+	BreadcrumbItem,
+} from "./components/breadcrumb/breadcrumb.react.js";
+export { Button } from "./components/button/button.react.js";
+export { ButtonGroup } from "./components/button-group/button-group.react.js";
+export { Card } from "./components/card/card.react.js";
+export { CodePreview } from "./components/code-preview/code-preview.react.js";
+export { Container } from "./components/container/container.react.js";
+export { Countdown } from "./components/countdown/countdown.react.js";
+export { Cta } from "./components/cta/cta.react.js";
+export { Dialog } from "./components/dialog/dialog.react.js";
+export {
+	Dropdown,
+	DropdownItem,
+} from "./components/dropdown/dropdown.react.js";
+export { Dropzone } from "./components/dropzone/dropzone.react.js";
+export { FeatureList } from "./components/feature-list/feature-list.react.js";
+export { Footer, FooterColumn } from "./components/footer/footer.react.js";
+export { FormField } from "./components/form-field/form-field.react.js";
+export { Gallery } from "./components/gallery/gallery.react.js";
+export { GalleryImage } from "./components/gallery/gallery-image.react.js";
+export { Hero } from "./components/hero/hero.react.js";
+export { Icon } from "./components/icon/icon.react.js";
+export { Loading } from "./components/loading/loading.react.js";
+export { LogoCloud } from "./components/logo-cloud/logo-cloud.react.js";
+export { MapEmbed } from "./components/map/map.react.js";
+export { MediaText } from "./components/media-text/media-text.react.js";
+export { Newsletter } from "./components/newsletter/newsletter.react.js";
+export { Notice } from "./components/notice/notice.react.js";
+export { Pagination } from "./components/pagination/pagination.react.js";
+export { Pricing } from "./components/pricing/pricing.react.js";
+export { Sidebar } from "./components/sidebar/sidebar.react.js";
+export { Stats } from "./components/stats/stats.react.js";
+export { Tab } from "./components/tabs/tab.react.js";
+export { Tabs } from "./components/tabs/tabs.react.js";
+export { TabsButton } from "./components/tabs/internal/tabs-button.react.js";
+export { Testimonials } from "./components/testimonials/testimonials.react.js";
+export { Toast, ToastContainer } from "./components/toast/toast.react.js";
+export { Tooltip } from "./components/tooltip/tooltip.react.js";

package/vite-plugin-css-import-attributes.js

@@ -45,12 +45,15 @@ export function cssImportAttributes() {
 			);
 			const regex = new RegExp(
 				escapedSource +
-					`['"] *(?:with|assert) *{ *type: *['"]css['"]`,
+					`['"]\\s*(?:with|assert)\\s*{\\s*type:\\s*['"]css['"]`,
 			);
 			if (!regex.test(importerContent)) return;
 
 			// Resolve to absolute path
-			const resolved = (await this.resolve(source, importer, options))
+			const resolved = (await this.resolve(source, importer, {
+				...options,
+				skipSelf: true,
+			}))
 				?.id;
 			if (!resolved) return;