@nysds/components 1.19.3 → 1.20.0-alpha-3

package/custom-elements.json

@@ -158,18 +158,13 @@
           "summary": "Container for accordion items with optional single-select and bordered styling.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-accordion>\n<nys-accordionitem id=\"accordionId1\" heading=\"How do I renew my passport or apply for a new one?\">\n<p>\nYou can apply for or renew a U.S. passport through the U.S. Department\nof State. Some renewals can be done by mail.\n</p>\n<div style=\"display: flex; gap: 0.5rem; font-size: 1rem;\">\n<a href=\"https://www.ny.gov\" target=\"_blank\">Check your registration</a>\n<a href=\"https://www.ny.gov\" target=\"_blank\">Fill out application</a>\n</div>\n</nys-accordionitem>\n<nys-accordionitem id=\"accordionId2\" heading=\"How can I find out if I’m registered to vote?\">\n<p>You can check your registration status, update your information, or find out how to register through the National Association of Secretaries of State.</p>\n</nys-accordionitem>\n</nys-accordion>",
+              "title": "Basic accordion",
+              "code": "<nys-accordion>\n<nys-accordionitem heading=\"Section 1\">Content for section 1</nys-accordionitem>\n<nys-accordionitem heading=\"Section 2\">Content for section 2</nys-accordionitem>\n</nys-accordion>",
               "lang": "html"
             },
             {
-              "title": "Single Select",
-              "code": "<nys-accordion singleSelect>\n<nys-accordionitem heading=\"FAQ 1\">Answer 1</nys-accordionitem>\n<nys-accordionitem heading=\"FAQ 2\">Answer 2</nys-accordionitem>\n</nys-accordion>",
-              "lang": "html"
-            },
-            {
-              "title": "Bordered",
-              "code": "<nys-accordion bordered>\n<nys-accordionitem heading=\"We are a group of accordions\">\n<p>Stronger together! Learn more at\n<a href=\"https://www.ny.gov\" target=\"_blank\">ny.gov</a>\n</p>\n</nys-accordionitem>\n<nys-accordionitem heading=\"Liberty Ipsum: Bridges & Boroughs\">\n<p>Empire ipsum dolor sit amet, across the Brooklyn Bridge to Central Park, consectetur adipiscing elit.</p>\n</nys-accordionitem>\n<nys-accordionitem heading=\"Hudson Ipsum: Riverfront Stories\">\n<p>From the banks of the Hudson to the peaks of the Adirondacks, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>\n</nys-accordionitem>\n</nys-accordion>",
+              "title": "Single-select accordion",
+              "code": "<nys-accordion singleSelect bordered>\n<nys-accordionitem heading=\"FAQ 1\" expanded>Answer 1</nys-accordionitem>\n<nys-accordionitem heading=\"FAQ 2\">Answer 2</nys-accordionitem>\n</nys-accordion>",
               "lang": "html"
             }
           ]
@@ -356,7 +351,7 @@
           "examples": [
             {
               "title": "Expanded item",
-              "code": "<nys-accordion>\n<nys-accordionitem heading=\"How do I apply?\" expanded>\n<p>Visit ny.gov and complete the online application.</p>\n</nys-accordionitem>\n<nys-accordionitem heading=\"What documents do I need?\">\n<p>You will need a valid ID and proof of residency.</p>\n</nys-accordionitem>\n</nys-accordion>",
+              "code": "<nys-accordionitem heading=\"How do I apply?\" expanded>\n<p>Visit ny.gov and complete the online application.</p>\n</nys-accordionitem>",
               "lang": "html"
             }
           ]
@@ -729,64 +724,13 @@
           "summary": "Alert for contextual feedback with semantic types and live region support.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-alert heading=\"This is a heading\"></nys-alert>",
-              "lang": "html"
-            },
-            {
-              "title": "Text",
-              "code": "<nys-alert\nheading=\"This is a heading\"\ntext=\"This is additional information passed in through the text property\"\n></nys-alert>",
-              "lang": "html"
-            },
-            {
-              "title": "Rich Text",
-              "code": "<nys-alert heading=\"Rich Text\">\n<p>This is a custom alert with <strong>HTML content</strong> passed in through the slot.</p>\n<a href=\"https://www.ny.gov/\" target=\"_blank\">Learn more about our accessibility services</a>\n</nys-alert>",
-              "lang": "html"
-            },
-            {
-              "title": "Info Type",
-              "code": "<nys-alert type=\"info\" heading=\"Info alert type\"></nys-alert>",
-              "lang": "html"
-            },
-            {
-              "title": "Success Type",
-              "code": "<nys-alert type=\"success\" heading=\"Success alert type\"></nys-alert>",
-              "lang": "html"
-            },
-            {
-              "title": "Warning Type",
-              "code": "<nys-alert type=\"warning\" heading=\"Warning alert type\"></nys-alert>",
-              "lang": "html"
-            },
-            {
-              "title": "Danger Type",
-              "code": "<nys-alert type=\"danger\" heading=\"Danger alert type\"></nys-alert>",
-              "lang": "html"
-            },
-            {
-              "title": "Emergency Type",
-              "code": "<nys-alert type=\"emergency\" heading=\"Emergency alert type\"></nys-alert>",
-              "lang": "html"
-            },
-            {
-              "title": "Dismissible",
-              "code": "<nys-alert heading=\"This alert is dismisable\" text=\"Close it by clicking on the X in the corner.\" dismissible>\n</nys-alert>",
-              "lang": "html"
-            },
-            {
-              "title": "Duration",
-              "code": "<nys-alert heading=\"Disappearing alert\" text=\"This alert will disappear after 3 seconds.\" duration=\"3000\"></nys-alert>",
-              "lang": "html",
-              "render": "<nys-button\nclass=\"nys-margin-b-100\"\nlabel=\"Show alert\"\nonclick=\"document.body.appendChild(Object.assign(document.createElement('nys-alert'), {heading: 'Disappearing alert', text: 'This alert will disappear after 3 seconds.', duration: 3000}))\"\n></nys-button>"
-            },
-            {
-              "title": "Custom Icon",
-              "code": "<nys-alert\ntype=\"emergency\"\nheading=\"Winter storm warning: Dec 10th, 2024.\"\ntext=\"A major snowfall is expected across the state of New York for the weekend of Dec 7th. Stay home if possible and use extreme caution when driving.\"\nicon=\"ac_unit\">\n</nys-alert>",
+              "title": "Info alert",
+              "code": "<nys-alert type=\"info\" heading=\"Update available\" text=\"A new version is ready to install.\"></nys-alert>",
               "lang": "html"
             },
             {
-              "title": "Action Links",
-              "code": "<nys-alert\nheading=\"Alert with links\"\nprimaryLabel=\"{primaryAction}\"\nsecondaryLabel=\"{secondaryAction}\"\nprimaryAction=\"https://www.ny.gov/\"\nsecondaryAction=\"https://www.ny.gov/\"\n></nys-alert>",
+              "title": "Dismissible success alert",
+              "code": "<nys-alert type=\"success\" heading=\"Application submitted\" dismissible></nys-alert>",
               "lang": "html"
             }
           ]
@@ -1082,44 +1026,13 @@
           "summary": "User avatar with image, initials, or icon fallback and contrast-aware colors.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-avatar ariaLabel=\"User avatar\"></nys-avatar>",
+              "title": "Image avatar",
+              "code": "<nys-avatar image=\"/path/to/photo.jpg\" ariaLabel=\"Jane Smith\"></nys-avatar>",
               "lang": "html"
             },
             {
-              "title": "Image",
-              "code": "<nys-avatar\nimage=\"path/to/img.png\"\nariaLabel=\"Jane Smith\"\n></nys-avatar>",
-              "lang": "html",
-              "render": "<nys-avatar\nimage=\"https://images.unsplash.com/photo-1523712999610-f77fbcfc3843?q=80&w=2070&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D\"\nariaLabel=\"Jane Smith\"\n></nys-avatar>"
-            },
-            {
-              "title": "Initials",
-              "code": "<nys-avatar initials=\"JS\" ariaLabel=\"Jane Smith\"></nys-avatar>",
-              "lang": "html"
-            },
-            {
-              "title": "Icon",
-              "code": "<nys-avatar icon=\"account_circle\"></nys-avatar>",
-              "lang": "html"
-            },
-            {
-              "title": "Interactive",
-              "code": "<nys-avatar interactive></nys-avatar>",
-              "lang": "html"
-            },
-            {
-              "title": "Disabled",
-              "code": "<nys-avatar disabled></nys-avatar>",
-              "lang": "html"
-            },
-            {
-              "title": "Custom Background Color",
-              "code": "<nys-avatar color=\"var(--nys-color-red-500)\" interactive></nys-avatar>",
-              "lang": "html"
-            },
-            {
-              "title": "Lazy Loading",
-              "code": "<nys-avatar lazy></nys-avatar>",
+              "title": "Initials avatar with custom color",
+              "code": "<nys-avatar initials=\"JS\" color=\"var(--nys-color-theme)\" ariaLabel=\"Jane Smith\"></nys-avatar>",
               "lang": "html"
             }
           ]
@@ -1269,16 +1182,14 @@
           "summary": "Floating back-to-top button with auto-show behavior, smooth scroll, and focus management.",
           "examples": [
             {
-              "title": "Basic",
+              "title": "Auto-appearing button in footer",
               "code": "<footer>\n<nys-backtotop></nys-backtotop>\n<!-- Other footer content -->\n</footer>",
-              "lang": "html",
-              "render": "<style>\ncode {\nwhite-space: nowrap;\npadding: var(--nys-space-1px) var(--nys-space-2px);\nborder-radius: var(--nys-radius-md);\ncolor: var(--nys-color-red-600);\nbackground: var(--nys-color-neutral-10);\nfont-size: var(--nys-font-size-sm);\n}\n</style>\n<nys-unavheader hideTranslate hideSearch></nys-unavheader>\n<nys-globalheader appName=\"Back to Top Example\"></nys-globalheader>\n<main style=\"padding: 0 2rem\">\n<h1>Sample Content on page</h1>\n<p>\nThis is a sample content area used to demonstrate the functionality of\nthe Back to Top button. In an actual application,\n<code>nys-backtotop</code> would not be visible until the user scrolls\ndown the page.\n</p>\n</main>\n<footer>\n<nys-backtotop visible></nys-backtotop>\n<nys-unavfooter></nys-unavfooter>\n</footer>"
+              "lang": "html"
             },
             {
-              "title": "Left",
-              "code": "<footer>\n<nys-backtotop position=\"left\"></nys-backtotop>\n<!-- Other footer content -->\n</footer>",
-              "lang": "html",
-              "render": "<style>\ncode {\nwhite-space: nowrap;\npadding: var(--nys-space-1px) var(--nys-space-2px);\nborder-radius: var(--nys-radius-md);\ncolor: var(--nys-color-red-600);\nbackground: var(--nys-color-neutral-10);\nfont-size: var(--nys-font-size-sm);\n}\nnys-button {\nposition: fixed;\nbottom: 1rem;\nright: 1rem;\n--_nys-button-border-radius: var(--nys-radius-round);\n}\n</style>\n<nys-unavheader hideTranslate hideSearch></nys-unavheader>\n<nys-globalheader appName=\"Back to Top Example\"></nys-globalheader>\n<main style=\"padding: 0 2rem\">\n<h1>Sample Content on page</h1>\n<p>\nThis is a sample content area used to demonstrate the functionality of\nthe Back to Top button. In an actual application,\n<code>nys-backtotop</code> would not be visible until the user scrolls\ndown the page.\n</p>\n</main>\n<footer>\n<nys-backtotop visible position=\"left\"></nys-backtotop>\n<nys-button prefixIcon=\"sms\" variant=\"outline\" label=\"Chat with us\" size=\"sm\"></nys-button>\n<nys-unavfooter></nys-unavfooter>\n</footer>"
+              "title": "Always visible, left position",
+              "code": "<nys-backtotop visible position=\"left\"></nys-backtotop>",
+              "lang": "html"
             }
           ]
         }
@@ -1583,63 +1494,13 @@
           "summary": "Compact label for status, counts, or categorization with semantic styling.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-badge label=\"Basic badge\"></nys-badge>",
-              "lang": "html"
-            },
-            {
-              "title": "Error Intent",
-              "code": "<nys-badge label=\"Error\" intent=\"error\" prefixIcon></nys-badge>",
-              "lang": "html"
-            },
-            {
-              "title": "Warning Intent",
-              "code": "<nys-badge label=\"Warning\" intent=\"warning\" prefixIcon></nys-badge>",
-              "lang": "html"
-            },
-            {
-              "title": "Success Intent",
-              "code": "<nys-badge label=\"Success\" intent=\"success\" prefixIcon></nys-badge>",
-              "lang": "html"
-            },
-            {
-              "title": "Strong Neutral",
-              "code": "<nys-badge variant=\"strong\" label=\"Neutral\" prefixIcon></nys-badge>",
-              "lang": "html"
-            },
-            {
-              "title": "Strong Error",
-              "code": "<nys-badge variant=\"strong\" label=\"Error\" intent=\"error\" prefixIcon></nys-badge>",
-              "lang": "html"
-            },
-            {
-              "title": "Strong Warning",
-              "code": "<nys-badge variant=\"strong\" label=\"Warning\" intent=\"warning\" prefixIcon></nys-badge>",
-              "lang": "html"
-            },
-            {
-              "title": "Strong Success",
-              "code": "<nys-badge variant=\"strong\" label=\"Success\" intent=\"success\" prefixIcon></nys-badge>",
-              "lang": "html"
-            },
-            {
-              "title": "Custom Prefix Icon",
-              "code": "<nys-badge label=\"Custom prefixIcon\" prefixIcon=\"check\"></nys-badge>",
-              "lang": "html"
-            },
-            {
-              "title": "Custom Suffix Icon",
-              "code": "<nys-badge label=\"Custom suffixIcon\" suffixIcon=\"check\"></nys-badge>",
-              "lang": "html"
-            },
-            {
-              "title": "Size Small",
-              "code": "<nys-badge label=\"Small\" size=\"sm\"></nys-badge>",
+              "title": "Status badge",
+              "code": "<nys-badge intent=\"success\" label=\"Approved\" prefixIcon></nys-badge>",
               "lang": "html"
             },
             {
-              "title": "Screen reader text",
-              "code": "<nys-badge intent=\"warning\" label=\"Caution\" prefixIcon srText=\"concern\"></nys-badge>",
+              "title": "Count badge",
+              "code": "<nys-badge prefixLabel=\"Messages\" label=\"12\"></nys-badge>",
               "lang": "html"
             }
           ]
