pi-apexlang 0.1.0

package/skills/apexlang/templates/region-components/smart-filter-search/README.md

@@ -0,0 +1,18 @@
+# Smart Filter Search Templates
+
+## Purpose
+Canonical guidance for the `smart-filter-search` region family, including shared contract loading and supported scenario variants.
+
+## Usage
+- Load `smart-filter-search._common.md` first to align variable contracts, guardrails, and required inputs.
+- Choose a scenario variant matching the requested interaction pattern, data source type, and page composition context.
+- Preserve canonical path references and markdown-first conventions when updating workflow or registry links.
+
+## Template Catalog
+- `smart-filter-search._common.md`
+- `smart-filter-search.standard.md`
+
+## Maintenance
+- Keep this README synchronized with actual files in the directory.
+- Update catalogs and usage notes whenever templates are added, removed, or renamed.
+- Keep family guidance aligned with page-level standards in memory-bank rules and with scenario coverage in this folder.

package/skills/apexlang/templates/region-components/smart-filter-search/smart-filter-search._common.md

@@ -0,0 +1,74 @@
+---
+templateId: region.smart-filters.common
+componentType: region
+version: 1.1
+description: Shared contract for smart-filters regions and target result region binding.
+---
+
+# Purpose
+
+Document the native smart-filters region shell and its filter child metadata boundary.
+
+# Generation Rules (MANDATORY)
+
+1. Use the dedicated `region-smart-filters` template.
+2. Treat the filtered-region reference as mandatory.
+3. Do not emit region `settings` for Smart Filters unless active compiler metadata proves a valid settings group.
+4. Use the canonical search-filter source contract with `source.dbColumns` for free-text search; do not invent single-column shortcut shapes.
+5. Do not target map regions directly. For map pages, target a companion report/cards results region and refresh the sibling map explicitly.
+
+# Variable Contract
+
+| Name | Required | Type | Notes |
+|------|----------|------|-------|
+| regionStaticId | yes | string | Region identifier. |
+| name | yes | string | Display name. |
+| smartFiltersRegionStaticId | yes | string | Smart filters region static id. |
+| source.filteredRegion | yes | ref | Results region static id. |
+| filters | optional | array | Filter definitions (radio/search/etc). |
+| filter.itemName | conditional | string | Canonical page item name for child search filters, e.g. `P14_F_SEARCH`. |
+
+# Output Template – Full
+
+```apexlang
+region {{regionStaticId}} (
+  name: {{name}}
+  type: smartFilters
+  source {
+    filteredRegion: @{{source.filteredRegion}}
+  }
+  {{filters}}
+)
+```
+
+# Output Template – Search Filter Child
+
+```apexlang
+filter {{filter.itemName}} (
+  type: search
+  label {
+    label: {{filter.label}}
+  }
+  layout {
+    sequence: {{filter.layout.sequence}}
+  }
+  source {
+    dbColumns: {{filter.source.dbColumns}}
+  }
+)
+```
+
+# Conditional Rendering Rules
+
+- Keep filter children separate from the shell.
+- Use the advanced HTML DOM ID only when the owning scenario requires it.
+- Omit `settings` blocks for APEX 26.1 Smart Filters; the live compiler metadata for `NATIVE_SMART_FILTERS` has no settings group.
+
+# Guardrails
+
+- `filteredRegion` must reference an existing results region with compatible source columns.
+- The Smart Filters region must be declared before the referenced `filteredRegion` in the page file.
+- `filteredRegion` must reference a report/cards-style results region. Do not target map regions, map layers, Smart Filters regions, Faceted Search regions, or other non-results aliases.
+- Filter LOV/value definitions must match result columns.
+- Search filters must use `source.dbColumns`; do not collapse free-text search into `source.databaseColumn`.
+- Metadata export lookup: search for `Smart Filters`, the filtered-region reference, and child filter metadata.

package/skills/apexlang/templates/region-components/smart-filter-search/smart-filter-search._index.md

@@ -0,0 +1,18 @@
+---
+templateId: smart-filter-search.index
+componentType: template
+version: 1.0
+imports:
+  - smart-filter-search._common.md
+description: Routing entrypoint for smart-filter-search templates.
+---
+
+# Purpose
+
+Primary routing entrypoint for `smart-filter-search` templates.
+
+# Load Order
+
+1. Load this file.
+2. Load `smart-filter-search._common.md`.
+3. Load one scenario template in this folder.

