@grantcodes/ui 2.12.1 → 2.15.5

package/CHANGELOG.md

@@ -1,5 +1,80 @@
 # Changelog
 
+## [2.15.5](https://github.com/grantcodes/ui/compare/ui-v2.15.4...ui-v2.15.5) (2026-06-07)
+
+
+### Bug Fixes
+
+* **ui:** handle app bar nav overflow ([592f8b0](https://github.com/grantcodes/ui/commit/592f8b0a29bd08a49b536dd8691ae9050cb009db))
+
+## [2.15.4](https://github.com/grantcodes/ui/compare/ui-v2.15.3...ui-v2.15.4) (2026-06-07)
+
+
+### Bug Fixes
+
+* **ui:** reflect app bar boolean attrs ([10f0685](https://github.com/grantcodes/ui/commit/10f06854563526201031734318a01bc042bfdb8a))
+
+## [2.15.3](https://github.com/grantcodes/ui/compare/ui-v2.15.2...ui-v2.15.3) (2026-06-07)
+
+
+### Bug Fixes
+
+* **ui:** h2 margins ([2dac517](https://github.com/grantcodes/ui/commit/2dac517a704817f55f2d46df2fe92340a8c5fb94))
+
+## [2.15.2](https://github.com/grantcodes/ui/compare/ui-v2.15.1...ui-v2.15.2) (2026-06-07)
+
+
+### Bug Fixes
+
+* align package metadata for trusted publishing ([5ae9181](https://github.com/grantcodes/ui/commit/5ae9181da289c6fdfae3a2aa23c88601256b003d))
+
+## [2.15.1](https://github.com/grantcodes/ui/compare/ui-v2.15.0...ui-v2.15.1) (2026-06-07)
+
+
+### Bug Fixes
+
+* refresh package readmes ([8c4c1e5](https://github.com/grantcodes/ui/commit/8c4c1e5c795ed38321a9bb5fe5537e34926769ef))
+
+## [2.15.0](https://github.com/grantcodes/ui/compare/ui-v2.14.1...ui-v2.15.0) (2026-06-01)
+
+
+### Features
+
+* **ui, style-dictionary:** expand person usage ([73cc1ca](https://github.com/grantcodes/ui/commit/73cc1cac2b2f84c9663e64d50636b56a7244730b))
+
+## [2.14.1](https://github.com/grantcodes/ui/compare/ui-v2.14.0...ui-v2.14.1) (2026-05-31)
+
+
+### Bug Fixes
+
+* **ui:** sticky app bar ([c7fbb6e](https://github.com/grantcodes/ui/commit/c7fbb6e5cc5a569d41a7c7e23221dfde6ef56b7f))
+
+## [2.14.0](https://github.com/grantcodes/ui/compare/ui-v2.13.0...ui-v2.14.0) (2026-05-31)
+
+
+### Features
+
+* **style-dictionary, ui:** add button styles and simplfy tokens ([f5d66b7](https://github.com/grantcodes/ui/commit/f5d66b7953c424e5ae2125495dc555a0f44aacbe))
+* **ui:** add person component and polish styles ([2b6ac36](https://github.com/grantcodes/ui/commit/2b6ac361a87920fc1be8209e572f871c9d199df8))
+
+
+### Bug Fixes
+
+* **ui:** color-contrast lint ([29eedf9](https://github.com/grantcodes/ui/commit/29eedf9181448767a6bcbdb0e8b8cddeb3fd2aad))
+* **ui:** css formatting ([ae3a039](https://github.com/grantcodes/ui/commit/ae3a03954acb80b102dd8238521b963502b76c42))
+
+## [2.13.0](https://github.com/grantcodes/ui/compare/ui-v2.12.1...ui-v2.13.0) (2026-05-30)
+
+
+### Features
+
+* **style-dictionary:** simplify token structure ([e996706](https://github.com/grantcodes/ui/commit/e996706de23efc848d64eb42a271bd96fa914345))
+
+
+### Bug Fixes
+
+* **style-dictionary:** trim semantic color tokens ([68a2383](https://github.com/grantcodes/ui/commit/68a2383aef3ce7bcec3ca7bc6f6cbd5198a45fed))
+
 ## [2.12.1](https://github.com/grantcodes/ui/compare/ui-v2.12.0...ui-v2.12.1) (2026-05-08)
 
 

package/README.md

@@ -6,7 +6,9 @@ Components are built with Lit web components using CSS modules for styles with t
 
 ## Installing
 
-In the future it should be something like `npm install @grantcodes/ui`.
+```bash
+npm install @grantcodes/ui
+```
 
 ## Usage
 
@@ -22,6 +24,8 @@ Components can be used directly in HTML or imported as ES modules.
 import { GrantCodesButton } from '@grantcodes/ui/components/button';
 ```
 
+For Astro projects, pair this package with `@grantcodes/astro` for the lowest-friction setup.
+
 ## Creating a new component
 
 To create a new component run `npm run generate`. Uses plop.js for scaffolding.

package/custom-elements.json

@@ -975,6 +975,23 @@
           "description": "",
           "name": "GrantCodesButton",
           "members": [
+            {
+              "kind": "field",
+              "name": "_fieldsetDisabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false"
+            },
+            {
+              "kind": "method",
+              "name": "_handleFormClick",
+              "parameters": [
+                {
+                  "name": "e"
+                }
+              ]
+            },
             {
               "kind": "field",
               "name": "disabled",
@@ -986,6 +1003,38 @@
               "attribute": "disabled",
               "reflects": true
             },
+            {
+              "kind": "field",
+              "name": "form",
+              "privacy": "public",
+              "type": {
+                "text": "string"
+              },
+              "attribute": "form",
+              "reflects": true
+            },
+            {
+              "kind": "field",
+              "name": "formAssociated",
+              "type": {
+                "text": "boolean"
+              },
+              "static": true,
+              "default": "true"
+            },
+            {
+              "kind": "method",
+              "name": "formDisabledCallback",
+              "parameters": [
+                {
+                  "name": "disabled"
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "formResetCallback"
+            },
             {
               "kind": "field",
               "name": "href",
@@ -1036,6 +1085,13 @@
               "default": "false",
               "fieldName": "disabled"
             },
+            {
+              "name": "form",
+              "type": {
+                "text": "string"
+              },
+              "fieldName": "form"
+            },
             {
               "name": "href",
               "type": {
@@ -2938,6 +2994,17 @@
               "name": "ariaDescribedBy",
               "readonly": true
             },
+            {
+              "kind": "field",
+              "name": "direction",
+              "privacy": "public",
+              "type": {
+                "text": "'vertical' | 'horizontal'"
+              },
+              "description": "Direction of the field. Generally want horizontal for checkboxes and radios.",
+              "default": "\"vertical\"",
+              "attribute": "direction"
+            },
             {
               "kind": "field",
               "name": "error",
@@ -2997,14 +3064,6 @@
               "kind": "method",
               "name": "helpTemplate"
             },
-            {
-              "kind": "field",
-              "name": "inlineInput",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false"
-            },
             {
               "kind": "field",
               "name": "label",
@@ -3013,10 +3072,20 @@
                 "text": "string"
               },
               "default": "\"\"",
-              "attribute": "label"
+              "attribute": "label",
+              "reflects": true
             }
           ],
           "attributes": [
+            {
+              "name": "direction",
+              "type": {
+                "text": "'vertical' | 'horizontal'"
+              },
+              "description": "Direction of the field. Generally want horizontal for checkboxes and radios.",
+              "default": "\"vertical\"",
+              "fieldName": "direction"
+            },
             {
               "name": "error",
               "type": {
@@ -3910,7 +3979,11 @@
             },
             {
               "kind": "field",
-              "name": "_darkQuery"
+              "name": "_darkQuery",
+              "type": {
+                "text": "null"
+              },
+              "default": "null"
             },
             {
               "kind": "field",
@@ -4850,6 +4923,198 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/components/person/index.js",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "module": "src/components/person/person.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/components/person/person.component.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "GrantCodesPerson",
+          "members": [
+            {
+              "kind": "field",
+              "name": "alt",
+              "privacy": "public",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"\"",
+              "attribute": "alt"
+            },
+            {
+              "kind": "field",
+              "name": "avatar",
+              "privacy": "public",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"\"",
+              "attribute": "avatar"
+            },
+            {
+              "kind": "field",
+              "name": "company",
+              "privacy": "public",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"\"",
+              "attribute": "company"
+            },
+            {
+              "kind": "field",
+              "name": "meta",
+              "readonly": true
+            },
+            {
+              "kind": "field",
+              "name": "name",
+              "privacy": "public",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"\"",
+              "attribute": "name"
+            },
+            {
+              "kind": "field",
+              "name": "role",
+              "privacy": "public",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"\"",
+              "attribute": "role"
+            },
+            {
+              "kind": "field",
+              "name": "size",
+              "privacy": "public",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"medium\"",
+              "attribute": "size"
+            }
+          ],
+          "attributes": [
+            {
+              "name": "alt",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"\"",
+              "fieldName": "alt"
+            },
+            {
+              "name": "avatar",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"\"",
+              "fieldName": "avatar"
+            },
+            {
+              "name": "company",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"\"",
+              "fieldName": "company"
+            },
+            {
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"\"",
+              "fieldName": "name"
+            },
+            {
+              "name": "role",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"\"",
+              "fieldName": "role"
+            },
+            {
+              "name": "size",
+              "type": {
+                "text": "string"
+              },
+              "default": "\"medium\"",
+              "fieldName": "size"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "grantcodes-person",
+          "customElement": true,
+          "modulePath": "src/components/person/person.component.js",
+          "definitionPath": "src/components/person/person.js"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "GrantCodesPerson",
+          "declaration": {
+            "name": "GrantCodesPerson",
+            "module": "src/components/person/person.component.js"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/components/person/person.js",
+      "declarations": [],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "*",
+          "declaration": {
+            "name": "*",
+            "module": "src/components/person/person.component.js"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "GrantCodesPerson",
+            "module": "src/components/person/person.js"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "grantcodes-person",
+          "declaration": {
+            "name": "GrantCodesPerson",
+            "module": "/src/components/person/person.component.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/components/pricing/index.js",
@@ -5592,12 +5857,7 @@
             }
           ],
           "modulePath": "src/components/tabs/internal/tabs-button.component.js",
-          "definitionPath": "src/components/tabs/internal/tabs-button.js",
-          "cssProperties": [],
-          "cssParts": [],
-          "cssStates": [],
-          "events": [],
-          "slots": []
+          "definitionPath": "src/components/tabs/internal/tabs-button.js"
         }
       ],
       "exports": [
@@ -5645,160 +5905,8 @@
     {
       "kind": "javascript-module",
       "path": "src/components/tabs/internal/tabs-item.component.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "GrantCodesTabsItem",
-          "members": [
-            {
-              "kind": "field",
-              "name": "active",
-              "privacy": "public",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "attribute": "active"
-            },
-            {
-              "kind": "field",
-              "name": "buttonId",
-              "privacy": "public",
-              "type": {
-                "text": "string"
-              },
-              "readonly": true,
-              "attribute": "buttonId",
-              "reflects": true
-            },
-            {
-              "kind": "field",
-              "name": "containerId",
-              "privacy": "public",
-              "type": {
-                "text": "string"
-              },
-              "default": "\"\"",
-              "attribute": "containerId"
-            },
-            {
-              "kind": "field",
-              "name": "content",
-              "privacy": "public",
-              "type": {
-                "text": "string"
-              },
-              "readonly": true,
-              "attribute": "content"
-            },
-            {
-              "kind": "field",
-              "name": "index",
-              "privacy": "public",
-              "type": {
-                "text": "number"
-              },
-              "default": "-1",
-              "attribute": "index"
-            },
-            {
-              "kind": "field",
-              "name": "label",
-              "privacy": "public",
-              "type": {
-                "text": "string"
-              },
-              "default": "\"\"",
-              "attribute": "label"
-            },
-            {
-              "kind": "field",
-              "name": "panelId",
-              "privacy": "public",
-              "type": {
-                "text": "string"
-              },
-              "readonly": true,
-              "attribute": "panelId"
-            }
-          ],
-          "attributes": [
-            {
-              "name": "active",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "fieldName": "active"
-            },
-            {
-              "name": "buttonId",
-              "type": {
-                "text": "string"
-              },
-              "readonly": true,
-              "fieldName": "buttonId"
-            },
-            {
-              "name": "containerId",
-              "type": {
-                "text": "string"
-              },
-              "default": "\"\"",
-              "fieldName": "containerId"
-            },
-            {
-              "name": "content",
-              "type": {
-                "text": "string"
-              },
-              "readonly": true,
-              "fieldName": "content"
-            },
-            {
-              "name": "index",
-              "type": {
-                "text": "number"
-              },
-              "default": "-1",
-              "fieldName": "index"
-            },
-            {
-              "name": "label",
-              "type": {
-                "text": "string"
-              },
-              "default": "\"\"",
-              "fieldName": "label"
-            },
-            {
-              "name": "panelId",
-              "type": {
-                "text": "string"
-              },
-              "readonly": true,
-              "fieldName": "panelId"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "customElement": true,
-          "modulePath": "src/components/tabs/internal/tabs-item.component.js"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "GrantCodesTabsItem",
-          "declaration": {
-            "name": "GrantCodesTabsItem",
-            "module": "src/components/tabs/internal/tabs-item.component.js"
-          }
-        }
-      ]
+      "declarations": [],
+      "exports": []
     },
     {
       "kind": "javascript-module",
@@ -6002,12 +6110,7 @@
             }
           ],
           "modulePath": "src/components/tabs/tab.component.js",
-          "definitionPath": "src/components/tabs/tab.js",
-          "cssProperties": [],
-          "cssParts": [],
-          "cssStates": [],
-          "events": [],
-          "slots": []
+          "definitionPath": "src/components/tabs/tab.js"
         }
       ],
       "exports": [
@@ -6148,6 +6251,14 @@
         }
       ],
       "exports": [
+        {
+          "kind": "js",
+          "name": "GrantCodesTab",
+          "declaration": {
+            "name": "GrantCodesTab",
+            "module": "src/components/tabs/tabs.component.js"
+          }
+        },
         {
           "kind": "js",
           "name": "GrantCodesTabs",
@@ -6155,6 +6266,14 @@
             "name": "GrantCodesTabs",
             "module": "src/components/tabs/tabs.component.js"
           }
+        },
+        {
+          "kind": "js",
+          "name": "GrantCodesTabsButton",
+          "declaration": {
+            "name": "GrantCodesTabsButton",
+            "module": "src/components/tabs/tabs.component.js"
+          }
         }
       ]
     },

package/package.json

@@ -1,12 +1,20 @@
 {
   "name": "@grantcodes/ui",
-  "version": "2.12.1",
+  "version": "2.15.5",
   "description": "A personal component system built with Lit web components",
   "type": "module",
   "main": "src/main.js",
   "module": "src/main.js",
   "types": "src/types.d.ts",
   "author": "grantcodes",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/grantcodes/ui.git"
+  },
+  "bugs": {
+    "url": "https://github.com/grantcodes/ui/issues"
+  },
+  "homepage": "https://github.com/grantcodes/ui#readme",
   "exports": {
     ".": {
       "types": "./src/types.d.ts",
@@ -44,7 +52,7 @@
     "@lit/react": "^1.0.8",
     "lit": "^3.3.1",
     "shiki": "^3.17.1",
-    "@grantcodes/style-dictionary": "^1.6.0"
+    "@grantcodes/style-dictionary": "^1.10.2"
   },
   "devDependencies": {
     "@arcmantle/vite-plugin-import-css-sheet": "^1.0.12",
@@ -92,7 +100,7 @@
     "watch": "vite build --watch",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build",
-    "build": "npm run build-storybook",
+    "build": "run-s cem build-storybook",
     "generate": "plop",
     "cem": "cem analyze --config custom-elements-manifest.config.js --litelement",
     "fix": "run-s fix:lint",