@@ -1685,11 +1546,11 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "A breadcrumb navigation trail composed of `li` elements.\nCollapses when the trail exceeds 5 items on desktop or 3 items on mobile,\nshowing the first, last, and item before the current page, with an ellipsis to expand.\nA single item renders as a back-to-parent link instead of a trail.",
+          "description": "A breadcrumb navigation trail composed of `nys-breadcrumbitem` elements.\nCollapses when the trail exceeds 5 items on desktop or 3 items on mobile,\nshowing the first, last, and item before the current page, with an ellipsis to expand.\nA single item renders as a back-to-parent link instead of a trail.",
           "name": "NysBreadcrumbs",
           "slots": [
             {
-              "description": "One or more `li` elements defining the trail.",
+              "description": "One or more `nys-breadcrumbitem` elements defining the trail.",
               "name": ""
             }
           ],
@@ -1719,7 +1580,7 @@
               "kind": "field",
               "name": "size",
               "type": {
-                "text": "\"sm\" | \"md\""
+                "text": "\"sm\" | \"md\" | \"\""
               },
               "default": "\"md\"",
               "description": "Controls the visual size of the breadcrumb text and spacing: `sm` for dense layouts, `md` (default) for standard use.",
@@ -1942,7 +1803,7 @@
             {
               "name": "size",
               "type": {
-                "text": "\"sm\" | \"md\""
+                "text": "\"sm\" | \"md\" | \"\""
               },
               "default": "\"md\"",
               "description": "Controls the visual size of the breadcrumb text and spacing: `sm` for dense layouts, `md` (default) for standard use.",
@@ -1999,43 +1860,18 @@
           "summary": "Breadcrumb navigation trail with responsive collapse support.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-breadcrumbs>\n<ol>\n<li><a href=\"/\">Home</a></li>\n<li><a href=\"/services\">Services</a></li>\n</ol>\n</nys-breadcrumbs>",
-              "lang": "html"
-            },
-            {
-              "title": "Current page",
+              "title": "Full trail with current page",
               "code": "<nys-breadcrumbs>\n<ol>\n<li><a href=\"/\">Home</a></li>\n<li><a href=\"/services\">Services</a></li>\n<li>Current Page</li>\n</ol>\n</nys-breadcrumbs>",
               "lang": "html"
             },
             {
-              "title": "Single item list",
-              "code": "<nys-breadcrumbs>\n<ol>\n<li><a href=\"/services\">Services</a></li>\n</ol>\n</nys-breadcrumbs>",
-              "lang": "html"
-            },
-            {
-              "title": "Long list",
-              "code": "<nys-breadcrumbs>\n<ol>\n<li><a href=\"/\">Home</a></li>\n<li><a href=\"/government\">Government</a></li>\n<li><a href=\"/government/agencies\">Agencies</a></li>\n<li><a href=\"/government/agencies/parks\">Parks & Recreation</a></li>\n<li><a href=\"/parks/state-parks\">State Parks</a></li>\n<li><a href=\"/parks/state-parks/delaware\">Delaware Region</a></li>\n<li><a href=\"/parks/state-parks/delaware/water-gap\">Delaware Water Gap</a></li>\n<li>Trail Conditions</li>\n</ol>\n</nys-breadcrumbs>",
-              "lang": "html"
-            },
-            {
-              "title": "Size small",
-              "code": "<nys-breadcrumbs size=\"sm\">\n<ol>\n<li><a href=\"/\">Home</a></li>\n<li><a href=\"/government\">Government</a></li>\n<li><a href=\"/government/agencies\">Agencies</a></li>\n<li>Parks & Recreation</li>\n</ol>\n</nys-breadcrumbs>",
-              "lang": "html"
-            },
-            {
-              "title": "Back to parent (mobile)",
-              "code": "<nys-breadcrumbs backToParent>\n<ol>\n<li><a href=\"/\">Home</a></li>\n<li><a href=\"/government\">Government</a></li>\n<li><a href=\"/government/agencies\">Agencies</a></li>\n<li><a href=\"/government/agencies/parks\">Parks & Recreation</a></li>\n<li><a href=\"/parks/state-parks\">State Parks</a></li>\n<li><a href=\"/parks/state-parks/delaware\">Delaware Region</a></li>\n<li><a href=\"/parks/state-parks/delaware/water-gap\">Delaware Water Gap</a></li>\n<li>Trail Conditions</li>\n</ol>\n</nys-breadcrumbs>",
-              "lang": "html"
-            },
-            {
-              "title": "Background bar",
-              "code": "<nys-breadcrumbs backgroundBar>\n<ol>\n<li><a href=\"/\">Home</a></li>\n<li><a href=\"/services\">Services</a></li>\n<li><a href=\"/tickets\">Ticket System</a></li>\n<li>Del Water Gap</li>\n</ol>\n</nys-breadcrumbs>",
+              "title": "Trail without current page",
+              "code": "<nys-breadcrumbs>\n<ol>\n<li><a href=\"/\">Home</a></li>\n<li><a href=\"/services\">Services</a></li>\n</ol>\n</nys-breadcrumbs>",
               "lang": "html"
             },
             {
-              "title": "Disabled",
-              "code": "<nys-breadcrumbs disabled>\n<ol>\n<li><a href=\"/\">Home</a></li>\n<li><a href=\"/services\">Services</a></li>\n<li><a href=\"/tickets\">Ticket System</a></li>\n<li>Del Water Gap</li>\n</ol>\n</nys-breadcrumbs>",
+              "title": "Single item renders as back-to-parent",
+              "code": "<nys-breadcrumbs>\n<ol>\n<li><a href=\"/services\">Services</a></li>\n</ol>\n</nys-breadcrumbs>",
               "lang": "html"
             }
           ]
@@ -2122,10 +1958,6 @@
             }
           ],
           "slots": [
-            {
-              "description": "Button label text. Use as fallback when `label` prop is not provided.",
-              "name": ""
-            },
             {
               "description": "Icon before label. Not shown for `text` variant.",
               "name": "prefix-icon"
@@ -2769,38 +2601,18 @@
           "summary": "Button for actions and CTAs with variants, sizes, and icon support.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-button label=\"Button\" variant=\"filled\"></nys-button>",
-              "lang": "html"
-            },
-            {
-              "title": "Variant Outline",
-              "code": "<nys-button label=\"Button\" variant=\"outline\"></nys-button>",
-              "lang": "html"
-            },
-            {
-              "title": "Variant Ghost",
-              "code": "<nys-button label=\"Button\" variant=\"ghost\"></nys-button>",
-              "lang": "html"
-            },
-            {
-              "title": "Variant Text",
-              "code": "<nys-button label=\"Button\" variant=\"text\"></nys-button>",
-              "lang": "html"
-            },
-            {
-              "title": "Prefix Icon",
-              "code": "<nys-button label=\"Previous\" prefixIcon=\"chevron_left\"></nys-button>",
+              "title": "Basic filled button",
+              "code": "<nys-button label=\"Submit\" variant=\"filled\"></nys-button>",
               "lang": "html"
             },
             {
-              "title": "Suffix Icon",
-              "code": "<nys-button label=\"Next\" suffixIcon=\"chevron_right\"></nys-button>",
+              "title": "Secondary outline button",
+              "code": "<nys-button label=\"Cancel\" variant=\"outline\"></nys-button>",
               "lang": "html"
             },
             {
-              "title": "Slotted Icons",
-              "code": "<nys-button label=\"Slotted icons\">\n<nys-icon color=\"#db117d\" slot=\"prefix-icon\" name=\"chevron_left\"></nys-icon>\n<nys-icon color=\"#db117d\" slot=\"suffix-icon\" name=\"chevron_right\"></nys-icon>\n</nys-button>",
+              "title": "Button with icons",
+              "code": "<nys-button label=\"Previous\" prefixIcon=\"chevron_left\"></nys-button>\n<nys-button label=\"Next\" suffixIcon=\"chevron_right\"></nys-button>",
               "lang": "html"
             },
             {
@@ -2809,38 +2621,12 @@
               "lang": "html"
             },
             {
-              "title": "Size Small",
-              "code": "<nys-button label=\"Small\" size=\"sm\"></nys-button>",
-              "lang": "html"
-            },
-            {
-              "title": "Size Large",
-              "code": "<nys-button label=\"Large\" size=\"lg\"></nys-button>",
-              "lang": "html"
-            },
-            {
-              "title": "Full width",
-              "code": "<nys-button label=\"Full width\" fullWidth></nys-button>",
-              "lang": "html"
-            },
-            {
-              "title": "Inverted",
-              "code": "<nys-button label=\"Inverted\" inverted></nys-button>",
-              "lang": "html",
-              "render": "<div style=\"background: #1b1b1b; padding: 1rem;\">\n<nys-button label=\"Inverted\" inverted></nys-button>\n</div>"
-            },
-            {
-              "title": "Disabled",
-              "code": "<nys-button label=\"Disabled\" disabled></nys-button>",
-              "lang": "html"
-            },
-            {
-              "title": "Href",
+              "title": "Link-style button for navigation",
               "code": "<nys-button label=\"Visit NY.gov\" href=\"https://www.ny.gov/\" target=\"_blank\" suffixIcon=\"open_in_new\"></nys-button>",
               "lang": "html"
             },
             {
-              "title": "Type",
+              "title": "Form submit button",
               "code": "<nys-button type=\"submit\" label=\"Save Changes\" variant=\"filled\"></nys-button>",
               "lang": "html"
             }
@@ -3513,13 +3299,13 @@
           "summary": "Checkbox for binary choices or multi-select options.",
           "examples": [
             {
-              "title": "Single",
-              "code": "<nys-checkbox label=\"I agree to the terms\" name=\"terms\"></nys-checkbox>",
+              "title": "Single checkbox",
+              "code": "<nys-checkbox label=\"I agree to the terms\" name=\"terms\" required></nys-checkbox>",
               "lang": "html"
             },
             {
-              "title": "Preselected",
-              "code": "<nys-checkbox label=\"I agree to the terms\" name=\"terms\" checked></nys-checkbox>",
+              "title": "Checkbox group",
+              "code": "<nys-checkboxgroup label=\"Select landmarks\">\n<nys-checkbox name=\"landmarks\" value=\"adirondacks\" label=\"Adirondacks\"></nys-checkbox>\n<nys-checkbox name=\"landmarks\" value=\"niagara\" label=\"Niagara Falls\"></nys-checkbox>\n</nys-checkboxgroup>",
               "lang": "html"
             }
           ]
@@ -4032,54 +3818,9 @@
           "summary": "Container for grouping checkboxes as a single form control.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-checkboxgroup label=\"Select landmarks\" required>\n<nys-checkbox name=\"landmarks\" value=\"adirondacks\" label=\"Adirondacks\"></nys-checkbox>\n<nys-checkbox name=\"landmarks\" value=\"niagara\" label=\"Niagara Falls\"></nys-checkbox>\n</nys-checkboxgroup>",
-              "lang": "html"
-            },
-            {
-              "title": "Tile",
-              "code": "<nys-checkboxgroup label=\"Select landmarks\" tile>\n<nys-checkbox name=\"landmarks\" value=\"adirondacks\" label=\"Adirondacks\"></nys-checkbox>\n<nys-checkbox name=\"landmarks\" value=\"niagara\" label=\"Niagara Falls\"></nys-checkbox>\n</nys-checkboxgroup>",
-              "lang": "html"
-            },
-            {
-              "title": "Required",
+              "title": "Basic checkbox group",
               "code": "<nys-checkboxgroup label=\"Select landmarks\" required>\n<nys-checkbox name=\"landmarks\" value=\"adirondacks\" label=\"Adirondacks\"></nys-checkbox>\n<nys-checkbox name=\"landmarks\" value=\"niagara\" label=\"Niagara Falls\"></nys-checkbox>\n</nys-checkboxgroup>",
               "lang": "html"
-            },
-            {
-              "title": "Optional",
-              "code": "<nys-checkboxgroup label=\"Select landmarks\" optional>\n<nys-checkbox name=\"landmarks\" value=\"adirondacks\" label=\"Adirondacks\"></nys-checkbox>\n<nys-checkbox name=\"landmarks\" value=\"niagara\" label=\"Niagara Falls\"></nys-checkbox>\n</nys-checkboxgroup>",
-              "lang": "html"
-            },
-            {
-              "title": "Disabled",
-              "code": "<nys-checkboxgroup label=\"Select landmarks\">\n<nys-checkbox name=\"landmarks\" value=\"adirondacks\" label=\"Adirondacks\" disabled></nys-checkbox>\n<nys-checkbox name=\"landmarks\" value=\"niagara\" label=\"Niagara Falls\" disabled></nys-checkbox>\n</nys-checkboxgroup>",
-              "lang": "html"
-            },
-            {
-              "title": "Size Small",
-              "code": "<nys-checkboxgroup label=\"Select landmarks\" size=\"sm\">\n<nys-checkbox name=\"landmarks\" value=\"adirondacks\" label=\"Adirondacks\"></nys-checkbox>\n<nys-checkbox name=\"landmarks\" value=\"niagara\" label=\"Niagara Falls\"></nys-checkbox>\n</nys-checkboxgroup>",
-              "lang": "html"
-            },
-            {
-              "title": "Other Option",
-              "code": "<nys-checkboxgroup label=\"Select landmarks\">\n<nys-checkbox name=\"landmarks\" value=\"adirondacks\" label=\"Adirondacks\"></nys-checkbox>\n<nys-checkbox name=\"landmarks\" value=\"niagara\" label=\"Niagara Falls\"></nys-checkbox>\n<nys-checkbox name=\"landmarks\" value=\"\" label=\"Other\" other></nys-checkbox>\n</nys-checkboxgroup>",
-              "lang": "html"
-            },
-            {
-              "title": "Error Message",
-              "code": "<nys-checkboxgroup label=\"Select landmarks\" showError errorMessage=\"Please select at least one landmark\">\n<nys-checkbox name=\"landmarks\" value=\"adirondacks\" label=\"Adirondacks\"></nys-checkbox>\n<nys-checkbox name=\"landmarks\" value=\"niagara\" label=\"Niagara Falls\"></nys-checkbox>\n</nys-checkboxgroup>",
-              "lang": "html"
-            },
-            {
-              "title": "Description",
-              "code": "<nys-checkboxgroup label=\"Select landmarks\" description=\"Choose wisely, you can only pick one.\">\n<nys-checkbox name=\"landmarks\" value=\"adirondacks\" label=\"Adirondacks\"></nys-checkbox>\n<nys-checkbox name=\"landmarks\" value=\"niagara\" label=\"Niagara Falls\"></nys-checkbox>\n</nys-checkboxgroup>",
-              "lang": "html"
-            },
-            {
-              "title": "Description Slot",
-              "code": "<nys-checkboxgroup label=\"Select landmarks\">\n<div slot=\"description\">Your <strong>ABSOLUTE</strong> favorite one.</div>\n<nys-checkbox name=\"landmarks\" value=\"adirondacks\" label=\"Adirondacks\"></nys-checkbox>\n<nys-checkbox name=\"landmarks\" value=\"niagara\" label=\"Niagara Falls\"></nys-checkbox>\n</nys-checkboxgroup>",
-              "lang": "html"
             }
           ]
         }