package/skills/apexlang/templates/region-components/smart-filter-search/smart-filter-search.standard.md

@@ -0,0 +1,29 @@
+---
+templateId: region.smart-filters.standard
+componentType: region
+version: 1.0
+imports:
+  - smart-filter-search._common
+description: Standard smart filters region for search/filter experiences.
+---
+
+# Output Template
+
+```
+region {{smartFiltersRegionStaticId}} (
+  name: {{name}}
+  type: smartFilters
+  source {
+    filteredRegion: @{{source.filteredRegion}}
+  }
+  layout {
+    sequence: {{layout.sequence}}
+    slot: {{layout.slot}}
+  }
+  appearance {
+    template: {{appearance.template}}
+    templateOptions: #DEFAULT#
+  }
+  {{filters}}
+)
+```

package/skills/apexlang/templates/region-components/static-content/README.md

@@ -0,0 +1,32 @@
+# Static Content Templates
+
+## Purpose
+Canonical guidance for the `static-content` region family, including shared contract loading and supported scenario variants.
+
+## Usage
+- Load `static-content._index.md` first.
+- Load `static-content._common.md` next to align variable contracts, guardrails, and required inputs.
+- Load `static-content._template_options.md` when the request changes region `appearance.templateOptions`.
+- Load `static-content._nested-region._common.md` for reusable child region contracts.
+- Load `static-content._button._common.md` when scenarios include inline button actions.
+- Load one scenario variant matching the requested interaction pattern and page composition context.
+
+## Template Catalog
+- `static-content._index.md`
+- `static-content._common.md`
+- `static-content._template_options.md`
+- `static-content._nested-region._common.md`
+- `static-content._button._common.md`
+- `static-content.accordion.md`
+- `static-content.blank-with-attributes.md`
+- `static-content.buttons.md`
+- `static-content.cards.md`
+- `static-content.collapsible.md`
+- `static-content.collection-toolbar.md`
+- `static-content.dividers.md`
+- `static-content.empty-state.md`
+
+## Maintenance
+- Keep this README synchronized with actual files in the directory.
+- Update catalogs and usage notes whenever templates are added, removed, or renamed.
+- Keep family guidance aligned with page-level standards in memory-bank rules and with scenario coverage in this folder.

package/skills/apexlang/templates/region-components/static-content/static-content._button._common.md

@@ -0,0 +1,68 @@
+---
+templateId: region.static-content.button.common
+componentType: button
+version: 1.0
+description: Shared contract for buttons attached to static-content regions.
+---
+
+# Purpose
+
+Provide a reusable button block for static-content scenarios that include toolbar or layout actions.
+
+---
+
+# Variable Contract
+
+## Required Variables
+
+- `button.staticId`
+- `button.buttonName`
+- `button.label`
+- `button.layout.region`
+- `button.layout.sequence`
+- `button.layout.slot`
+
+## Optional Variables
+
+- `button.appearance.*`
+- `button.behavior.*`
+- `button.serverSideCondition.*`
+
+## Appearance Defaults
+
+- When `button.appearance.buttonTemplate` is `@/text-with-icon` and `button.appearance.icon` is present, `button.appearance.templateOptions` must include exactly one icon-position option.
+- Default to `t-Button--iconLeft`; use `t-Button--iconRight` only when explicitly requested.
+- When `button.appearance.buttonTemplate` is `@/icon`, do not add left/right icon-position options.
+
+---
+
+# Output Template – Button Block
+
+```apexlang
+button {{button.staticId}} (
+  buttonName: {{button.buttonName}}
+  label: {{button.label}}
+  layout {
+    sequence: {{button.layout.sequence}}
+    region: @{{button.layout.region}}
+    slot: {{button.layout.slot}}
+  }
+  appearance {
+    buttonTemplate: {{button.appearance.buttonTemplate}}
+    hot: {{button.appearance.hot}}
+    templateOptions: {{button.appearance.templateOptions}}
+    icon: {{button.appearance.icon}}
+  }
+  behavior {
+    action: {{button.behavior.action}}
+    warnOnUnsavedChanges: {{button.behavior.warnOnUnsavedChanges}}
+  }
+)
+```
+
+---
+
+# Conditional Rendering Rules
+
+- Omit optional appearance and behavior fields when not provided.
+- Apply icon-placement defaults to the generated button block, not to the static-content or buttons-container region.