@@ -4806,67 +4547,6 @@
             "name": "LitElement",
             "package": "lit"
           },
-          "examples": [
-            {
-              "title": "Basic",
-              "code": "<nys-combobox label=\"Select your favorite fruit\">\n<option value=\"apple\">Apple</option>\n<option value=\"banana\">Banana</option>\n<option value=\"cherry\">Cherry</option>\n<option value=\"date\">Date</option>\n<option value=\"elderberry\">Elderberry</option>\n<option value=\"fig\">Fig</option>\n<option value=\"grape\">Grape</option>\n<option value=\"honeydew\">Honeydew</option>\n<option value=\"kiwi\">Kiwi</option>\n<option value=\"lemon\">Lemon</option>\n<option value=\"mango\">Mango</option>\n<option value=\"nectarine\">Nectarine</option>\n<option value=\"orange\">Orange</option>\n<option value=\"papaya\">Papaya</option>\n<option value=\"quince\">Quince</option>\n<option value=\"raspberry\">Raspberry</option>\n<option value=\"strawberry\">Strawberry</option>\n<option value=\"tangerine\">Tangerine</option>\n<option value=\"watermelon\">Watermelon</option>\n</nys-combobox>",
-              "lang": "html"
-            },
-            {
-              "title": "Default Value",
-              "code": "<nys-combobox label=\"Select your favorite fruit\" value=\"mango\">\n<option value=\"apple\">Apple</option>\n<option value=\"banana\">Banana</option>\n<option value=\"mango\" selected>Mango</option>\n<option value=\"orange\">Orange</option>\n<option value=\"strawberry\">Strawberry</option>\n</nys-combobox>",
-              "lang": "html"
-            },
-            {
-              "title": "Option Group",
-              "code": "<nys-combobox label=\"Select a fruit\" description=\"Fruits organized by category\">\n<optgroup label=\"Citrus\">\n<option value=\"lemon\">Lemon</option>\n<option value=\"lime\">Lime</option>\n<option value=\"orange\">Orange</option>\n<option value=\"grapefruit\">Grapefruit</option>\n<option value=\"tangerine\">Tangerine</option>\n</optgroup>\n<optgroup label=\"Berries\">\n<option value=\"strawberry\">Strawberry</option>\n<option value=\"blueberry\">Blueberry</option>\n<option value=\"raspberry\">Raspberry</option>\n<option value=\"blackberry\">Blackberry</option>\n<option value=\"cranberry\">Cranberry</option>\n</optgroup>\n<optgroup label=\"Tropical\">\n<option value=\"mango\">Mango</option>\n<option value=\"pineapple\">Pineapple</option>\n<option value=\"papaya\">Papaya</option>\n<option value=\"coconut\">Coconut</option>\n<option value=\"passionfruit\">Passionfruit</option>\n</optgroup>\n<optgroup label=\"Stone Fruits\">\n<option value=\"peach\">Peach</option>\n<option value=\"plum\">Plum</option>\n<option value=\"cherry\">Cherry</option>\n<option value=\"apricot\">Apricot</option>\n<option value=\"nectarine\">Nectarine</option>\n</optgroup>\n</nys-combobox>",
-              "lang": "html"
-            },
-            {
-              "title": "Disabled",
-              "code": "<nys-combobox label=\"Select your favorite fruit\" disabled>\n<option value=\"apple\">Apple</option>\n<option value=\"banana\">Banana</option>\n<option value=\"orange\">Orange</option>\n<option value=\"strawberry\">Strawberry</option>\n</nys-combobox>",
-              "lang": "html"
-            },
-            {
-              "title": "Required",
-              "code": "<nys-combobox label=\"Select your favorite fruit\" required>\n<option value=\"apple\">Apple</option>\n<option value=\"banana\">Banana</option>\n<option value=\"orange\">Orange</option>\n<option value=\"strawberry\">Strawberry</option>\n</nys-combobox>",
-              "lang": "html"
-            },
-            {
-              "title": "Optional",
-              "code": "<nys-combobox label=\"Select your favorite fruit\" optional>\n<option value=\"apple\">Apple</option>\n<option value=\"banana\">Banana</option>\n<option value=\"orange\">Orange</option>\n<option value=\"strawberry\">Strawberry</option>\n</nys-combobox>",
-              "lang": "html"
-            },
-            {
-              "title": "Width Medium",
-              "code": "<nys-combobox label=\"Select your favorite fruit\" width=\"md\">\n<option value=\"apple\">Apple</option>\n<option value=\"banana\">Banana</option>\n<option value=\"orange\">Orange</option>\n<option value=\"strawberry\">Strawberry</option>\n</nys-combobox>",
-              "lang": "html"
-            },
-            {
-              "title": "Width Large",
-              "code": "<nys-combobox label=\"Select your favorite fruit\" width=\"lg\">\n<option value=\"apple\">Apple</option>\n<option value=\"banana\">Banana</option>\n<option value=\"orange\">Orange</option>\n<option value=\"strawberry\">Strawberry</option>\n</nys-combobox>",
-              "lang": "html"
-            },
-            {
-              "title": "Description",
-              "code": "```html\n<nys-combobox label=\"Select your favorite fruit\" description=\"Choose from the list of available fruits.\">\n<option value=\"apple\">Apple</option>\n<option value=\"banana\">Banana</option>\n<option value=\"orange\">Orange</option>\n<option value=\"strawberry\">Strawberry</option>\n</nys-combobox>\n```d"
-            },
-            {
-              "title": "Description Slot",
-              "code": "<nys-combobox label=\"Select your favorite fruit\">\n<label slot=\"description\">This is a description slot</label>\n<option value=\"apple\">Apple</option>\n<option value=\"banana\">Banana</option>\n<option value=\"orange\">Orange</option>\n<option value=\"strawberry\">Strawberry</option>\n</nys-combobox>",
-              "lang": "html"
-            },
-            {
-              "title": "Error Message",
-              "code": "<nys-combobox label=\"Select your favorite fruit\" showError errorMessage=\"Please select a fruit\">\n<option value=\"apple\">Apple</option>\n<option value=\"banana\">Banana</option>\n<option value=\"orange\">Orange</option>\n<option value=\"strawberry\">Strawberry</option>\n</nys-combobox>",
-              "lang": "html"
-            },
-            {
-              "title": "Disabled Options",
-              "code": "<nys-combobox label=\"Select your favorite fruit\" description=\"Some fruits are out of season\">\n<option value=\"apple\">Apple</option>\n<option value=\"banana\">Banana</option>\n<option value=\"cherry\" disabled>Cherry (Out of season)</option>\n<option value=\"mango\">Mango</option>\n<option value=\"strawberry\" disabled>Strawberry (Out of season)</option>\n<option value=\"orange\">Orange</option>\n</nys-combobox>",
-              "lang": "html"
-            }
-          ],
           "tagName": "nys-combobox",
           "customElement": true
         }
@@ -5673,53 +5353,23 @@
           "summary": "Date picker with calendar popup and native fallback.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-datepicker\nid=\"my-datepicker\"\nname=\"my-datepicker\"\nlabel=\"Schedule an appointment\"\ndescription=\"Enter in MM/DD/YYYY format\"\n></nys-datepicker>",
+              "title": "Basic date picker",
+              "code": "<nys-datepicker label=\"Birth Date\" required></nys-datepicker>",
               "lang": "html"
             },
             {
-              "title": "Width Large",
+              "title": "With width and description",
               "code": "<nys-datepicker\nlabel=\"Event Date\"\ndescription=\"Select the date of your event\"\nwidth=\"lg\">\n</nys-datepicker>",
               "lang": "html"
             },
             {
-              "title": "Width Full",
-              "code": "<nys-datepicker\nlabel=\"Event Date\"\ndescription=\"Select the date of your event\"\nwidth=\"full\">\n</nys-datepicker>",
-              "lang": "html"
-            },
-            {
-              "title": "Custom Start Date",
-              "code": "<nys-datepicker\nlabel=\"Appointment\"\nstartDate=\"2024-01-01\">\n</nys-datepicker>",
-              "lang": "html"
-            },
-            {
-              "title": "Without Buttons",
-              "code": "<nys-datepicker\nlabel=\"Appointment\"\nhideTodayButton\nhideClearButton>\n</nys-datepicker>",
-              "lang": "html"
-            },
-            {
-              "title": "Error Message",
-              "code": "<nys-datepicker\nlabel=\"Start Date\"\nshowError\nerrorMessage=\"Please select a valid start date\">\n</nys-datepicker>",
-              "lang": "html"
-            },
-            {
-              "title": "Date Range",
-              "code": "<nys-datepicker\nlabel=\"Select a date\"\ndescription=\"Only dates within April 4/5/2026 - 7/15/2026 are selectable\"\nminDate=\"2026-04-05\"\nmaxDate=\"2026-07-15\">\n</nys-datepicker>",
+              "title": "Hide buttons, set start date",
+              "code": "<nys-datepicker\nlabel=\"Appointment\"\nhideTodayButton\nhideClearButton\nstartDate=\"2024-01-01\">\n</nys-datepicker>",
               "lang": "html"
             },
             {
-              "title": "Disabled",
-              "code": "<nys-datepicker\nlabel=\"Disabled datepicker\"\ndisabled\nvalue=\"2025-01-15\">\n</nys-datepicker>",
-              "lang": "html"
-            },
-            {
-              "title": "Required",
-              "code": "<nys-datepicker\nlabel=\"Start Date\"\nrequired>\n</nys-datepicker>",
-              "lang": "html"
-            },
-            {
-              "title": "Optional",
-              "code": "<nys-datepicker\nlabel=\"Start Date\"\noptional>\n</nys-datepicker>",
+              "title": "With validation error message",
+              "code": "<nys-datepicker\nlabel=\"Start Date\"\nrequired\nerrorMessage=\"Please select a valid start date\">\n</nys-datepicker>",
               "lang": "html"
             }
           ]
@@ -5836,20 +5486,9 @@
           "summary": "Horizontal divider for visual separation of content sections.",
           "examples": [
             {
-              "title": "Basic",
+              "title": "Basic divider",
               "code": "<p>Section one content</p>\n<nys-divider></nys-divider>\n<p>Section two content</p>",
               "lang": "html"
-            },
-            {
-              "title": "Inverted",
-              "code": "<p>Section one content</p>\n<nys-divider inverted></nys-divider>\n<p>Section two content</p>",
-              "lang": "html",
-              "render": "<div style=\"display: flex; flex-direction: column; background-color: var(--nys-color-ink, #1b1b1b); color: var(--nys-color-ink-reverse, #fff); padding: var(--nys-space-200, 16px);\">\n<p>Section one content</p>\n<nys-divider inverted></nys-divider>\n<p>Section two content</p>\n</div>"
-            },
-            {
-              "title": "Subtle",
-              "code": "<p>Section one content</p>\n<nys-divider subtle></nys-divider>\n<p>Section two content</p>",
-              "lang": "html"
             }
           ]
         }
@@ -5902,7 +5541,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "Dropdown menus enable users to select an action from a list of options.\nThey’re commonly used to save space by grouping related actions, or to provide actions in a confined space.",
+          "description": "",
           "name": "NysDropdownMenu",
           "members": [
             {
@@ -6279,16 +5918,7 @@
             "package": "lit"
           },
           "tagName": "nys-dropdownmenu",
-          "customElement": true,
-          "summary": "Action menu with auto-positioning, keyboard support, and screen reader integration.",
-          "examples": [
-            {
-              "title": "Basic",
-              "code": "<nys-button id=\"my-trigger-id\" label=\"Open Menu\"></nys-button>\n<nys-dropdownmenu id=\"my-dropdownmenu\" for=\"my-trigger-id\">\n<nys-dropdownmenuitem label=\"Profile\" href=\"/profile\"></nys-dropdownmenuitem>\n<nys-dropdownmenuitem label=\"Repositories & Github Pages\" href=\"/repos\"></nys-dropdownmenuitem>\n<nys-dropdownmenuitem label=\"Organizations\" href=\"/organizations\"></nys-dropdownmenuitem>\n<nys-dropdownmenuitem label=\"Sign out\" href=\"/logout\"></nys-dropdownmenuitem>\n</nys-dropdownmenu>\n</div>",
-              "lang": "html",
-              "render": "<div style=\"margin: 200px; display: flex; justify-content: center; align-items: center;\">\n<nys-button id=\"my-trigger-id\" label=\"Open Menu\"></nys-button>\n<nys-dropdownmenu id=\"my-dropdownmenu\" for=\"my-trigger-id\">\n<nys-dropdownmenuitem label=\"Profile\" href=\"/profile\"></nys-dropdownmenuitem>\n<nys-dropdownmenuitem label=\"Repositories & Github Pages\" href=\"/repos\"></nys-dropdownmenuitem>\n<nys-dropdownmenuitem label=\"Organizations\" href=\"/organizations\"></nys-dropdownmenuitem>\n<nys-dropdownmenuitem label=\"Sign out\" href=\"/logout\"></nys-dropdownmenuitem>\n</nys-dropdownmenu>\n</div>"
-            }
-          ]
+          "customElement": true
         }
       ],
       "exports": [
@@ -6467,7 +6097,19 @@
           },
           "tagName": "nys-dropdownmenuitem",
           "customElement": true,
-          "summary": "Dropdown item to display label and provide href link."
+          "summary": "Dropdown item to display label and provide href link.",
+          "examples": [
+            {
+              "title": "Basic item",
+              "code": "<nys-dropdownmenuitem label=\"Edit\" link=\"/edit\"></nys-dropdownmenuitem>",
+              "lang": "html"
+            },
+            {
+              "title": "Disabled item",
+              "code": "<nys-dropdownmenuitem label=\"Delete\" link=\"/delete\" disabled></nys-dropdownmenuitem>",
+              "lang": "html"
+            }
+          ]
         }
       ],
       "exports": [
@@ -6604,19 +6246,7 @@
           },
           "tagName": "nys-errormessage",
           "customElement": true,
-          "summary": "Internal error message display with icon and ARIA alert support.",
-          "examples": [
-            {
-              "title": "Basic",
-              "code": "<nys-errormessage showError errorMessage=\"This is an error message\"></nys-errormessage>",
-              "lang": "html"
-            },
-            {
-              "title": "Divider",
-              "code": "<nys-errormessage showError errorMessage=\"This is an error message\" showDivider></nys-errormessage>",
-              "lang": "html"
-            }
-          ]
+          "summary": "Internal error message display with icon and ARIA alert support."
         }
       ],
       "exports": [
@@ -7324,48 +6954,13 @@
           "summary": "File input with drag-and-drop, validation, and progress tracking.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-fileinput\nlabel=\"Upload a file\"\n></nys-fileinput>",
-              "lang": "html"
-            },
-            {
-              "title": "Dropzone",
-              "code": "<nys-fileinput\nlabel=\"Upload a file\"\ndropzone\n></nys-fileinput>",
-              "lang": "html"
-            },
-            {
-              "title": "Multiple",
-              "code": "<nys-fileinput\nlabel=\"Upload a file\"\nmultiple\n></nys-fileinput>",
-              "lang": "html"
-            },
-            {
-              "title": "Accepted Filetypes",
-              "code": "<nys-fileinput\nlabel=\"Upload a file\"\ndescription=\"Accepted file types: .jpg, .png, .pdf\"\naccept=\"image/png, image/jpeg, .pdf\"\n></nys-fileinput>",
-              "lang": "html"
-            },
-            {
-              "title": "Width Large",
-              "code": "<nys-fileinput\nlabel=\"Upload a file\"\nwidth=\"lg\"\n></nys-fileinput>",
-              "lang": "html"
-            },
-            {
-              "title": "Width Large Dropzone",
-              "code": "<nys-fileinput\nlabel=\"Upload a file\"\nwidth=\"lg\"\ndropzone\n></nys-fileinput>",
+              "title": "Single file upload",
+              "code": "<nys-fileinput label=\"Upload document\" accept=\".pdf,.doc\" required></nys-fileinput>",
               "lang": "html"
             },
             {
-              "title": "Disabled",
-              "code": "<nys-fileinput\nlabel=\"Upload a file\"\ndisabled\n></nys-fileinput>",
-              "lang": "html"
-            },
-            {
-              "title": "Description",
-              "code": "<nys-fileinput\nlabel=\"Upload a file\"\ndescription=\"Make sure the file is not blurry and readable\"\n></nys-fileinput>",
-              "lang": "html"
-            },
-            {
-              "title": "Description Slot",
-              "code": "<nys-fileinput label=\"Upload a file\">\n<div slot=\"description\">Make sure the file is <strong>legible</strong></div>\n</nys-fileinput>",
+              "title": "Multiple files with dropzone",
+              "code": "<nys-fileinput label=\"Upload images\" accept=\"image/*\" multiple dropzone></nys-fileinput>",
               "lang": "html"
             }
           ]
@@ -7702,28 +7297,8 @@
           "summary": "Agency footer with auto-layout for contact info and link sections.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-globalfooter agencyName=\"Office of Information Technology Services\"></nys-globalfooter>",
-              "lang": "html"
-            },
-            {
-              "title": "Homepage Link",
-              "code": "<nys-globalfooter\nagencyName=\"Office of Information Technology Services\"\nhomepageLink=\"https://its.ny.gov\"\n></nys-globalfooter>",
-              "lang": "html"
-            },
-            {
-              "title": "Menu Links",
-              "code": "<nys-globalfooter agencyName=\"Office of Information Technology Services\">\n<ul>\n<li><a href=\"https://its.ny.gov\">ITS Home</a></li>\n<li><a href=\"https://its.ny.gov/about-us\">About ITS</a></li>\n</ul>\n</nys-globalfooter>",
-              "lang": "html"
-            },
-            {
-              "title": "Column Links",
-              "code": "<nys-globalfooter agencyName=\"Office of Information Technology Services\">\n<ul>\n<li>\n<span>About</span>\n<ul>\n<li><a href=\"https://its.ny.gov/about-us\">About ITS</a></li>\n<li><a href=\"https://its.ny.gov/contact-us\">Contact</a></li>\n<li><a href=\"https://its.ny.gov/policies\">Policies</a></li>\n</ul>\n</li>\n<li>\n<span>Resources</span>\n<ul>\n<li><a href=\"https://its.ny.gov/resources\">Developer Tools</a></li>\n<li><a href=\"https://its.ny.gov/accessibility\">Accessibility</a></li>\n<li><a href=\"https://its.ny.gov/privacy\">Privacy</a></li>\n</ul>\n</li>\n</ul>\n</nys-globalfooter>",
-              "lang": "html"
-            },
-            {
-              "title": "Subheading",
-              "code": "<nys-globalfooter\nagencyName=\"Office of Information Technology Services\"\nagencySubheading=\"Innovating Technology for a Better New York\"\n></nys-globalfooter>",
+              "title": "Simple footer",
+              "code": "<nys-globalfooter\nagencyName=\"Department of Health\"\nhomepageLink=\"/\"\nagencySubheading=\"Protecting and Promoting the Health of New Yorkers\"\n>\n<span>123 Main St, Albany NY</span>\n<span>info@health.ny.gov</span>\n</nys-globalfooter>",
               "lang": "html"
             }
           ]
@@ -7961,38 +7536,8 @@
           "summary": "Agency header with navigation, mobile menu, and active link highlighting.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-globalheader appName=\"User Registration Form\" agencyName=\"Office of Information Technology Services\"></nys-globalheader>",
-              "lang": "html"
-            },
-            {
-              "title": "Homepage Link",
-              "code": "<nys-globalheader\nagencyName=\"Office of Information Technology Services\"\nhomepageLink=\"https://its.ny.gov\"\n></nys-globalheader>",
-              "lang": "html"
-            },
-            {
-              "title": "Only Agency Name",
-              "code": "<nys-globalheader agencyName=\"Office of Information Technology Services\"></nys-globalheader>",
-              "lang": "html"
-            },
-            {
-              "title": "Only App Name",
-              "code": "<nys-globalheader appName=\"User Registration Form\"></nys-globalheader>",
-              "lang": "html"
-            },
-            {
-              "title": "With Links",
-              "code": "<nys-globalheader agencyName=\"Office of Information Technology Services\">\n<ul>\n<li><a href=\"https://its.ny.gov/services\">Services</a></li>\n<li><a href=\"https://its.ny.gov/get-help\">Help Center</a></li>\n<li><a href=\"https://its.ny.gov/cybersecurity\">Cybersecurity</a></li>\n<li><a href=\"https://its.ny.gov/policies\">Policies and Laws</a></li>\n<li><a href=\"https://its.ny.gov/procurement\">Procurement</a></li>\n<li><a href=\"https://its.ny.gov/about-us\">About Us</a></li>\n</ul>\n</nys-globalheader>",
-              "lang": "html"
-            },
-            {
-              "title": "User Actions",
-              "code": "<nys-globalheader agencyName=\"Office of Information Technology Services\">\n<nys-button slot=\"user-actions\" label=\"Log out\">\n<nys-avatar\nslot=\"prefix-icon\"\nariaLabel=\"User avatar\"\ninitials=\"NY\"\n></nys-avatar>\n</nys-button>\n</nys-globalheader>\n<nys-dropdownmenu id=\"dropdownmenu\" for=\"my-action-slot\">\n<nys-dropdownmenuitem label=\"Profile\" href=\"/profile\"></nys-dropdownmenuitem>\n<nys-dropdownmenuitem label=\"Repositories & Github Pages\" href=\"/repos\"></nys-dropdownmenuitem>\n<nys-dropdownmenuitem label=\"Organizations\" href=\"/organizations\" disabled></nys-dropdownmenuitem>\n<nys-dropdownmenuitem label=\"Sign out\" href=\"/logout\"></nys-dropdownmenuitem>\n</nys-dropdownmenu>",
-              "lang": "html"
-            },
-            {
-              "title": "With NYS Logo",
-              "code": "<nys-globalheader nysLogo appName=\"Admin Dashboard\"></nys-globalheader>",
+              "title": "Basic header",
+              "code": "<nys-globalheader appName=\"My App\" agencyName=\"Department of Health\" homepageLink=\"/\">\n<ul><li><a href=\"/about\">About</a></li><li><a href=\"/contact\">Contact</a></li></ul>\n</nys-globalheader>",
               "lang": "html"
             }
           ]
@@ -8038,7 +7583,7 @@
               }
             }
           ],
-          "description": "Clear one URL entry, or all cached icons (URL and inline) when no URL is given."
+          "description": "Clear one or all entries from the cache."
         },
         {
           "kind": "function",
@@ -8057,24 +7602,6 @@
             }
           ],
           "description": "Fetch and parse an SVG from a URL. Returns a cloned SVGElement (safe for multiple consumers)."
-        },
-        {
-          "kind": "function",
-          "name": "parseIcon",
-          "return": {
-            "type": {
-              "text": "SVGElement"
-            }
-          },
-          "parameters": [
-            {
-              "name": "source",
-              "type": {
-                "text": "string"
-              }
-            }
-          ],
-          "description": "Parse an inline SVG source string. Results are cached by source content,\nso repeated renders of the same icon sanitize/parse once. Returns a\ncloned SVGElement (safe for multiple consumers)."
         }
       ],
       "exports": [
@@ -8093,14 +7620,6 @@
             "name": "fetchIcon",
             "module": "packages/nys-icon/src/icon-cache.ts"
           }
-        },
-        {
-          "kind": "js",
-          "name": "parseIcon",
-          "declaration": {
-            "name": "parseIcon",
-            "module": "packages/nys-icon/src/icon-cache.ts"
-          }
         }
       ]
     },
@@ -8148,7 +7667,7 @@
               }
             }
           ],
-          "description": "Register or replace a named icon library. All watching icons using this library will redraw.\n\nIntended for custom/external libraries — the standard NYSDS set is\nbuilt in and needs no registration. Registering under `\"default\"`\nreplaces the built-in set (escape hatch).",
+          "description": "Register or replace a named icon library. All watching icons using this library will redraw.",
           "examples": [
             {
               "title": "Register a Font Awesome library with a custom resolver:",
@@ -8288,14 +7807,6 @@
             "module": "./icon-cache"
           }
         },
-        {
-          "kind": "js",
-          "name": "getIconLibrary",
-          "declaration": {
-            "name": "getIconLibrary",
-            "module": "./icon-library-registry"
-          }
-        },
         {
           "kind": "js",
           "name": "IconLibrary",
@@ -8304,14 +7815,6 @@
             "module": "./icon-library-registry"
           }
         },
-        {
-          "kind": "js",
-          "name": "IconResolution",
-          "declaration": {
-            "name": "IconResolution",
-            "module": "./icon-library-registry"
-          }
-        },
         {
           "kind": "js",
           "name": "registerIconLibrary",
@@ -8561,51 +8064,19 @@
           "summary": "SVG icon with swappable library support, size, rotation, and color options.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-icon name=\"check_circle\"></nys-icon>",
+              "title": "Basic icon (default NYSDS library)",
+              "code": "<nys-icon name=\"check_circle\" size=\"lg\"></nys-icon>",
               "lang": "html"
             },
             {
-              "title": "ARIA Label",
-              "code": "<nys-icon\nname=\"edit_square\"\nariaLabel=\"Edit content\"\n></nys-icon>",
+              "title": "Font Awesome icon",
+              "code": "<nys-icon name=\"house\" library=\"fa\" size=\"lg\"></nys-icon>",
               "lang": "html"
             },
             {
-              "title": "Size relative",
-              "code": "<nys-icon\nname=\"edit_square\"\nsize=\"4xl\"\n></nys-icon>",
+              "title": "Accessible icon with label",
+              "code": "<nys-icon name=\"warning\" ariaLabel=\"Warning\" color=\"var(--nys-color-warning)\"></nys-icon>",
               "lang": "html"
-            },
-            {
-              "title": "Size literal",
-              "code": "<nys-icon\nname=\"edit_square\"\nsize=\"24\"\n></nys-icon>",
-              "lang": "html"
-            },
-            {
-              "title": "Color",
-              "code": "<nys-icon\nname=\"edit_square\"\ncolor=\"#db117d\"\n></nys-icon>",
-              "lang": "html"
-            },
-            {
-              "title": "Rotate",
-              "code": "<nys-icon\nname=\"edit_square\"\nrotate=\"20\"\n></nys-icon>",
-              "lang": "html"
-            },
-            {
-              "title": "Flip",
-              "code": "<nys-icon\nname=\"edit_square\"\nflip=\"vertical\"\n></nys-icon>",
-              "lang": "html"
-            },
-            {
-              "title": "External Library - Font Awesome",
-              "code": "<nys-icon name=\"heart\" library=\"fa\"></nys-icon>",
-              "lang": "html",
-              "render": "<nys-icon name=\"heart\" library=\"fa\"></nys-icon>\n<script data-scope=\"module\">\nregisterIconLibrary(\"fa\", {\nresolver: (name) =>\n`https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6/svgs/solid/${name}.svg`,\nmutator: (svg) => {\nsvg.setAttribute(\"fill\", \"currentColor\");\n},\n});\n</script>"
-            },
-            {
-              "title": "External Library - Material",
-              "code": "<nys-icon name=\"favorite\" library=\"material\"></nys-icon>",
-              "lang": "html",
-              "render": "<nys-icon name=\"favorite\" library=\"material\"></nys-icon>\n<script data-scope=\"module\">\nregisterIconLibrary(\"material\", {\nresolver: (name) =>\n`https://fonts.gstatic.com/s/i/short-term/release/materialsymbolsoutlined/${name}/default/24px.svg`,\nmutator: (svg) => {\nsvg.setAttribute(\"fill\", \"currentColor\");\n},\n});\n</script>"
             }
           ]
         }
@@ -8802,40 +8273,9 @@
             "name": "LitElement",
             "package": "lit"
           },
-          "examples": [
-            {
-              "title": "Basic",
-              "code": "<nys-label label=\"This is a basic nys-label\"></nys-label>",
-              "lang": "html"
-            },
-            {
-              "title": "Required",
-              "code": "<nys-label label=\"This form is required\" flag=\"required\"></nys-label>",
-              "lang": "html"
-            },
-            {
-              "title": "Optional",
-              "code": "<nys-label label=\"This form is required\" flag=\"optional\"></nys-label>",
-              "lang": "html"
-            },
-            {
-              "title": "Description",
-              "code": "<nys-label label=\"Label Text\" description=\"Description text\"></nys-label>",
-              "lang": "html"
-            },
-            {
-              "title": "Description Slot",
-              "code": "<nys-label label=\"Label Text\">\n<p slot=\"description\">Rich text description passed in <strong>HERE</strong></p>\n</nys-label>",
-              "lang": "html"
-            },
-            {
-              "title": "With Tooltip",
-              "code": "<nys-label id=\"label-id\" label=\"This label has a tooltip\"></nys-label>\n<nys-tooltip for=\"label-id\" text=\"Tooltip text in here\"></nys-tooltip>",
-              "lang": "html"
-            }
-          ],
           "tagName": "nys-label",