package/skills/apexlang/templates/region-components/static-content/static-content._common.md

@@ -0,0 +1,62 @@
+---
+templateId: region.static-content.common
+componentType: region
+version: 1.1
+description: Shared contract for static content regions and navigation fallback output.
+---
+
+# Purpose
+
+Standardize the variable contract, guardrails, and template skeleton for static content region scenarios. Also covers the generic `staticContent` region used as the generator fallback for Navigation or otherwise unhandled region families.
+
+---
+
+# Generation Rules (MANDATORY)
+
+1. Load `references/policies/memory-bank/30-pages/apex.page.md` and other relevant section rules before emitting static content regions.
+2. Default content-bearing static content regions to `appearance.template: @/standard` and keep `templateOptions` limited to the documented `static_id` values in `static-content._template_options.md`.
+3. Add server-side conditions only when necessary; remove unused permutations.
+4. When the source family is `Navigation`, call out that the current generator maps it here as a fallback.
+5. Keep the shell intentionally minimal for fallback usage; family-specific content belongs in the owning specialized guide when one exists.
+
+---
+
+# Variable Contract
+
+| Name | Required | Type | Notes |
+|------|----------|------|-------|
+| regionStaticId | yes | string | Identifier used after the `region` keyword. |
+| name | yes | string | Builder display name. |
+| type | yes | enum | Always `staticContent`. |
+| layout.sequence | yes | number | Region order within the page slot. |
+| layout.slot | yes | enum | Slot the region occupies (e.g., `BODY`). |
+| layout.parentRegion | conditional | string | Parent region static ID for nested regions. |
+| appearance.template | yes | string | Region template reference; default to `@/standard` for normal content regions. |
+| appearance.templateOptions | optional | array | Additional modifiers (`#DEFAULT#` default). Keep `#DEFAULT#` standalone, keep documented composites atomic, and use only the accepted values documented in `static-content._template_options.md`. |
+| source.htmlCode | conditional | html | Inline content for static regions. Use a `source { htmlCode: ... }` block; do not emit `content { html: ... }`. Use either direct inline HTML on the same line or a fenced ` ```html ` block, not SQL-style `q'...'` quoting. |
+| source.sqlQuery | conditional | sql | SQL-driven content where supported. |
+| headerAndFooter.* | optional | string | Header/footer text. |
+| serverSideCondition.* | optional | condition | Visibility gating. |
+| security.authorizationScheme | optional | string | Authorization scheme alias. |
+
+---
+
+# Conditional Rendering Rules
+
+- Remove optional blocks (`source`, `headerAndFooter`, `serverSideCondition`) when not required.
+- Include only template options documented for the selected template in `static-content._template_options.md`.
+- Use server-side conditions for feature flags or authorization gating.
+- For nested layouts, ensure `parentRegion` references existing static content regions.
+- When inline markup is required, emit it only as `source.htmlCode`; do not invent a `content` block or an `html` property.
+- For multiline `source.htmlCode`, prefer a fenced ` ```html ` block. Do not use SQL-style `q'...'` quoting.
+
+---
+
+# Guardrails
+
+- Keep HTML limited to safe, declarative content; prefer declarative components over raw markup.
+- Validate SQL queries for content-driven static regions when applicable.
+- Use nested static content regions only when layout requires multiple levels (`parentRegion`).
+- Document raw HTML content only when the owning design intentionally uses static markup.
+- When this file represents `Navigation`, note that the current generator falls back here instead of emitting a dedicated navigation template.
+- Metadata export lookup: search for `staticContent`, `Navigation`, and the fallback region family in the generator.

package/skills/apexlang/templates/region-components/static-content/static-content._index.md

@@ -0,0 +1,22 @@
+---
+templateId: static-content.index
+componentType: template
+version: 1.0
+imports:
+  - static-content._common.md
+  - static-content._nested-region._common.md
+  - static-content._button._common.md
+description: Routing entrypoint for static-content templates.
+---
+
+# Purpose
+
+Primary routing entrypoint for `static-content` templates.
+
+# Load Order
+
+1. Load this file.
+2. Load `static-content._common.md`.
+3. Load `static-content._nested-region._common.md`.
+4. Load `static-content._button._common.md` when the scenario includes button actions.
+5. Load one scenario template in this folder.