-          "customElement": true
+          "customElement": true,
+          "summary": "Internal label component for form fields with flag and tooltip support."
         }
       ],
       "exports": [
@@ -9174,28 +8614,9 @@
           "summary": "Accessible modal dialog with focus trap, keyboard support, and action slots.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-modal\nid=\"modal1\"\nheading=\"Update Available\"\n>\n<p>\nWould you like to install the latest version? Albany ipsum dolor sit\nEmpire, Hudson consectetur Adirondack elit, sed do MetroCard tempor\nincididunt ut Capitol et Broadway magna Niagara. Ut enim ad Erie\nveniam, quis nostrud Catskill ullamco Bronx nisi ut LongIsland ex ea\nCuomo consequat.\n</p>\n</nys-modal>",
-              "lang": "html",
-              "render": "<div id=\"modal-wrapper1\">\n<nys-button label=\"Open Modal\" onclick=\"document.querySelector('.modal1').open = true; document.getElementById('modal-wrapper1').style.padding = '100px 0'\"></nys-button>\n<nys-modal\nclass=\"modal1\"\nid=\"modal1\"\nheading=\"Update Available\"\n>\n<p>\nWould you like to install the latest version? Albany ipsum dolor sit\nEmpire, Hudson consectetur Adirondack elit, sed do MetroCard tempor\nincididunt ut Capitol et Broadway magna Niagara. Ut enim ad Erie\nveniam, quis nostrud Catskill ullamco Bronx nisi ut LongIsland ex ea\nCuomo consequat.\n</p>\n</nys-modal>\n</div>"
-            },
-            {
-              "title": "Subheading",
-              "code": "<nys-modal\nid=\"modal-subheading\"\nheading=\"Before you continue\"\nsubheading=\"Your progress has been saved automatically.\"\n>\n<p>You can safely leave this page and return later to pick up where you left off.</p>\n</nys-modal>",
-              "lang": "html",
-              "render": "<div id=\"modal-wrapper-subheading\">\n<nys-button label=\"Open Modal\" onclick=\"document.querySelector('.modal-subheading').open = true; document.getElementById('modal-wrapper-subheading').style.padding = '100px 0'\"></nys-button>\n<nys-modal\nclass=\"modal-subheading\"\nid=\"modal-subheading\"\nheading=\"Before you continue\"\nsubheading=\"Your progress has been saved automatically.\"\n>\n<p>You can safely leave this page and return later to pick up where you left off.</p>\n</nys-modal>\n</div>"
-            },
-            {
-              "title": "Actions Slot",
-              "code": "<nys-modal id=\"modal3\" heading=\"Update password?\">\n<p>\nWould you like to install the latest version? Albany ipsum dolor sit\nEmpire, Hudson consectetur Adirondack elit, sed do MetroCard tempor\nincididunt ut Capitol et Broadway magna Niagara. Ut enim ad Erie\nveniam, quis nostrud Catskill ullamco Bronx nisi ut LongIsland ex ea\nCuomo consequat.\n</p>\n<div slot=\"actions\">\n<nys-button label=\"Not now\" variant=\"outline\"></nys-button>\n<nys-button label=\"Update\"></nys-button>\n</div>\n</nys-modal>",
-              "lang": "html",
-              "render": "<div id=\"modal-wrapper3\">\n<nys-button label=\"Open Modal\" onclick=\"document.querySelector('.modal3').open = true; document.getElementById('modal-wrapper3').style.padding = '100px 0'\"></nys-button>\n<nys-modal\nclass=\"modal3\"\nid=\"modal3\"\nheading=\"Update password?\"\n>\n<p>\nWould you like to install the latest version? Albany ipsum dolor sit\nEmpire, Hudson consectetur Adirondack elit, sed do MetroCard tempor\nincididunt ut Capitol et Broadway magna Niagara. Ut enim ad Erie\nveniam, quis nostrud Catskill ullamco Bronx nisi ut LongIsland ex ea\nCuomo consequat.\n</p>\n<div slot=\"actions\">\n<nys-button label=\"Not now\" variant=\"outline\" onclick=\"document.querySelector('.modal3').open = false; document.getElementById('modal-wrapper3').style.padding = '0'\"></nys-button>\n<nys-button label=\"Update\" onclick=\"alert('Mock Alert: Changes saved!'); document.querySelector('.modal3').open = false; document.getElementById('modal-wrapper3').style.padding = '0'\"></nys-button>\n</div>\n</nys-modal>\n</div>"
-            },
-            {
-              "title": "Mandatory Action",
-              "code": "<nys-modal\nid=\"modal4\"\nheading=\"There is no way to X out of here\"\nsubheading=\"Don't use this prop unless you add in the actions slot so the user does not get stuck in here.\"\nmandatory\n>\n<div slot=\"actions\">\n<nys-button label=\"Get me out\"></nys-button>\n</div>\n</nys-modal>",
-              "lang": "html",
-              "render": "<div id=\"modal-wrapper4\">\n<nys-button label=\"Open Modal\" onclick=\"document.querySelector('.modal4').open = true; document.getElementById('modal-wrapper4').style.padding = '100px 0'\"></nys-button>\n<nys-modal\nclass=\"modal4\"\nid=\"modal4\"\nheading=\"There is no way to X out of here\"\nsubheading=\"Don't use this prop unless you add in the actions slot so the user does not get stuck in here.\"\nmandatory\n>\n<div slot=\"actions\">\n<nys-button label=\"Get me out\" onclick=\"alert('Ok, ok. You can go now.'); document.querySelector('.modal4').open = false; document.getElementById('modal-wrapper4').style.padding = '0'\"></nys-button>\n</div>\n</nys-modal>\n</div>"
+              "title": "Basic modal",
+              "code": "<nys-modal id=\"confirm-modal\" heading=\"Confirm action\" open>\n<p>Are you sure you want to proceed?</p>\n<div slot=\"actions\">\n<nys-button label=\"Cancel\" variant=\"outline\"></nys-button>\n<nys-button label=\"Confirm\" variant=\"filled\"></nys-button>\n</div>\n</nys-modal>",
+              "lang": "html"
             }
           ]
         }
@@ -9407,19 +8828,9 @@
           "summary": "Page navigation with numbered links, prev/next buttons, and responsive layout.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-pagination currentPage=\"5\" totalPages=\"10\"></nys-pagination>",
-              "lang": "html"
-            },
-            {
-              "title": "First Page",
+              "title": "Basic pagination",
               "code": "<nys-pagination currentPage=\"1\" totalPages=\"10\"></nys-pagination>",
               "lang": "html"
-            },
-            {
-              "title": "Last Page",
-              "code": "<nys-pagination currentPage=\"10\" totalPages=\"10\"></nys-pagination>",
-              "lang": "html"
             }
           ]
         }
@@ -9776,8 +9187,8 @@
           "summary": "Radio button for single selection from mutually exclusive options. This is a READONLY data component.",
           "examples": [
             {
-              "title": "Pre-selected",
-              "code": "<nys-radiogroup label=\"Select borough\">\n<nys-radiobutton name=\"borough\" value=\"bronx\" label=\"The Bronx\" checked></nys-radiobutton>\n<nys-radiobutton name=\"borough\" value=\"brooklyn\" label=\"Brooklyn\"></nys-radiobutton>\n</nys-radiogroup>",
+              "title": "Radio group",
+              "code": "<nys-radiogroup label=\"Select borough\" required>\n<nys-radiobutton name=\"borough\" value=\"bronx\" label=\"The Bronx\"></nys-radiobutton>\n<nys-radiobutton name=\"borough\" value=\"brooklyn\" label=\"Brooklyn\"></nys-radiobutton>\n</nys-radiogroup>",
               "lang": "html"
             }
           ]
@@ -10409,54 +9820,9 @@
           "summary": "Container for grouping radio buttons as a single form control.",
           "examples": [
             {
-              "title": "Basic",
+              "title": "Basic radio group",
               "code": "<nys-radiogroup label=\"Select borough\" required>\n<nys-radiobutton name=\"borough\" value=\"bronx\" label=\"The Bronx\"></nys-radiobutton>\n<nys-radiobutton name=\"borough\" value=\"brooklyn\" label=\"Brooklyn\"></nys-radiobutton>\n<nys-radiobutton name=\"borough\" value=\"manhattan\" label=\"Manhattan\"></nys-radiobutton>\n</nys-radiogroup>",
               "lang": "html"
-            },
-            {
-              "title": "Tile",
-              "code": "<nys-radiogroup label=\"Select borough\" tile>\n<nys-radiobutton name=\"borough\" value=\"bronx\" label=\"The Bronx\"></nys-radiobutton>\n<nys-radiobutton name=\"borough\" value=\"brooklyn\" label=\"Brooklyn\"></nys-radiobutton>\n</nys-radiogroup>",
-              "lang": "html"
-            },
-            {
-              "title": "Required",
-              "code": "<nys-radiogroup label=\"Select borough\" required>\n<nys-radiobutton name=\"borough\" value=\"bronx\" label=\"The Bronx\"></nys-radiobutton>\n<nys-radiobutton name=\"borough\" value=\"brooklyn\" label=\"Brooklyn\"></nys-radiobutton>\n</nys-radiogroup>",
-              "lang": "html"
-            },
-            {
-              "title": "Optional",
-              "code": "<nys-radiogroup label=\"Select borough\" optional>\n<nys-radiobutton name=\"borough\" value=\"bronx\" label=\"The Bronx\"></nys-radiobutton>\n<nys-radiobutton name=\"borough\" value=\"brooklyn\" label=\"Brooklyn\"></nys-radiobutton>\n</nys-radiogroup>",
-              "lang": "html"
-            },
-            {
-              "title": "Disabled",
-              "code": "<nys-radiogroup label=\"Select borough\">\n<nys-radiobutton name=\"borough\" value=\"bronx\" label=\"The Bronx\" disabled></nys-radiobutton>\n<nys-radiobutton name=\"borough\" value=\"brooklyn\" label=\"Brooklyn\" disabled></nys-radiobutton>\n</nys-radiogroup>",
-              "lang": "html"
-            },
-            {
-              "title": "Size Small",
-              "code": "<nys-radiogroup label=\"Select borough\" size=\"sm\">\n<nys-radiobutton name=\"borough\" value=\"bronx\" label=\"The Bronx\"></nys-radiobutton>\n<nys-radiobutton name=\"borough\" value=\"brooklyn\" label=\"Brooklyn\"></nys-radiobutton>\n</nys-radiogroup>",
-              "lang": "html"
-            },
-            {
-              "title": "Other Option",
-              "code": "<nys-radiogroup label=\"Select borough\">\n<nys-radiobutton name=\"borough\" value=\"bronx\" label=\"The Bronx\"></nys-radiobutton>\n<nys-radiobutton name=\"borough\" value=\"\" label=\"Other\" other></nys-radiobutton>\n</nys-radiogroup>",
-              "lang": "html"
-            },
-            {
-              "title": "Error Message",
-              "code": "<nys-radiogroup label=\"Select borough\" showError errorMessage=\"Please select a borough\">\n<nys-radiobutton name=\"borough\" value=\"bronx\" label=\"The Bronx\"></nys-radiobutton>\n<nys-radiobutton name=\"borough\" value=\"brooklyn\" label=\"Brooklyn\"></nys-radiobutton>\n</nys-radiogroup>",
-              "lang": "html"
-            },
-            {
-              "title": "Description",
-              "code": "<nys-radiogroup label=\"Select borough\" description=\"Your primary residence in NYC.\">\n<nys-radiobutton name=\"borough\" value=\"bronx\" label=\"The Bronx\"></nys-radiobutton>\n<nys-radiobutton name=\"borough\" value=\"brooklyn\" label=\"Brooklyn\"></nys-radiobutton>\n</nys-radiogroup>",
-              "lang": "html"
-            },
-            {
-              "title": "Description Slot",
-              "code": "<nys-radiogroup label=\"Select borough\">\n<div slot=\"description\">Your primary <strong>residence</strong> in NYC.</div>\n<nys-radiobutton name=\"borough\" value=\"bronx\" label=\"The Bronx\"></nys-radiobutton>\n<nys-radiobutton name=\"borough\" value=\"brooklyn\" label=\"Brooklyn\"></nys-radiobutton>\n</nys-radiogroup>",
-              "lang": "html"
             }
           ]
         }
@@ -10630,7 +9996,14 @@
           },
           "tagName": "nys-option",
           "customElement": true,
-          "summary": "Option item for nys-select dropdown."
+          "summary": "Option item for nys-select dropdown.",
+          "examples": [
+            {
+              "title": "Basic options",
+              "code": "<nys-select>\n<nys-option value=\"ny\">New York</nys-option>\n<nys-option value=\"ca\" disabled>California</nys-option>\n</nys-select>",
+              "lang": "html"
+            }
+          ]
         }
       ],
       "exports": [
@@ -11127,63 +10500,14 @@
           "summary": "Dropdown select for choosing one option from a list.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-select label=\"Select your favorite borough\" id=\"borough\">\n<option value=\"bronx\" label=\"The Bronx\"></option>\n<option value=\"brooklyn\" label=\"Brooklyn\"></option>\n<option value=\"manhattan\" label=\"Manhattan\"></option>\n<option value=\"staten_island\" label=\"Staten Island\"></option>\n<option value=\"queens\" label=\"Queens\"></option>\n</nys-select>",
-              "lang": "html"
-            },
-            {
-              "title": "Default value",
-              "code": "<nys-select label=\"Select your favorite borough\" id=\"borough\">\n<option value=\"bronx\" label=\"The Bronx\"></option>\n<option value=\"brooklyn\" label=\"Brooklyn\" selected></option>\n<option value=\"manhattan\" label=\"Manhattan\"></option>\n<option value=\"staten_island\" label=\"Staten Island\"></option>\n<option value=\"queens\" label=\"Queens\"></option>\n</nys-select>",
-              "lang": "html"
-            },
-            {
-              "title": "Option Group",
-              "code": "<nys-select\nlabel=\"Which New York State service are you contacting us about?\"\ndescription=\"This is for demo purposes and the list might not be exhaustive.\"\n>\n<optgroup label=\"Transportation Services\">\n<option value=\"mta\">MTA / Public Transit</option>\n<option value=\"dmv\">Department of Motor Vehicles (DMV)</option>\n<option value=\"highway\">Highway Maintenance</option>\n</optgroup>\n<optgroup label=\"Health & Human Services\">\n<option value=\"medicaid\">Medicaid / Health Insurance</option>\n<option value=\"mental-health\">Mental Health Support</option>\n<option value=\"child-family\">Child and Family Services</option>\n</optgroup>\n<optgroup label=\"Public Safety\">\n<option value=\"state-police\">State Police</option>\n<option value=\"emergency-management\">Emergency Management</option>\n<option value=\"fire-safety\">Fire Safety</option>\n</optgroup>\n<optgroup label=\"Environment & Energy\">\n<option value=\"environmental-conservation\">\nEnvironmental Conservation\n</option>\n<option value=\"clean-energy\">Clean Energy Programs</option>\n<option value=\"waste-management\">Waste Management</option>\n</optgroup>\n</nys-select>",
-              "lang": "html"
-            },
-            {
-              "title": "Disabled",
-              "code": "<nys-select label=\"Select your favorite borough\" id=\"borough\" disabled>\n<option value=\"bronx\" label=\"The Bronx\"></option>\n<option value=\"brooklyn\" label=\"Brooklyn\"></option>\n<option value=\"manhattan\" label=\"Manhattan\"></option>\n<option value=\"staten_island\" label=\"Staten Island\"></option>\n<option value=\"queens\" label=\"Queens\"></option>\n</nys-select>",
-              "lang": "html"
-            },
-            {
-              "title": "Disabled Option",
-              "code": "<nys-select label=\"Select your favorite borough\" id=\"borough\">\n<option value=\"bronx\" label=\"The Bronx\"></option>\n<option value=\"brooklyn\" label=\"Brooklyn\"></option>\n<option value=\"manhattan\" label=\"Manhattan\"></option>\n<option value=\"staten_island\" label=\"Staten Island\" disabled></option>\n<option value=\"queens\" label=\"Queens\" disabled></option>\n</nys-select>",
-              "lang": "html"
-            },
-            {
-              "title": "Required",
-              "code": "<nys-select label=\"Select your favorite borough\" id=\"borough\" required>\n<option value=\"bronx\" label=\"The Bronx\"></option>\n<option value=\"brooklyn\" label=\"Brooklyn\"></option>\n<option value=\"manhattan\" label=\"Manhattan\"></option>\n<option value=\"staten_island\" label=\"Staten Island\"></option>\n<option value=\"queens\" label=\"Queens\"></option>\n</nys-select>",
-              "lang": "html"
-            },
-            {
-              "title": "Optional",
-              "code": "<nys-select label=\"Select your favorite borough\" id=\"borough\" optional>\n<option value=\"bronx\" label=\"The Bronx\"></option>\n<option value=\"brooklyn\" label=\"Brooklyn\"></option>\n<option value=\"manhattan\" label=\"Manhattan\"></option>\n<option value=\"staten_island\" label=\"Staten Island\"></option>\n<option value=\"queens\" label=\"Queens\"></option>\n</nys-select>",
-              "lang": "html"
-            },
-            {
-              "title": "Width small",
-              "code": "<nys-select label=\"Select your favorite borough\" id=\"borough\" width=\"sm\">\n<option value=\"bronx\" label=\"The Bronx\"></option>\n<option value=\"brooklyn\" label=\"Brooklyn\"></option>\n<option value=\"manhattan\" label=\"Manhattan\"></option>\n<option value=\"staten_island\" label=\"Staten Island\"></option>\n<option value=\"queens\" label=\"Queens\"></option>\n</nys-select>",
-              "lang": "html"
-            },
-            {
-              "title": "Width medium",
-              "code": "<nys-select label=\"Select your favorite borough\" id=\"borough\" width=\"md\">\n<option value=\"bronx\" label=\"The Bronx\"></option>\n<option value=\"brooklyn\" label=\"Brooklyn\"></option>\n<option value=\"manhattan\" label=\"Manhattan\"></option>\n<option value=\"staten_island\" label=\"Staten Island\"></option>\n<option value=\"queens\" label=\"Queens\"></option>\n</nys-select>",
+              "title": "Basic select",
+              "code": "<nys-select label=\"Select borough\">\n<option value=\"bronx\">The Bronx</option>\n<option value=\"brooklyn\">Brooklyn</option>\n<option value=\"manhattan\">Manhattan</option>\n</nys-select>",
               "lang": "html"
             },
             {
-              "title": "Width large",
-              "code": "<nys-select label=\"Select your favorite borough\" id=\"borough\" width=\"lg\">\n<option value=\"bronx\" label=\"The Bronx\"></option>\n<option value=\"brooklyn\" label=\"Brooklyn\"></option>\n<option value=\"manhattan\" label=\"Manhattan\"></option>\n<option value=\"staten_island\" label=\"Staten Island\"></option>\n<option value=\"queens\" label=\"Queens\"></option>\n</nys-select>",
+              "title": "With option groups",
+              "code": "<nys-select label=\"Select service\">\n<optgroup label=\"Transportation\">\n<option value=\"mta\">MTA</option>\n<option value=\"dmv\">DMV</option>\n</optgroup>\n</nys-select>",
               "lang": "html"
-            },
-            {
-              "title": "Slotted Description",
-              "code": "<nys-select label=\"Select your favorite borough\" id=\"borough\">\n<label slot=\"description\">This is a slotted description</label>\n<option value=\"bronx\" label=\"The Bronx\"></option>\n<option value=\"brooklyn\" label=\"Brooklyn\"></option>\n<option value=\"manhattan\" label=\"Manhattan\"></option>\n<option value=\"staten_island\" label=\"Staten Island\"></option>\n<option value=\"queens\" label=\"Queens\"></option>\n</nys-select>",
-              "lang": "html"
-            },
-            {
-              "title": "Error Message",
-              "code": "<nys-select label=\"Select your favorite borough\" id=\"borough\" errorMessage=\"You did not select a borough\" showError>\n<option value=\"bronx\" label=\"The Bronx\"></option>\n<option value=\"brooklyn\" label=\"Brooklyn\"></option>\n<option value=\"manhattan\" label=\"Manhattan\"></option>\n<option value=\"staten_island\" label=\"Staten Island\"></option>\n<option value=\"queens\" label=\"Queens\"></option>\n</nys-select>"
             }
           ]
         }
@@ -11300,13 +10624,13 @@
           "summary": "Skip navigation link for keyboard accessibility. Hidden until focused.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-skipnav></nys-skipnav>",
+              "title": "Default skip link",
+              "code": "<nys-skipnav></nys-skipnav>\n<main id=\"main-content\">...</main>",
               "lang": "html"
             },
             {
               "title": "Custom target",
-              "code": "<nys-skipnav href=\"#content-area\"></nys-skipnav>\n<p id=\"content-area\">...</p>",
+              "code": "<nys-skipnav href=\"#content-area\"></nys-skipnav>",
               "lang": "html"
             }
           ]
@@ -11494,7 +10818,19 @@
           },
           "tagName": "nys-step",
           "customElement": true,
-          "summary": "Individual step for use within nys-stepper with navigation support."
+          "summary": "Individual step for use within nys-stepper with navigation support.",
+          "examples": [
+            {
+              "title": "Step with page navigation",
+              "code": "<nys-step label=\"Personal Info\" href=\"/step-1\"></nys-step>",
+              "lang": "html"
+            },
+            {
+              "title": "Step with SPA navigation (no href)",
+              "code": "step.addEventListener('nys-step-click', (e) => {\ne.preventDefault(); // no href set, but good practice\nshowStepContent(e.detail.label);\n});",
+              "lang": "js"
+            }
+          ]
         }
       ],
       "exports": [
@@ -11705,16 +11041,24 @@
           "summary": "Multi-step progress indicator with navigation and mobile-friendly compact view.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<div class=\"nys-grid-row\">\n<nys-stepper\nid=\"stepper\"\nname=\"stepper\"\nlabel=\"Register for Design System Office Hours\"\nclass=\"nys-desktop:nys-grid-col-3\"\n>\n<nys-step label=\"Personal Details\" href=\"/nys-stepper/personal.html\"></nys-step>\n<nys-step label=\"Team Info\" selected href=\"/nys-stepper/team.html\"></nys-step>\n<nys-step label=\"Usage Survey\" current href=\"/nys-stepper/survey.html\"></nys-step>\n<nys-step label=\"Newsletter Opt-In\" href=\"/nys-stepper/newsletter.html\"></nys-step>\n<div slot=\"actions\">\n<nys-button variant=\"outline\" label=\"Save & Exit\" fullWidth></nys-button>\n</div>\n</nys-stepper>\n<div class=\"nys-desktop:nys-grid-col-9\" id=\"nys-stepper-content\">\nLoading...\n</div>\n</div>",
-              "lang": "html",
-              "render": "<div class=\"nys-grid-row\">\n<nys-stepper\nid=\"stepper\"\nname=\"stepper\"\nlabel=\"Register for Design System Office Hours\"\nclass=\"nys-desktop:nys-grid-col-3\"\n>\n<nys-step label=\"Personal Details\" href=\"/nys-stepper/personal.html\"></nys-step>\n<nys-step label=\"Team Info\" selected href=\"/nys-stepper/team.html\"></nys-step>\n<nys-step label=\"Usage Survey\" current href=\"/nys-stepper/survey.html\"></nys-step>\n<nys-step label=\"Newsletter Opt-In\" href=\"/nys-stepper/newsletter.html\"></nys-step>\n</nys-stepper>\n<div class=\"nys-desktop:nys-grid-col-9\" id=\"nys-stepper-content\">\nLoading...\n</div>\n</div>\n<script>\ndocument.addEventListener(\"DOMContentLoaded\", async () => {\nconst stepper = document.querySelector(\"nys-stepper\");\nif (stepper?.updateComplete) await stepper.updateComplete;\nconst selectedStep = document.querySelector(\"nys-step[selected]\");\nconst href = selectedStep?.getAttribute(\"href\");\nif (!href) return;\nconst res = await fetch(href);\nif (!res.ok) return;\nconst container = document.querySelector(\"#nys-stepper-content\");\nif (container) container.innerHTML = await res.text();\n});\n\ndocument.addEventListener(\"nys-step-click\", async (e) => {\nconst href = e.detail?.href;\nif (!href) return;\ne.preventDefault();\nconst res = await fetch(href);\nif (!res.ok) return;\nconst container = document.querySelector(\"#nys-stepper-content\");\nif (container) container.innerHTML = await res.text();\n});\n</script>"
+              "title": "Basic stepper",
+              "code": "<nys-stepper label=\"Application Progress\">\n<nys-step label=\"Personal Info\" current></nys-step>\n<nys-step label=\"Contact Details\"></nys-step>\n<nys-step label=\"Review\"></nys-step>\n</nys-stepper>",
+              "lang": "html"
+            },
+            {
+              "title": "Grid layout with sidebar placement",
+              "code": "<div class=\"nys-grid-container\">\n<div class=\"nys-grid-row\">\n<nys-stepper label=\"Application\" class=\"nys-grid-col-12 nys-desktop:nys-grid-col-3\">\n<nys-step label=\"Personal Info\"></nys-step>\n<nys-step label=\"Contact\" current></nys-step>\n<nys-step label=\"Review\"></nys-step>\n</nys-stepper>\n<main class=\"nys-grid-col-12 nys-desktop:nys-grid-col-9\" id=\"main-content\">\n<!-- Form content for current step -->\n<nys-textinput label=\"Email\" required></nys-textinput>\n<nys-textinput label=\"Phone\"></nys-textinput>\n</main>\n</div>\n</div>",
+              "lang": "html"
+            },
+            {
+              "title": "Navigation buttons in actions slot",
+              "code": "<nys-stepper label=\"Application\">\n<nys-step label=\"Step 1\"></nys-step>\n<nys-step label=\"Step 2\" current></nys-step>\n<nys-step label=\"Step 3\"></nys-step>\n<div slot=\"actions\">\n<nys-button label=\"Save and Exit\" variant=\"outline\" size=\"sm\" fullWidth></nys-button>\n</div>\n</nys-stepper>",
+              "lang": "html"
             },
             {
-              "title": "Actions slot",
-              "code": "<div class=\"nys-grid-row\">\n<nys-stepper\nid=\"stepper\"\nname=\"stepper\"\nlabel=\"Register for Design System Office Hours\"\nclass=\"nys-desktop:nys-grid-col-3\"\n>\n<nys-step label=\"Personal Details\" href=\"/nys-stepper/personal.html\"></nys-step>\n<nys-step label=\"Team Info\" selected href=\"/nys-stepper/team.html\"></nys-step>\n<nys-step label=\"Usage Survey\" current href=\"/nys-stepper/survey.html\"></nys-step>\n<nys-step label=\"Newsletter Opt-In\" href=\"/nys-stepper/newsletter.html\"></nys-step>\n<div slot=\"actions\">\n<nys-button variant=\"outline\" label=\"Save & Exit\" fullWidth></nys-button>\n</div>\n</nys-stepper>\n<div class=\"nys-desktop:nys-grid-col-9\" id=\"nys-stepper-content\">\nLoading...\n</div>\n</div>",
-              "lang": "html",
-              "render": "<div class=\"nys-grid-row\">\n<nys-stepper\nid=\"stepper\"\nname=\"stepper\"\nlabel=\"Register for Design System Office Hours\"\nclass=\"nys-desktop:nys-grid-col-3\"\n>\n<nys-step label=\"Personal Details\" href=\"/nys-stepper/personal.html\"></nys-step>\n<nys-step label=\"Team Info\" selected href=\"/nys-stepper/team.html\"></nys-step>\n<nys-step label=\"Usage Survey\" current href=\"/nys-stepper/survey.html\"></nys-step>\n<nys-step label=\"Newsletter Opt-In\" href=\"/nys-stepper/newsletter.html\"></nys-step>\n<div slot=\"actions\">\n<nys-button variant=\"outline\" label=\"Save & Exit\" fullWidth></nys-button>\n</div>\n</nys-stepper>\n<div class=\"nys-desktop:nys-grid-col-9\" id=\"nys-stepper-content\">\nLoading...\n</div>\n</div>\n<script>\ndocument.addEventListener(\"DOMContentLoaded\", async () => {\nconst stepper = document.querySelector(\"nys-stepper\");\nif (stepper?.updateComplete) await stepper.updateComplete;\nconst selectedStep = document.querySelector(\"nys-step[selected]\");\nconst href = selectedStep?.getAttribute(\"href\");\nif (!href) return;\nconst res = await fetch(href);\nif (!res.ok) return;\nconst container = document.querySelector(\"#nys-stepper-content\");\nif (container) container.innerHTML = await res.text();\n});\n\ndocument.addEventListener(\"nys-step-click\", async (e) => {\nconst href = e.detail?.href;\nif (!href) return;\ne.preventDefault();\nconst res = await fetch(href);\nif (!res.ok) return;\nconst container = document.querySelector(\"#nys-stepper-content\");\nif (container) container.innerHTML = await res.text();\n});\n</script>"
+              "title": "SPA / programmatic navigation",
+              "code": "let currentStep = 0; // furthest reached\nlet viewingStep = 0; // currently displayed\n\nfunction updateStepper(steps) {\nsteps.forEach((step, i) => {\nstep.toggleAttribute('current', i === currentStep);\nstep.toggleAttribute('selected', i === viewingStep);\n});\n}\n\ndocument.querySelector('nys-stepper').addEventListener('nys-step-click', (e) => {\ne.preventDefault();\nconst steps = Array.from(document.querySelectorAll('nys-step'));\nconst clicked = e.composedPath().find(el => el.tagName?.toLowerCase() === 'nys-step');\nconst index = steps.indexOf(clicked);\nif (index !== -1) { viewingStep = index; updateStepper(steps); }\n});\n\n// Advance to next step (call on form submit / \"Continue\" click)\nfunction advance(steps) {\nif (currentStep < steps.length - 1) {\ncurrentStep++;\nviewingStep = currentStep;\nupdateStepper(steps);\n}\n}",
+              "lang": "js"
             }
           ]
         }