package/skills/apexlang/templates/region-components/static-content/static-content._nested-region._common.md

@@ -0,0 +1,67 @@
+---
+templateId: region.static-content.nested-region.common
+componentType: region
+version: 1.0
+imports:
+  - static-content._common.md
+description: Shared contract for nested static-content child regions.
+---
+
+# Purpose
+
+Standardize nested child region blocks used by static-content scenario variants.
+
+---
+
+# Variable Contract
+
+## Required Variables
+
+- `childRegion.staticId`
+- `childRegion.name`
+- `childRegion.parentRegion`
+- `childRegion.layout.sequence`
+- `childRegion.layout.slot`
+- `childRegion.appearance.template`
+
+## Optional Variables
+
+- `childRegion.source.htmlCode`
+- `childRegion.appearance.templateOptions`
+- `childRegion.headerAndFooter.*`
+- `childRegion.serverSideCondition.*`
+
+---
+
+# Output Template – Child Region Block
+
+```apexlang
+region {{childRegion.staticId}} (
+  name: {{childRegion.name}}
+  type: staticContent
+  source {
+    htmlCode: {{childRegion.source.htmlCode}}
+  }
+  layout {
+    sequence: {{childRegion.layout.sequence}}
+    parentRegion: @{{childRegion.parentRegion}}
+    slot: {{childRegion.layout.slot}}
+  }
+  appearance {
+    template: {{childRegion.appearance.template}}
+    templateOptions: {{childRegion.appearance.templateOptions}}
+  }
+  headerAndFooter {
+    headerText: {{childRegion.headerAndFooter.headerText}}
+    footerText: {{childRegion.headerAndFooter.footerText}}
+  }
+)
+```
+
+---
+
+# Conditional Rendering Rules
+
+- Omit optional blocks when values are not provided.
+- Ensure `parentRegion` exists in the same scenario output.
+- Child regions under the same `parentRegion + slot` share a local 12-column grid that resets inside the parent region.

package/skills/apexlang/templates/region-components/static-content/static-content._template_options.md