@@ -11954,13 +11298,8 @@
           "customElement": true,
           "examples": [
             {
-              "title": "Disabled",
-              "code": "<nys-tabgroup name=\"Account Settings\">\n<nys-tab label=\"Profile\"></nys-tab>\n<nys-tab label=\"Security\"></nys-tab>\n<nys-tab label=\"Notifications\" disabled></nys-tab>\n<nys-tabpanel><p>Manage your profile information.</p></nys-tabpanel>\n<nys-tabpanel><p>Update your password and 2FA settings.</p></nys-tabpanel>\n<nys-tabpanel><p>Notification preferences (coming soon).</p></nys-tabpanel>\n</nys-tabgroup>",
-              "lang": "html"
-            },
-            {
-              "title": "Preselected",
-              "code": "<nys-tabgroup name=\"Reports\">\n<nys-tab label=\"Summary\"></nys-tab>\n<nys-tab label=\"Details\" selected></nys-tab>\n<nys-tabpanel><p>Summary view</p></nys-tabpanel>\n<nys-tabpanel><p>Detailed view (shown by default)</p></nys-tabpanel>\n</nys-tabgroup>",
+              "title": "`<nys-tab>` and `<nys-tabpanel>` should always be wrapped by `<nys-tabgroup>`",
+              "code": "<!-- Always place <nys-tab> elements inside a <nys-tabgroup>. -->\n<nys-tabgroup name=\"My Tabs\">\n<nys-tab label=\"Overview\"></nys-tab>\n<nys-tab label=\"Details\" selected></nys-tab>\n<nys-tab label=\"Archived\" disabled></nys-tab>\n<nys-tabpanel><p>Overview content</p></nys-tabpanel>\n<nys-tabpanel><p>Details content (shown by default)</p></nys-tabpanel>\n<nys-tabpanel><p>Archived content</p></nys-tabpanel>\n</nys-tabgroup>",
               "lang": "html"
             }
           ]
@@ -12222,14 +11561,13 @@
           "customElement": true,
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-tabgroup>\n<nys-tab label=\"Marcy\"></nys-tab>\n<nys-tab label=\"Algonquin\"></nys-tab>\n<nys-tab label=\"Haystack\"></nys-tab>\n// rest of tabs\n<nys-tabpanel\n>Mount Marcy is the tallest peak in the Adirondacks. It has an elevation\nof 5344 feet with 3166 feet of elevation gain. The roundtrip hike to the\ntop is 14.8 miles and is an out-and-back route.\n</nys-tabpanel>\n<nys-tabpanel\n>Algonquin Peak is the 2nd tallest peak in the Adirondacks. It has an\nelevation of 5114 feet with 3050 feet of elevation gain. The roundtrip\nhike to the top is 7.8 miles and is an out-and-back route.</nys-tabpanel\n>\n<nys-tabpanel\n>Mount Haystack is the 3rd tallest peak in the Adirondacks. It has an\nelevation of 4960 feet with 4000 feet of elevation gain. The roundtrip\nhike to the top is 16.4 miles and is an out-and-back\nroute.</nys-tabpanel\n>\n// rest of tab panel content\n</nys-tabgroup>",
-              "lang": "html",
-              "render": "<nys-tabgroup>\n<nys-tab label=\"Marcy\"></nys-tab>\n<nys-tab label=\"Algonquin\"></nys-tab>\n<nys-tab label=\"Haystack\"></nys-tab>\n<nys-tab label=\"Skylight\" id=\"tab4\"></nys-tab>\n<nys-tab label=\"Whiteface\" id=\"tab5\"></nys-tab>\n<nys-tabpanel\n>Mount Marcy is the tallest peak in the Adirondacks. It has an elevation\nof 5344 feet with 3166 feet of elevation gain. The roundtrip hike to the\ntop is 14.8 miles and is an out-and-back route.\n</nys-tabpanel>\n<nys-tabpanel\n>Algonquin Peak is the 2nd tallest peak in the Adirondacks. It has an\nelevation of 5114 feet with 3050 feet of elevation gain. The roundtrip\nhike to the top is 7.8 miles and is an out-and-back route.</nys-tabpanel\n>\n<nys-tabpanel\n>Mount Haystack is the 3rd tallest peak in the Adirondacks. It has an\nelevation of 4960 feet with 4000 feet of elevation gain. The roundtrip\nhike to the top is 16.4 miles and is an out-and-back\nroute.</nys-tabpanel\n>\n<nys-tabpanel\n>Mount Skylight is the 4th tallest peak in the Adirondacks. It has an\nelevation of 4926 feet with 5100 feet of elevation gain. The roundtrip\nhike to the top is 16 miles and is an out-and-back route.</nys-tabpanel\n>\n<nys-tabpanel\n>Whiteface is the 5th tallest peak in the Adirondacks. It has an\nelevation of 4867 feet with 3050 feet of elevation gain. The roundtrip\nhike to the top is 7.2 miles and is an out-and-back route.</nys-tabpanel\n>\n<p style=\"padding: 1rem;\">\n<strong>Note:</strong> The content in the tab panels was gathered from\n<a href=\"https://www.lakeplacid.com/do/outdoors/summerfall/hiking\"\n>lakeplacid.com</a\n>\nand may not be completely accurate. This is meant to be a demo of how\nthe component works, not a hiking guide.\n</p>\n</nys-tabgroup>"
+              "title": "Disable a tab using the `disabled` attribute on `<nys-tab>`.",
+              "code": "<nys-tabgroup name=\"Account Settings\">\n<nys-tab label=\"Profile\"></nys-tab>\n<nys-tab label=\"Security\"></nys-tab>\n<nys-tab label=\"Notifications\" disabled></nys-tab>\n<nys-tabpanel><p>Manage your profile information.</p></nys-tabpanel>\n<nys-tabpanel><p>Update your password and 2FA settings.</p></nys-tabpanel>\n<nys-tabpanel><p>Notification preferences (coming soon).</p></nys-tabpanel>\n</nys-tabgroup>",
+              "lang": "html"
             },
             {
-              "title": "Explicit Ordering",
-              "code": "<nys-tabgroup id=\"explicit-ordering\">\n<nys-tab label=\"1st Tab\" id=\"tab1\"></nys-tab>\n<nys-tab label=\"2nd Tab\" id=\"tab2\"></nys-tab>\n<nys-tab label=\"3rd Tab\" id=\"tab3\"></nys-tab>\n<nys-tabpanel aria-labelledby=\"tab2\">Content for tab 2</nys-tabpanel>\n<nys-tabpanel aria-labelledby=\"tab3\">Content for tab 3</nys-tabpanel>\n<nys-tabpanel aria-labelledby=\"tab1\">Content for tab 1</nys-tabpanel>\n</nys-tabgroup>",
+              "title": "Pre-select a tab using the `selected` attribute on `<nys-tab>`.",
+              "code": "<nys-tabgroup name=\"Reports\">\n<nys-tab label=\"Summary\"></nys-tab>\n<nys-tab label=\"Details\" selected></nys-tab>\n<nys-tabpanel><p>Summary view</p></nys-tabpanel>\n<nys-tabpanel><p>Detailed view (shown by default)</p></nys-tabpanel>\n</nys-tabgroup>",
               "lang": "html"
             }
           ]
@@ -12299,7 +11637,14 @@
             "package": "lit"
           },
           "tagName": "nys-tabpanel",
-          "customElement": true
+          "customElement": true,
+          "examples": [
+            {
+              "title": "Panel content is wrapped by `<nys-tabpanel>`.",
+              "code": "<!-- Panels are paired by position with <nys-tab> elements in the same <nys-tabgroup>. -->\n<nys-tabgroup name=\"Steps\">\n<nys-tab label=\"Step 1\"></nys-tab>\n<nys-tab label=\"Step 2\"></nys-tab>\n<nys-tabpanel>\n<h2>Step 1: Enter your information</h2>\n<p>Fill out the form below.</p>\n</nys-tabpanel>\n<nys-tabpanel>\n<h2>Step 2: Review and submit</h2>\n<p>Confirm your details before submitting.</p>\n</nys-tabpanel>\n</nys-tabgroup>",
+              "lang": "html"
+            }
+          ]
         }
       ],
       "exports": [
@@ -12664,33 +12009,6 @@
             "name": "LitElement",
             "package": "lit"
           },
-          "examples": [
-            {
-              "title": "Basic",
-              "code": "<nys-table id=\"table1\" name=\"table1\">\n<table>\n<caption>New York State High Peaks and Popular Hikes</caption>\n<tr><th>Mountain</th><th>Peak Height (ft)</th><th>Hike Name</th></tr>\n<tr><td>Marcy</td><td>5,344</td><td>Van Hoevenberg Trail</td></tr>\n<tr><td>Algonquin</td><td>5,114</td><td>Northeast Trail</td></tr>\n<tr><td>Haystack</td><td>4,960</td><td>Johns Brook Trail</td></tr>\n<tr><td>Skylight</td><td>4,926</td><td>Lake Tear Trail</td></tr>\n<tr><td>Whiteface</td><td>4,867</td><td>Whiteface Mountain Trail</td></tr>\n</table>\n</nys-table>",
-              "lang": "html"
-            },
-            {
-              "title": "Striped",
-              "code": "<nys-table id=\"table2\" name=\"table2\" striped>\n<table>\n<caption>New York State High Peaks and Popular Hikes</caption>\n<tr><th>Mountain</th><th>Peak Height (ft)</th><th>Hike Name</th></tr>\n<tr><td>Marcy</td><td>5,344</td><td>Van Hoevenberg Trail</td></tr>\n<tr><td>Haystack</td><td>4,960</td><td>Johns Brook Trail</td></tr>\n<tr><td>Skylight</td><td>4,926</td><td>Lake Tear Trail</td></tr>\n<tr><td>Whiteface</td><td>4,867</td><td>Whiteface Mountain Trail</td></tr>\n</table>\n</nys-table>",
-              "lang": "html"
-            },
-            {
-              "title": "Bordered",
-              "code": "<nys-table id=\"table3\" name=\"table3\" bordered>\n<table>\n<caption>New York State High Peaks and Popular Hikes</caption>\n<tr><th>Mountain</th><th>Peak Height (ft)</th><th>Hike Name</th></tr>\n<tr><td>Marcy</td><td>5,344</td><td>Van Hoevenberg Trail</td></tr>\n<tr><td>Haystack</td><td>4,960</td><td>Johns Brook Trail</td></tr>\n<tr><td>Skylight</td><td>4,926</td><td>Lake Tear Trail</td></tr>\n<tr><td>Whiteface</td><td>4,867</td><td>Whiteface Mountain Trail</td></tr>\n</table>\n</nys-table>",
-              "lang": "html"
-            },
-            {
-              "title": "Sortable",
-              "code": "<nys-table id=\"table4\" name=\"table4\" sortable>\n<table>\n<caption>New York State High Peaks and Popular Hikes</caption>\n<tr><th>Mountain</th><th>Peak Height (ft)</th><th>Hike Name</th></tr>\n<tr><td>Marcy</td><td>5,344</td><td>Van Hoevenberg Trail</td></tr>\n<tr><td>Haystack</td><td>4,960</td><td>Johns Brook Trail</td></tr>\n<tr><td>Skylight</td><td>4,926</td><td>Lake Tear Trail</td></tr>\n<tr><td>Whiteface</td><td>4,867</td><td>Whiteface Mountain Trail</td></tr>\n</table>\n</nys-table>",
-              "lang": "html"
-            },
-            {
-              "title": "Downloadable",
-              "code": "<nys-table id=\"table5\" name=\"table5\" download=\"path/to/downloadable/version/of/table.filetype\">\n<table>\n<caption>New York State High Peaks and Popular Hikes</caption>\n<tr><th>Mountain</th><th>Peak Height (ft)</th><th>Hike Name</th></tr>\n<tr><td>Marcy</td><td>5,344</td><td>Van Hoevenberg Trail</td></tr>\n<tr><td>Haystack</td><td>4,960</td><td>Johns Brook Trail</td></tr>\n<tr><td>Skylight</td><td>4,926</td><td>Lake Tear Trail</td></tr>\n<tr><td>Whiteface</td><td>4,867</td><td>Whiteface Mountain Trail</td></tr>\n</table>\n</nys-table>",
-              "lang": "html"
-            }
-          ],
           "tagName": "nys-table",
           "customElement": true
         }
@@ -12833,7 +12151,7 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Makes textarea readonly but focusable.",
+              "description": "Makes textarea read-only but focusable.",
               "attribute": "readonly",
               "reflects": true
             },
@@ -13203,7 +12521,7 @@
                 "text": "boolean"
               },
               "default": "false",
-              "description": "Makes textarea readonly but focusable.",
+              "description": "Makes textarea read-only but focusable.",
               "fieldName": "readonly",
               "propName": "readonly"
             },
@@ -13327,58 +12645,13 @@
           "summary": "Multi-line text input for comments, descriptions, and feedback.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-textarea label=\"Comments\"></nys-textarea>",