@@ -0,0 +1,227 @@
+# Static Content Template Options
+
+Use the listed `static_id` as the exact value to pass in the region's `templateOptions`.
+Example: `templateOptions: [remove-body-padding, accent-1]`
+`#DEFAULT#` remains a standalone entry when used. Composite preset strings stay atomic only when the full combined value is the accepted emitted value.
+
+`Preset` shows the checked-in baseline already emitted by the template itself.
+
+## Alert (`alert`)
+Preset: `t-Alert--horizontal:t-Alert--defaultIcons:t-Alert--warning`
+
+- Highlight Background | `static_id=highlight-background` | `css=t-Alert--colorBG` | `group=--`
+- Horizontal | `static_id=horizontal` | `css=t-Alert--horizontal` | `group=Alert Display`
+- Wizard | `static_id=wizard` | `css=t-Alert--wizard` | `group=Alert Display`
+- Hide Icons | `static_id=hide-icons` | `css=t-Alert--noIcon` | `group=Alert Icons`
+- Show Custom Icons | `static_id=show-custom-icons` | `css=t-Alert--customIcons` | `group=Alert Icons`
+- Show Default Icons | `static_id=show-default-icons` | `css=t-Alert--defaultIcons` | `group=Alert Icons`
+- Hidden | `static_id=hidden` | `css=t-Alert--removeHeading js-removeLandmark` | `group=Alert Title`
+- Hidden but Accessible | `static_id=hidden-but-accessible` | `css=t-Alert--accessibleHeading` | `group=Alert Title`
+- Danger | `static_id=danger` | `css=t-Alert--danger` | `group=Alert Type`
+- Information | `static_id=information` | `css=t-Alert--info` | `group=Alert Type`
+- Success | `static_id=success` | `css=t-Alert--success` | `group=Alert Type`
+- Warning | `static_id=warning` | `css=t-Alert--warning` | `group=Alert Type`
+
+## Blank with Attributes (`blank-with-attributes`)
+Preset: none
+
+- none
+
+## Blank with Attributes (No Grid) (`blank-with-attributes-no-grid`)
+Preset: none
+
+- none
+
+## Carousel Container (`carousel-container`)
+Preset: `t-Region--hideHeader js-addHiddenHeadingRoleDesc:t-Region--hiddenOverflow`
+
+- Remember Carousel Slide | `static_id=remember-carousel-slide` | `css=js-useLocalStorage` | `group=--`
+- Remove Body Padding | `static_id=remove-body-padding` | `css=t-Region--noPadding` | `group=--`
+- Show Maximize Button | `static_id=show-maximize-button` | `css=js-showMaximizeButton` | `group=--`
+- Show Next and Previous Buttons | `static_id=show-next-and-previous-buttons` | `css=t-Region--showCarouselControls` | `group=--`
+- Show Region Icon | `static_id=show-region-icon` | `css=t-Region--showIcon` | `group=--`
+- Accent 1 | `static_id=accent-1` | `css=t-Region--accent1` | `group=Accent`
+- Accent 2 | `static_id=accent-2` | `css=t-Region--accent2` | `group=Accent`
+- Accent 3 | `static_id=accent-3` | `css=t-Region--accent3` | `group=Accent`
+- Accent 4 | `static_id=accent-4` | `css=t-Region--accent4` | `group=Accent`
+- Accent 5 | `static_id=accent-5` | `css=t-Region--accent5` | `group=Accent`
+- Slide | `static_id=slide` | `css=t-Region--carouselSlide` | `group=Animation`
+- Spin | `static_id=spin` | `css=t-Region--carouselSpin` | `group=Animation`
+- 240px | `static_id=240px` | `css=i-h240` | `group=Body Height`
+- 320px | `static_id=320px` | `css=i-h320` | `group=Body Height`
+- 480px | `static_id=480px` | `css=i-h480` | `group=Body Height`
+- 640px | `static_id=640px` | `css=i-h640` | `group=Body Height`
+- Hide | `static_id=hide` | `css=t-Region--hiddenOverflow` | `group=Body Overflow`
+- Scroll | `static_id=scroll` | `css=t-Region--scrollBody` | `group=Body Overflow`
+- Hidden | `static_id=hidden` | `css=t-Region--removeHeader js-removeLandmark` | `group=Header`
+- Hidden but accessible | `static_id=hidden-but-accessible` | `css=t-Region--hideHeader js-addHiddenHeadingRoleDesc` | `group=Header`
+- Remove Borders | `static_id=remove-borders` | `css=t-Region--noBorder` | `group=Style`
+- Stack Region | `static_id=stack-region` | `css=t-Region--stacked` | `group=Style`
+- 10 Seconds | `static_id=10-seconds` | `css=js-cycle10s` | `group=Timer`
+- 15 Seconds | `static_id=15-seconds` | `css=js-cycle15s` | `group=Timer`
+- 20 Seconds | `static_id=20-seconds` | `css=js-cycle20s` | `group=Timer`
+- 5 Seconds | `static_id=5-seconds` | `css=js-cycle5s` | `group=Timer`
+
+## Content Block (`content-block`)
+Preset: `t-ContentBlock--h1`
+
+- Add Body Padding | `static_id=add-body-padding` | `css=t-ContentBlock--padded` | `group=--`
+- Show Region Icon | `static_id=show-region-icon` | `css=t-ContentBlock--showIcon` | `group=--`
+- Light Background | `static_id=light-background` | `css=t-ContentBlock--lightBG` | `group=Body Style`
+- Shadow Background | `static_id=shadow-background` | `css=t-ContentBlock--shadowBG` | `group=Body Style`
+- Hidden | `static_id=hidden` | `css=t-Region--removeHeader js-removeLandmark` | `group=Header`
+- Hidden but accessible | `static_id=hidden-but-accessible` | `css=t-ContentBlock--hideHeader js-addHiddenHeadingRoleDesc` | `group=Header`
+- Alternative | `static_id=alternative` | `css=t-ContentBlock--headingFontAlt` | `group=Heading Font`
+- Large | `static_id=large` | `css=t-ContentBlock--h1` | `group=Region Title`
+- Medium | `static_id=medium` | `css=t-ContentBlock--h2` | `group=Region Title`
+- Small | `static_id=small` | `css=t-ContentBlock--h3` | `group=Region Title`
+
+## Hero (`hero`)
+Preset: none
+
+- Remove Body Padding | `static_id=remove-body-padding` | `css=t-HeroRegion--noPadding` | `group=--`
+- No | `static_id=no` | `css=t-HeroRegion--hideIcon` | `group=Display Icon`
+- Alternative | `static_id=alternative` | `css=t-HeroRegion--headingFontAlt` | `group=Heading Font`
+- Circle | `static_id=circle` | `css=t-HeroRegion--iconsCircle` | `group=Icon Shape`
+- Square | `static_id=square` | `css=t-HeroRegion--iconsSquare` | `group=Icon Shape`
+- Featured | `static_id=featured` | `css=t-HeroRegion--featured` | `group=Style`
+- Stacked Featured | `static_id=stacked-featured` | `css=t-HeroRegion--featured t-HeroRegion--centered` | `group=Style`
+
+## Image (`image`)
+Preset: `t-ImageRegion--auto:t-ImageRegion--cover:t-ImageRegion--square:t-ImageRegion--noFilter`
+
+- Image Stretch | `static_id=image-stretch` | `css=t-ImageRegion--stretch` | `group=--`
+- Blur | `static_id=blur` | `css=t-ImageRegion--blur` | `group=Filter`
+- Grayscale | `static_id=grayscale` | `css=t-ImageRegion--grayscale` | `group=Filter`
+- Invert | `static_id=invert` | `css=t-ImageRegion--invert` | `group=Filter`
+- None | `static_id=none` | `css=t-ImageRegion--noFilter` | `group=Filter`
+- Saturate | `static_id=saturate` | `css=t-ImageRegion--saturate` | `group=Filter`
+- Sepia | `static_id=sepia` | `css=t-ImageRegion--sepia` | `group=Filter`
+- 1:1 (Square) | `static_id=1-1-square` | `css=t-ImageRegion--1x1` | `group=Ratio`
+- 16:9 (Widescreen) | `static_id=16-9-widescreen` | `css=t-ImageRegion--16x9` | `group=Ratio`
+- 2:1 (Univisium) | `static_id=2-1-univisium` | `css=t-ImageRegion--2x1` | `group=Ratio`
+- 4:3 (Standard) | `static_id=4-3-standard` | `css=t-ImageRegion--4x3` | `group=Ratio`
+- Auto | `static_id=auto` | `css=t-ImageRegion--auto` | `group=Ratio`
+- Contain | `static_id=contain` | `css=t-ImageRegion--contain` | `group=Scale`
+- Cover | `static_id=cover` | `css=t-ImageRegion--cover` | `group=Scale`
+- Fill | `static_id=fill` | `css=t-ImageRegion--fill` | `group=Scale`
+- Scale Down | `static_id=scale-down` | `css=t-ImageRegion--scale-down` | `group=Scale`
+- Circle | `static_id=circle` | `css=t-ImageRegion--circle` | `group=Shape`
+- Rounded | `static_id=rounded` | `css=t-ImageRegion--rounded` | `group=Shape`
+- Square | `static_id=square` | `css=t-ImageRegion--square` | `group=Shape`
+
+## Inline Dialog (`inline-dialog`)
+Preset: `js-dialog-size600x400`
+
+- Auto Height | `static_id=auto-height` | `css=js-dialog-autoheight` | `group=--`
+- Draggable | `static_id=draggable` | `css=js-draggable` | `group=--`
+- Modal | `static_id=modal` | `css=js-modal` | `group=--`
+- Remove Body Padding | `static_id=remove-body-padding` | `css=t-DialogRegion--noPadding` | `group=--`
+- Resizable | `static_id=resizable` | `css=js-resizable` | `group=--`
+- Large (720x480) | `static_id=large-720x480` | `css=js-dialog-size720x480` | `group=Size`
+- Medium (600x400) | `static_id=medium-600x400` | `css=js-dialog-size600x400` | `group=Size`
+- None | `static_id=none` | `css=js-dialog-nosize` | `group=Size`
+- Small (480x320) | `static_id=small-480x320` | `css=js-dialog-size480x320` | `group=Size`
+
+## Inline Drawer (`inline-drawer`)
+Preset: `js-dialog-class-t-Drawer--pullOutEnd`
+
+- Modal | `static_id=modal` | `css=js-modal` | `group=--`
+- Remove Body Padding | `static_id=remove-body-padding` | `css=t-DialogRegion--noPadding` | `group=--`
+- Extra Large | `static_id=extra-large` | `css=js-dialog-class-t-Drawer--xl` | `group=Size`
+- Large | `static_id=large` | `css=js-dialog-class-t-Drawer--lg` | `group=Size`
+- Medium | `static_id=medium` | `css=js-dialog-class-t-Drawer--md` | `group=Size`
+- None (Auto) | `static_id=none-auto` | `css=js-dialog-nosize` | `group=Size`
+- Small | `static_id=small` | `css=js-dialog-class-t-Drawer--sm` | `group=Size`
+- Bottom | `static_id=bottom` | `css=js-dialog-class-t-Drawer--pullOutBottom` | `group=Position`
+- End | `static_id=end` | `css=js-dialog-class-t-Drawer--pullOutEnd` | `group=Position`
+- Start | `static_id=start` | `css=js-dialog-class-t-Drawer--pullOutStart` | `group=Position`
+- Top | `static_id=top` | `css=js-dialog-class-t-Drawer--pullOutTop` | `group=Position`
+
+## Inline Popup (`inline-popup`)
+Preset: `js-dialog-size600x400`
+
+- Auto Height | `static_id=auto-height` | `css=js-dialog-autoheight` | `group=--`
+- Display Popup Callout | `static_id=display-popup-callout` | `css=js-popup-callout` | `group=--`
+- Remove Body Padding | `static_id=remove-body-padding` | `css=t-DialogRegion--noPadding` | `group=--`
+- Remove Page Overlay | `static_id=remove-page-overlay` | `css=js-popup-noOverlay` | `group=--`
+- Above | `static_id=above` | `css=js-popup-pos-above` | `group=Callout Position`
+- After | `static_id=after` | `css=js-popup-pos-after` | `group=Callout Position`
+- Before | `static_id=before` | `css=js-popup-pos-before` | `group=Callout Position`
+- Below | `static_id=below` | `css=js-popup-pos-below` | `group=Callout Position`
+- Inside | `static_id=inside` | `css=js-popup-pos-inside` | `group=Callout Position`
+- Large (720x480) | `static_id=large-720x480` | `css=js-dialog-size720x480` | `group=Size`
+- Medium (600x400) | `static_id=medium-600x400` | `css=js-dialog-size600x400` | `group=Size`
+- None | `static_id=none` | `css=js-dialog-nosize` | `group=Size`
+- Small (480x320) | `static_id=small-480x320` | `css=js-dialog-size480x320` | `group=Size`
+
+## Login (`login`)
+Preset: none
+
+- Hidden | `static_id=hidden` | `css=t-Login-region--headerHidden js-removeLandmark` | `group=Login Header`
+- Icon | `static_id=icon` | `css=t-Login-region--headerIcon` | `group=Login Header`
+- Title | `static_id=title` | `css=t-Login-region--headerTitle js-removeLandmark` | `group=Login Header`
+
+## Search Results Container (`search-results-container`)
+Preset: none
+
+- Apply Theme Colors | `static_id=apply-theme-colors` | `css=u-colors` | `group=--`
+- Large | `static_id=large` | `css=t-ResultsRegion--iconLg` | `group=Icon Size`
+- Medium | `static_id=medium` | `css=t-ResultsRegion--iconMd` | `group=Icon Size`
+- Small | `static_id=small` | `css=t-ResultsRegion--iconSm` | `group=Icon Size`
+- Boxed | `static_id=boxed` | `css=t-ResultsRegion--boxed` | `group=Result Appearance`
+- Flat | `static_id=flat` | `css=t-ResultsRegion--flat` | `group=Result Appearance`
+
+## Standard (`standard`)
+Preset: `t-Region--scrollBody`
+
+- Remove Body Padding | `static_id=remove-body-padding` | `css=t-Region--noPadding` | `group=--`
+- Show Maximize Button | `static_id=show-maximize-button` | `css=js-showMaximizeButton` | `group=--`
+- Show Region Icon | `static_id=show-region-icon` | `css=t-Region--showIcon` | `group=--`
+- Accent 1 | `static_id=accent-1` | `css=t-Region--accent1` | `group=Accent`
+- Accent 10 | `static_id=accent-10` | `css=t-Region--accent10` | `group=Accent`
+- Accent 11 | `static_id=accent-11` | `css=t-Region--accent11` | `group=Accent`
+- Accent 12 | `static_id=accent-12` | `css=t-Region--accent12` | `group=Accent`
+- Accent 13 | `static_id=accent-13` | `css=t-Region--accent13` | `group=Accent`
+- Accent 14 | `static_id=accent-14` | `css=t-Region--accent14` | `group=Accent`
+- Accent 15 | `static_id=accent-15` | `css=t-Region--accent15` | `group=Accent`
+- Accent 2 | `static_id=accent-2` | `css=t-Region--accent2` | `group=Accent`
+- Accent 3 | `static_id=accent-3` | `css=t-Region--accent3` | `group=Accent`
+- Accent 4 | `static_id=accent-4` | `css=t-Region--accent4` | `group=Accent`
+- Accent 5 | `static_id=accent-5` | `css=t-Region--accent5` | `group=Accent`
+- Accent 6 | `static_id=accent-6` | `css=t-Region--accent6` | `group=Accent`
+- Accent 7 | `static_id=accent-7` | `css=t-Region--accent7` | `group=Accent`
+- Accent 8 | `static_id=accent-8` | `css=t-Region--accent8` | `group=Accent`
+- Accent 9 | `static_id=accent-9` | `css=t-Region--accent9` | `group=Accent`
+- 240px | `static_id=240px` | `css=i-h240` | `group=Body Height`
+- 320px | `static_id=320px` | `css=i-h320` | `group=Body Height`
+- 480px | `static_id=480px` | `css=i-h480` | `group=Body Height`
+- 640px | `static_id=640px` | `css=i-h640` | `group=Body Height`
+- Hide | `static_id=hide` | `css=t-Region--hiddenOverflow` | `group=Body Overflow`
+- Scroll - Default | `static_id=scroll-default` | `css=t-Region--scrollBody` | `group=Body Overflow`
+- Visible | `static_id=visible` | `css=t-Region--visibleOverflow` | `group=Body Overflow`
+- Hidden | `static_id=hidden` | `css=t-Region--removeHeader js-removeLandmark` | `group=Header`
+- Hidden but accessible | `static_id=hidden-but-accessible` | `css=t-Region--hideHeader js-addHiddenHeadingRoleDesc` | `group=Header`
+- Remove Borders | `static_id=remove-borders` | `css=t-Region--noBorder` | `group=Style`
+- Remove UI Decoration | `static_id=remove-ui-decoration` | `css=t-Region--noUI` | `group=Style`
+- Stack Region | `static_id=stack-region` | `css=t-Region--stacked` | `group=Style`
+- Text Content | `static_id=text-content` | `css=t-Region--textContent` | `group=Style`
+
+## Tabs Container (`tabs-container`)
+Preset: `t-TabsRegion-mod--simple`
+
+- Remember Active Tab | `static_id=remember-active-tab` | `css=js-useLocalStorage` | `group=--`
+- Fill Tab Labels | `static_id=fill-tab-labels` | `css=t-TabsRegion-mod--fillLabels` | `group=Layout`
+- Pill | `static_id=pill` | `css=t-TabsRegion-mod--pill` | `group=Tabs Style`
+- Simple | `static_id=simple` | `css=t-TabsRegion-mod--simple` | `group=Tabs Style`
+- Above Label | `static_id=above-label` | `css=t-Tabs--iconsAbove` | `group=Tabs Icon`
+- Inline with Label | `static_id=inline-with-label` | `css=t-Tabs--inlineIcons` | `group=Tabs Icon`
+- Large | `static_id=large` | `css=t-TabsRegion-mod--large` | `group=Tabs Size`
+- Small | `static_id=small` | `css=t-TabsRegion-mod--small` | `group=Tabs Size`
+
+## Wizard Container (`wizard-container`)
+Preset: `t-Wizard--hideStepsXSmall`
+
+- Show Title | `static_id=show-title` | `css=t-Wizard--showTitle` | `group=--`
+- Small Screens (Tablet) | `static_id=small-screens-tablet` | `css=t-Wizard--hideStepsSmall` | `group=Hide Steps For`
+- X Small Screens (Mobile) | `static_id=x-small-screens-mobile` | `css=t-Wizard--hideStepsXSmall` | `group=Hide Steps For`