-              "lang": "html"
-            },
-            {
-              "title": "Disabled",
-              "code": "<nys-textarea label=\"Comments\" disabled></nys-textarea>",
+              "title": "Basic textarea",
+              "code": "<nys-textarea label=\"Comments\" rows=\"4\"></nys-textarea>",
               "lang": "html"
             },
             {
-              "title": "Readonly",
-              "code": "<nys-textarea label=\"Comments\" readonly value=\"You can see me but not edit me\"></nys-textarea>",
-              "lang": "html"
-            },
-            {
-              "title": "Required",
-              "code": "<nys-textarea label=\"Describe the incident\" required></nys-textarea>",
-              "lang": "html"
-            },
-            {
-              "title": "Optional",
-              "code": "<nys-textarea label=\"Comments\" optional></nys-textarea>",
-              "lang": "html"
-            },
-            {
-              "title": "Max length",
-              "code": "<nys-textarea label=\"Comments\" maxlength=\"100\"></nys-textarea>",
-              "lang": "html"
-            },
-            {
-              "title": "Width Small",
-              "code": "<nys-textarea label=\"Comments\" width=\"sm\"></nys-textarea>",
-              "lang": "html"
-            },
-            {
-              "title": "Width Medium",
-              "code": "<nys-textarea label=\"Comments\" width=\"md\"></nys-textarea>",
-              "lang": "html"
-            },
-            {
-              "title": "Width Large",
-              "code": "<nys-textarea label=\"Comments\" width=\"lg\"></nys-textarea>",
-              "lang": "html"
-            },
-            {
-              "title": "Description",
-              "code": "<nys-textarea label=\"Describe the incident\" description=\"Please provide details\"></nys-textarea>",
-              "lang": "html"
-            },
-            {
-              "title": "Description Slot",
-              "code": "<nys-textarea label=\"Describe the incident\">\n<div slot=\"description\">Please provide details</div>\n</nys-textarea>",
+              "title": "Required with description",
+              "code": "<nys-textarea label=\"Describe the incident\" description=\"Please provide details\" required></nys-textarea>",
               "lang": "html"
             }
           ]
@@ -14161,68 +13434,23 @@
           "summary": "Text input for short single-line data with validation and masking support.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-textinput label=\"Full Name\"></nys-textinput>",
-              "lang": "html"
-            },
-            {
-              "title": "Disabled",
-              "code": "<nys-textinput label=\"Email Address\" disabled></nys-textinput>",
-              "lang": "html"
-            },
-            {
-              "title": "Readonly",
-              "code": "<nys-textinput label=\"Email Address\" readonly value=\"You can see me but not edit me\"></nys-textinput>",
-              "lang": "html"
-            },
-            {
-              "title": "Required",
-              "code": "<nys-textinput label=\"Email Address\" required></nys-textinput>",
-              "lang": "html"
-            },
-            {
-              "title": "Optional",
-              "code": "<nys-textinput label=\"Email Address\" optional></nys-textinput>",
-              "lang": "html"
-            },
-            {
-              "title": "Width Small",
-              "code": "<nys-textinput label=\"Zip Code\" width=\"sm\"></nys-textinput>",
-              "lang": "html"
-            },
-            {
-              "title": "Width Medium",
-              "code": "<nys-textinput label=\"City\" width=\"md\"></nys-textinput>",
-              "lang": "html"
-            },
-            {
-              "title": "Width Large",
-              "code": "<nys-textinput label=\"Email Address\" width=\"lg\"></nys-textinput>",
-              "lang": "html"
-            },
-            {
-              "title": "Description",
-              "code": "<nys-textinput label=\"Email Address\" description=\"Only valid ny.gov emails are accepted.\"></nys-textinput>",
-              "lang": "html"
-            },
-            {
-              "title": "Description Slot",
-              "code": "<nys-textinput label=\"Email Address\">\n<div slot=\"description\">Only valid <strong>ny.gov</strong> emails are accepted.</div>\n</nys-textinput>",
+              "title": "Basic text input",
+              "code": "<nys-textinput label=\"Full Name\" required></nys-textinput>",
               "lang": "html"
             },
             {
-              "title": "Masking",
-              "code": "<nys-textinput type=\"tel\" label=\"Phone Number\">\n<div slot=\"description\">Some types, such as <code>tel</code> have automatic masking available.</div>\n</nys-textinput>",
+              "title": "Required Email",
+              "code": "<nys-textinput type=\"email\" label=\"Email Address\" required></nys-textinput>",
               "lang": "html"
             },
             {
-              "title": "Max Min Values",
-              "code": "<nys-textinput type=\"number\" label=\"Age\" min=\"18\" max=\"99\" width=\"sm\"></nys-textinput>",
+              "title": "Phone with masking",
+              "code": "<nys-textinput type=\"tel\" label=\"Phone Number\"></nys-textinput>",
               "lang": "html"
             },
             {
-              "title": "Suffix Button",
-              "code": "<nys-textinput id=\"search-demo\" type=\"search\" placeholder=\"Search\">\n<nys-button\nslot=\"endButton\"\nariaLabel=\"Search\"\nprefixIcon=\"search\"\nonclick=\"alert('searching for: ' + document.getElementById('search-demo').value)\"\n></nys-button>\n</nys-textinput>",
+              "title": "Search with button",
+              "code": "<nys-textinput type=\"search\" placeholder=\"Search\">\n<nys-button slot=\"endButton\" label=\"Search\" prefixIcon=\"search\"></nys-button>\n</nys-textinput>",
               "lang": "html"
             }
           ]
@@ -14618,38 +13846,13 @@
           "summary": "Toggle switch for binary settings with immediate effect.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-toggle label=\"Enable notifications\" name=\"notifications\" value=\"enabled-notifications\"></nys-toggle>",
-              "lang": "html"
-            },
-            {
-              "title": "Checked",
-              "code": "<nys-toggle label=\"Dark Mode\" name=\"theme\" value=\"dark\" checked></nys-toggle>",
-              "lang": "html"
-            },
-            {
-              "title": "Disabled",
-              "code": "<nys-toggle label=\"Opt Out of emails\" name=\"toggle-switch\" value=\"emails\" disabled></nys-toggle>",
-              "lang": "html"
-            },
-            {
-              "title": "Hide Icon",
-              "code": "<nys-toggle label=\"No icon on the toggle knob\" name=\"icon\" value=\"no-icon\" noIcon></nys-toggle>",
-              "lang": "html"
-            },
-            {
-              "title": "Size small",
-              "code": "<nys-toggle label=\"Tiny but mighty\" name=\"sm-size\" value=\"sm-size\" size=\"sm\"></nys-toggle>",
-              "lang": "html"
-            },
-            {
-              "title": "Description",
-              "code": "<nys-toggle\nlabel=\"Opt Out of emails\"\ndescription=\"An email address is recommended to be on file for contact information.\"\nname=\"toggle-switch\"\nvalue=\"emails\"\n></nys-toggle>",
+              "title": "Basic toggle",
+              "code": "<nys-toggle label=\"Enable notifications\" name=\"notifications\"></nys-toggle>",
               "lang": "html"
             },
             {
-              "title": "Description Slot",
-              "code": "<nys-toggle\nlabel=\"Opt Out of emails\"\nname=\"toggle-switch\"\nvalue=\"emails\"\n>\n<p slot=\"description\">We <strong>REALLY</strong> encourage you to keep emails enabled for contact purposes.</p>\n</nys-toggle>",
+              "title": "Dark mode toggle",
+              "code": "<nys-toggle label=\"Dark mode\" description=\"Adjust display for low light\" checked></nys-toggle>",
               "lang": "html"
             }
           ]
@@ -15063,18 +14266,13 @@
           "summary": "Contextual tooltip with auto-positioning, keyboard support, and screen reader integration.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<div style=\"display: flex; justify-content: center; gap: 5px; padding: 40px;\">\n<nys-tooltip for=\"my-button\" text=\"I am a tooltip.\"></nys-tooltip>\n<nys-button  id=\"my-button\" label=\"Hover Me\"></nys-button>\n</div>",
+              "title": "Tooltip for button",
+              "code": "<nys-button id=\"help-btn\" label=\"Help\" circle icon=\"help\"></nys-button>\n<nys-tooltip for=\"help-btn\" text=\"Click for assistance\"></nys-tooltip>",
               "lang": "html"
             },
             {
-              "title": "Position",
-              "code": "<div style=\"display: flex; justify-content: center; gap: 5px; padding: 40px;\">\n<p>Hover over the icon</p>\n<nys-tooltip\nfor=\"my-icon2\"\ntext=\"I am a tooltip.\"\nposition=\"right\"\n>\n</nys-tooltip>\n<nys-icon id=\"my-icon2\" name=\"info\" size=\"3xl\"></nys-icon>\n</div>",
-              "lang": "html"
-            },
-            {
-              "title": "Inverted",
-              "code": "<div style=\"background-color: #1b1b1b; color: #ffffff; padding: 40px; display: flex; gap: 5px\">\n<p>Hover over the icon</p>\n<nys-tooltip\nfor=\"my-tooltip3\"\ntext=\"I am a tooltip.\"\ninverted\n>\n</nys-tooltip>\n<nys-icon id=\"my-tooltip3\" name=\"info\" size=\"3xl\"></nys-icon>\n</div>",
+              "title": "Positioned tooltip",
+              "code": "<nys-icon id=\"info-icon\" name=\"info\"></nys-icon>\n<nys-tooltip for=\"info-icon\" text=\"Additional details\" position=\"right\"></nys-tooltip>",
               "lang": "html"
             }
           ]
@@ -15139,8 +14337,8 @@
           "summary": "Universal NYS footer with logo and statewide links. Required site-wide.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-unavfooter></nys-unavfooter>",
+              "title": "Standard usage",
+              "code": "<nys-globalfooter>...</nys-globalfooter>\n<nys-unavfooter></nys-unavfooter>",
               "lang": "html"
             }
           ]
@@ -15186,7 +14384,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "Universal NYS header with trust bar, logo, search, and language translation. Required on all NYS sites.\n\nPlace as the first element in `<body>`. Includes \"official site\" trust indicator, NY.gov logo,\nsite search (searches ny.gov), and 14-language translation dropdown. Use `hideSearch` or `hideTranslate`\nto remove features if not applicable.",
+          "description": "",
           "name": "NysUnavHeader",
           "members": [
             {
@@ -15362,16 +14560,6 @@
               ]
             }
           ],
-          "events": [
-            {
-              "description": "Fired when a language is selected. Detail: `{language: {code, label, url?}}`. Cancelable; `preventDefault()` overrides the default Smartling redirect.",
-              "name": "nys-language-select"
-            },
-            {
-              "description": "Fired when a search is submitted. Detail: `{query}`. Cancelable; `preventDefault()` overrides the default search redirect.",
-              "name": "nys-search-submit"
-            }
-          ],
           "attributes": [
             {
               "name": "trustbarVisible",
@@ -15459,40 +14647,7 @@
             "package": "lit"
           },
           "tagName": "nys-unavheader",
-          "customElement": true,
-          "summary": "Universal NYS header with trust bar, search, and translation. Required site-wide.",
-          "examples": [
-            {
-              "title": "Basic",
-              "code": "<nys-unavheader></nys-unavheader>",
-              "lang": "html"
-            },
-            {
-              "title": "Hide search",
-              "code": "<nys-unavheader hideSearch></nys-unavheader>",
-              "lang": "html"
-            },
-            {
-              "title": "Hide translate",
-              "code": "<nys-unavheader hideTranslate></nys-unavheader>",
-              "lang": "html"
-            },
-            {
-              "title": "Custom Search URL",
-              "code": "<nys-unavheader searchUrl=\"https://designsystem.ny.gov/search/?q=\"></nys-unavheader>",
-              "lang": "html"
-            },
-            {
-              "title": "Custom Language List",
-              "code": "<nys-unavheader id=\"my-header\"></nys-unavheader>\n<script>\nconst header = document.querySelector('#my-header');\nheader.languages = [\n{ code: 'en', label: 'English' },\n{ code: 'es', label: 'Español' , url: '\"https://ny.gov/?lang=es\"'},\n{ code: 'fr', label: 'Français', url: '\"https://ny.gov/?lang=fr\"'},\n];\n</script>",
-              "lang": "html"
-            },
-            {
-              "title": "Custom Language List JS",
-              "code": "<nys-unavheader id=\"my-header2\"></nys-unavheader>\n<script>\ndocument.querySelector('#my-header2').addEventListener('nys-language-select', (event) => {\nevent.preventDefault();\nconst selectedLanguage = event.detail.language.label;\n});\n</script>",
-              "lang": "html"
-            }
-          ]
+          "customElement": true
         }
       ],
       "exports": [
@@ -15817,38 +14972,8 @@
           "summary": "YouTube video player with thumbnail preview and accessibility announcements.",
           "examples": [
             {
-              "title": "Basic",
-              "code": "<nys-video\nvideourl=\"https://www.youtube.com/watch?v=TBfFzt0150Q\"\ntitleText=\"IT'S a Tech Podcast, Episode 3: Human-Centered Design\"\n></nys-video>",
-              "lang": "html"
-            },
-            {
-              "title": "Thumbnail",
-              "code": "<nys-video\nvideourl=\"https://www.youtube.com/watch?v=TBfFzt0150Q\"\ntitleText=\"IT'S a Tech Podcast, Episode 3: Human-Centered Design\"\nthumbnail=\"https://designsystem.ny.gov/assets/img/homepage-grid-3.svg\"\n></nys-video>",
-              "lang": "html"
-            },
-            {
-              "title": "Autoplay",
-              "code": "<nys-video\nvideourl=\"https://www.youtube.com/watch?v=TBfFzt0150Q\"\ntitleText=\"IT'S a Tech Podcast, Episode 3: Human-Centered Design\"\nautoplay\n></nys-video>",
-              "lang": "html"
-            },
-            {
-              "title": "Start Time",
-              "code": "<nys-video\nvideourl=\"https://www.youtube.com/watch?v=TBfFzt0150Q\"\ntitleText=\"IT'S a Tech Podcast, Episode 3: Human-Centered Design\"\nstarttime=\"43\"\n></nys-video>",
-              "lang": "html"
-            },
-            {
-              "title": "Disabled",
-              "code": "<nys-video\nvideourl=\"https://www.youtube.com/watch?v=TBfFzt0150Q\"\ntitleText=\"IT'S a Tech Podcast, Episode 3: Human-Centered Design\"\ndisabled\n></nys-video>",
-              "lang": "html"
-            },
-            {
-              "title": "Size full",
-              "code": "<nys-video\nsize=\"full\"\nvideourl=\"https://www.youtube.com/watch?v=TBfFzt0150Q\"\ntitleText=\"Small (width: 320-439px)\"\n></nys-video>",
-              "lang": "html"
-            },
-            {
-              "title": "Size small",
-              "code": "<nys-video\nsize=\"sm\"\nvideourl=\"https://www.youtube.com/watch?v=TBfFzt0150Q\"\ntitleText=\"Small (width: 320-439px)\"\n></nys-video>",
+              "title": "Basic usage",
+              "code": "<nys-video\nvideourl=\"https://www.youtube.com/watch?v=dQw4w9WgXcQ\"\ntitleText=\"Video Title\"\n></nys-video>",
               "lang": "html"
             }
           ]