diff --git a/docs/404.md b/docs/404.md index d80f7b4ea..82e759a75 100644 --- a/docs/404.md +++ b/docs/404.md @@ -1,7 +1,7 @@ --- title: Not Found description: Sorry, I couldn't find that. -layout: page.njk +layout: page permalink: 404.html noindex: true --- diff --git a/docs/_includes/sidebar.njk b/docs/_includes/sidebar.njk index 1e16cc8db..40155df2c 100644 --- a/docs/_includes/sidebar.njk +++ b/docs/_includes/sidebar.njk @@ -8,16 +8,6 @@
  • Localization
    • -{# Experimental #} -

    Experimental

    - - - {# Resources #}

    Resources

    \ No newline at end of file + diff --git a/docs/docs/components/animated-image.md b/docs/docs/components/animated-image.md index 84606fca9..8966165d7 100644 --- a/docs/docs/components/animated-image.md +++ b/docs/docs/components/animated-image.md @@ -1,7 +1,7 @@ --- title: Animated Image description: A component for displaying animated GIFs and WEBPs that play and pause on interaction. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/animation.md b/docs/docs/components/animation.md index 91c41cade..1ac6326a8 100644 --- a/docs/docs/components/animation.md +++ b/docs/docs/components/animation.md @@ -1,7 +1,7 @@ --- title: Animation description: Animate elements declaratively with nearly 100 baked-in presets, or roll your own with custom keyframes. -layout: component.njk +layout: component --- To animate an element, wrap it in `` and set an animation `name`. The animation will not start until you add the `play` attribute. Refer to the [properties table](#properties) for a list of all animation options. diff --git a/docs/docs/components/avatar.md b/docs/docs/components/avatar.md index 5172bf6ab..2e9bc9334 100644 --- a/docs/docs/components/avatar.md +++ b/docs/docs/components/avatar.md @@ -1,7 +1,7 @@ --- title: Avatar description: Avatars are used to represent a person or object. -layout: component.njk +layout: component --- By default, a generic icon will be shown. You can personalize avatars by adding custom icons, initials, and images. You should always provide a `label` for assistive devices. diff --git a/docs/docs/components/badge.md b/docs/docs/components/badge.md index cf39605a7..ceb70a7db 100644 --- a/docs/docs/components/badge.md +++ b/docs/docs/components/badge.md @@ -1,7 +1,7 @@ --- title: Badge description: Badges are used to draw attention and display statuses or counts. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/breadcrumb-item.md b/docs/docs/components/breadcrumb-item.md index 6be9b1b81..2b8dfcced 100644 --- a/docs/docs/components/breadcrumb-item.md +++ b/docs/docs/components/breadcrumb-item.md @@ -1,7 +1,7 @@ --- title: Breadcrumb Item description: Breadcrumb Items are used inside breadcrumbs to represent different links. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/breadcrumb.md b/docs/docs/components/breadcrumb.md index f894b1574..857985412 100644 --- a/docs/docs/components/breadcrumb.md +++ b/docs/docs/components/breadcrumb.md @@ -1,7 +1,7 @@ --- title: Breadcrumb description: Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy. -layout: component.njk +layout: component --- Breadcrumbs are usually placed before a page's main content with the current page shown last to indicate the user's position in the navigation. diff --git a/docs/docs/components/button-group.md b/docs/docs/components/button-group.md index 3f76f878b..de7f10069 100644 --- a/docs/docs/components/button-group.md +++ b/docs/docs/components/button-group.md @@ -1,7 +1,7 @@ --- title: Button Group description: Button groups can be used to group related buttons into sections. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/button.md b/docs/docs/components/button.md index 963bc903a..008f37439 100644 --- a/docs/docs/components/button.md +++ b/docs/docs/components/button.md @@ -1,7 +1,7 @@ --- title: Button description: Buttons represent actions that are available to the user. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/callout.md b/docs/docs/components/callout.md index 90b1dbf9e..09196c815 100644 --- a/docs/docs/components/callout.md +++ b/docs/docs/components/callout.md @@ -1,7 +1,7 @@ --- title: Callout description: Callouts are used to display important messages inline. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/card.md b/docs/docs/components/card.md index 3477d035f..40f07f6c0 100644 --- a/docs/docs/components/card.md +++ b/docs/docs/components/card.md @@ -1,7 +1,7 @@ --- title: Card description: Cards can be used to group related subjects in a container. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/carousel-item.md b/docs/docs/components/carousel-item.md index 2b45bdb9c..34379d947 100644 --- a/docs/docs/components/carousel-item.md +++ b/docs/docs/components/carousel-item.md @@ -1,7 +1,7 @@ --- title: Carousel Item description: A carousel item represent a slide within a carousel. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/carousel.md b/docs/docs/components/carousel.md index 5f163fa6f..3ef8e46d3 100644 --- a/docs/docs/components/carousel.md +++ b/docs/docs/components/carousel.md @@ -1,7 +1,7 @@ --- title: Carousel description: Carousels display an arbitrary number of content slides along a horizontal or vertical axis. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/checkbox.md b/docs/docs/components/checkbox.md index 48229417c..5d7e61c2b 100644 --- a/docs/docs/components/checkbox.md +++ b/docs/docs/components/checkbox.md @@ -1,7 +1,7 @@ --- title: Checkbox description: Checkboxes allow the user to toggle an option on or off. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/color-picker.md b/docs/docs/components/color-picker.md index e4f2dd861..6ab70acd6 100644 --- a/docs/docs/components/color-picker.md +++ b/docs/docs/components/color-picker.md @@ -1,7 +1,7 @@ --- title: Color Picker description: Color pickers allow the user to select a color. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/copy-button.md b/docs/docs/components/copy-button.md index 635b3755a..bf305965b 100644 --- a/docs/docs/components/copy-button.md +++ b/docs/docs/components/copy-button.md @@ -1,7 +1,7 @@ --- title: Copy Button description: Copies data to the clipboard when the user clicks the button. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/details.md b/docs/docs/components/details.md index 2845a6f2a..22646e60d 100644 --- a/docs/docs/components/details.md +++ b/docs/docs/components/details.md @@ -1,7 +1,7 @@ --- title: Details description: Details show a brief summary and expand to show additional content. -layout: component.njk +layout: component --- diff --git a/docs/docs/components/dialog.md b/docs/docs/components/dialog.md index 20702e373..3ddef25be 100644 --- a/docs/docs/components/dialog.md +++ b/docs/docs/components/dialog.md @@ -1,7 +1,7 @@ --- title: Dialog description: 'Dialogs, sometimes called "modals", appear above the page and require the user''s immediate attention.' -layout: component.njk +layout: component --- diff --git a/docs/docs/components/divider.md b/docs/docs/components/divider.md index 463b1d5a6..62c7026aa 100644 --- a/docs/docs/components/divider.md +++ b/docs/docs/components/divider.md @@ -1,7 +1,7 @@ --- title: Divider description: Dividers are used to visually separate or group elements. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/drawer.md b/docs/docs/components/drawer.md index b7c72f0b9..16a99a79e 100644 --- a/docs/docs/components/drawer.md +++ b/docs/docs/components/drawer.md @@ -1,7 +1,7 @@ --- title: Drawer description: Drawers slide in from a container to expose additional options and information. -layout: component.njk +layout: component --- diff --git a/docs/docs/components/dropdown.md b/docs/docs/components/dropdown.md index 22cd7edbd..c5c970920 100644 --- a/docs/docs/components/dropdown.md +++ b/docs/docs/components/dropdown.md @@ -1,7 +1,7 @@ --- title: Dropdown description: 'Dropdowns expose additional content that "drops down" in a panel.' -layout: component.njk +layout: component --- Dropdowns consist of a trigger and a panel. By default, activating the trigger will expose the panel and interacting outside of the panel will close it. diff --git a/docs/docs/components/format-bytes.md b/docs/docs/components/format-bytes.md index 8cfc63a1c..364fbc756 100644 --- a/docs/docs/components/format-bytes.md +++ b/docs/docs/components/format-bytes.md @@ -1,7 +1,7 @@ --- title: Format Bytes description: Formats a number as a human readable bytes value. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/format-date.md b/docs/docs/components/format-date.md index 0107bce1c..6078908fa 100644 --- a/docs/docs/components/format-date.md +++ b/docs/docs/components/format-date.md @@ -1,7 +1,7 @@ --- title: Format Date description: Formats a date/time using the specified locale and options. -layout: component.njk +layout: component --- Localization is handled by the browser's [`Intl.DateTimeFormat` API](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat). No language packs are required. diff --git a/docs/docs/components/format-number.md b/docs/docs/components/format-number.md index f0eeab9d3..d14554b8b 100644 --- a/docs/docs/components/format-number.md +++ b/docs/docs/components/format-number.md @@ -1,7 +1,7 @@ --- title: Format Number description: Formats a number using the specified locale and options. -layout: component.njk +layout: component --- Localization is handled by the browser's [`Intl.NumberFormat` API](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat/NumberFormat). No language packs are required. diff --git a/docs/docs/components/icon-button.md b/docs/docs/components/icon-button.md index cbc3e812f..be3ffa302 100644 --- a/docs/docs/components/icon-button.md +++ b/docs/docs/components/icon-button.md @@ -1,7 +1,7 @@ --- title: Icon Button description: Icons buttons are simple, icon-only buttons that can be used for actions and in toolbars. -layout: component.njk +layout: component --- For a full list of icons that come bundled with Web Awesome, refer to the [icon component](/components/icon). diff --git a/docs/docs/components/icon.md b/docs/docs/components/icon.md index da303e383..9bf63534a 100644 --- a/docs/docs/components/icon.md +++ b/docs/docs/components/icon.md @@ -1,7 +1,7 @@ --- title: Icon description: Icons are symbols that can be used to represent various options within an application. -layout: component.njk +layout: component --- Web Awesome comes bundled with over 2,000 free icons courtesy of [Font Awesome](https://fontawesome.com/). These icons are part of the `default` icon library. Font Awesome Pro users can unlock additional icon families. Or, if you prefer, you can register your own [custom icon library](#icon-library). diff --git a/docs/docs/components/image-comparer.md b/docs/docs/components/image-comparer.md index 70cd2eb49..abbaa1a94 100644 --- a/docs/docs/components/image-comparer.md +++ b/docs/docs/components/image-comparer.md @@ -1,7 +1,7 @@ --- title: Image Comparer description: Compare visual differences between similar photos with a sliding panel. -layout: component.njk +layout: component --- For best results, use images that share the same dimensions. The slider can be controlled by dragging or pressing the left and right arrow keys. (Tip: press shift + arrows to move the slider in larger intervals, or home + end to jump to the beginning or end.) diff --git a/docs/docs/components/include.md b/docs/docs/components/include.md index b78439069..466521443 100644 --- a/docs/docs/components/include.md +++ b/docs/docs/components/include.md @@ -1,7 +1,7 @@ --- title: Include description: Includes give you the power to embed external HTML files into the page. -layout: component.njk +layout: component --- Included files are asynchronously requested using `window.fetch()`. Requests are cached, so the same file can be included multiple times, but only one request will be made. diff --git a/docs/docs/components/input.md b/docs/docs/components/input.md index 116d878bd..d28f0fe04 100644 --- a/docs/docs/components/input.md +++ b/docs/docs/components/input.md @@ -1,7 +1,7 @@ --- title: Input description: Inputs collect data from the user. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/menu-item.md b/docs/docs/components/menu-item.md index f5224d15a..796c15401 100644 --- a/docs/docs/components/menu-item.md +++ b/docs/docs/components/menu-item.md @@ -1,7 +1,7 @@ --- title: Menu Item description: Menu items provide options for the user to pick from in a menu. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/menu-label.md b/docs/docs/components/menu-label.md index ad206a6d2..619d57d4f 100644 --- a/docs/docs/components/menu-label.md +++ b/docs/docs/components/menu-label.md @@ -1,7 +1,7 @@ --- title: Menu Label description: Menu labels are used to describe a group of menu items. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/menu.md b/docs/docs/components/menu.md index 7639846f8..f11a8169d 100644 --- a/docs/docs/components/menu.md +++ b/docs/docs/components/menu.md @@ -1,7 +1,7 @@ --- title: Menu description: Menus provide a list of options for the user to choose from. -layout: component.njk +layout: component --- You can use [menu items](/components/menu-item), [menu labels](/components/menu-label), and [dividers](/components/divider) to compose a menu. Menus support keyboard interactions, including type-to-select an option. diff --git a/docs/docs/components/mutation-observer.md b/docs/docs/components/mutation-observer.md index 6a584d6ed..d91788fe5 100644 --- a/docs/docs/components/mutation-observer.md +++ b/docs/docs/components/mutation-observer.md @@ -1,7 +1,7 @@ --- title: Mutation Observer description: The Mutation Observer component offers a thin, declarative interface to the MutationObserver API. -layout: component.njk +layout: component --- The mutation observer will report changes to the content it wraps through the `wa-mutation` event. When emitted, a collection of [MutationRecord](https://developer.mozilla.org/en-US/docs/Web/API/MutationRecord) objects will be attached to `event.detail` that contains information about how it changed. diff --git a/docs/docs/components/option.md b/docs/docs/components/option.md index 1fe954435..b8be2a439 100644 --- a/docs/docs/components/option.md +++ b/docs/docs/components/option.md @@ -1,7 +1,7 @@ --- title: Option description: Options define the selectable items within various form controls such as select. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/page.md b/docs/docs/components/page.md index 73bb42d2f..078b74236 100644 --- a/docs/docs/components/page.md +++ b/docs/docs/components/page.md @@ -1,7 +1,7 @@ --- title: Page description: Layouts offer an easy way to scaffold pages using minimal markup. -layout: 'component.njk' +layout: component --- The layout component is designed to power full webpages. It is flexible enough to handle most modern designs and includes a simple mechanism for handling desktop and mobile navigation. diff --git a/docs/docs/components/popup.md b/docs/docs/components/popup.md index e602d7402..2cedeb87b 100644 --- a/docs/docs/components/popup.md +++ b/docs/docs/components/popup.md @@ -1,7 +1,7 @@ --- title: Popup description: 'Popup is a utility that lets you declaratively anchor "popup" containers to another element.' -layout: component.njk +layout: component --- This component's name is inspired by [``](https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/Popup/explainer.md). It uses [Floating UI](https://floating-ui.com/) under the hood to provide a well-tested, lightweight, and fully declarative positioning utility for tooltips, dropdowns, and more. diff --git a/docs/docs/components/progress-bar.md b/docs/docs/components/progress-bar.md index 73c84de1c..60a58dbab 100644 --- a/docs/docs/components/progress-bar.md +++ b/docs/docs/components/progress-bar.md @@ -1,7 +1,7 @@ --- title: Progress Bar description: Progress bars are used to show the status of an ongoing operation. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/progress-ring.md b/docs/docs/components/progress-ring.md index 7952b9237..9baa9384b 100644 --- a/docs/docs/components/progress-ring.md +++ b/docs/docs/components/progress-ring.md @@ -1,7 +1,7 @@ --- title: Progress Ring description: Progress rings are used to show the progress of a determinate operation in a circular fashion. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/qr-code.md b/docs/docs/components/qr-code.md index 09b9a1030..aaf088676 100644 --- a/docs/docs/components/qr-code.md +++ b/docs/docs/components/qr-code.md @@ -1,7 +1,7 @@ --- title: QR Code description: Generates a QR code and renders it using the Canvas API. -layout: component.njk +layout: component --- QR codes are useful for providing small pieces of information to users who can quickly scan them with a smartphone. Most smartphones have built-in QR code scanners, so simply pointing the camera at a QR code will decode it and allow the user to visit a website, dial a phone number, read a message, etc. diff --git a/docs/docs/components/radio-button.md b/docs/docs/components/radio-button.md index 7fb63d81f..15da7b7ef 100644 --- a/docs/docs/components/radio-button.md +++ b/docs/docs/components/radio-button.md @@ -1,7 +1,7 @@ --- title: Radio Button description: Radios buttons allow the user to select a single option from a group using a button-like control. -layout: component.njk +layout: component --- Radio buttons are designed to be used with [radio groups](/components/radio-group). When a radio button has focus, the arrow keys can be used to change the selected option just like standard radio controls. diff --git a/docs/docs/components/radio-group.md b/docs/docs/components/radio-group.md index 01ad37bb4..7021d9b47 100644 --- a/docs/docs/components/radio-group.md +++ b/docs/docs/components/radio-group.md @@ -1,7 +1,7 @@ --- title: Radio Group description: Radio groups are used to group multiple radios or radio buttons so they function as a single form control. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/radio.md b/docs/docs/components/radio.md index 316d1b1fc..3bb0ffa65 100644 --- a/docs/docs/components/radio.md +++ b/docs/docs/components/radio.md @@ -1,7 +1,7 @@ --- title: Radio description: Radios allow the user to select a single option from a group. -layout: component.njk +layout: component --- Radios are designed to be used with [radio groups](/components/radio-group). diff --git a/docs/docs/components/range.md b/docs/docs/components/range.md index a59e970e1..bfa043e70 100644 --- a/docs/docs/components/range.md +++ b/docs/docs/components/range.md @@ -1,7 +1,7 @@ --- title: Range description: Ranges allow the user to select a single value within a given range using a slider. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/rating.md b/docs/docs/components/rating.md index 540c26706..447d7f8aa 100644 --- a/docs/docs/components/rating.md +++ b/docs/docs/components/rating.md @@ -1,7 +1,7 @@ --- title: Rating description: Ratings give users a way to quickly view and provide feedback. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/relative-time.md b/docs/docs/components/relative-time.md index d40b3290a..ab5d5a4be 100644 --- a/docs/docs/components/relative-time.md +++ b/docs/docs/components/relative-time.md @@ -1,7 +1,7 @@ --- title: Relative Time description: Outputs a localized time phrase relative to the current date and time. -layout: component.njk +layout: component --- Localization is handled by the browser's [`Intl.RelativeTimeFormat` API](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat). No language packs are required. diff --git a/docs/docs/components/resize-observer.md b/docs/docs/components/resize-observer.md index f83c03c04..2fcd70bda 100644 --- a/docs/docs/components/resize-observer.md +++ b/docs/docs/components/resize-observer.md @@ -1,7 +1,7 @@ --- title: Resize Observer description: The Resize Observer component offers a thin, declarative interface to the ResizeObserver API. -layout: component.njk +layout: component --- The resize observer will report changes to the dimensions of the elements it wraps through the `wa-resize` event. When emitted, a collection of [`ResizeObserverEntry`](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserverEntry) objects will be attached to `event.detail` that contains the target element and information about its dimensions. diff --git a/docs/docs/components/select.md b/docs/docs/components/select.md index a216361bc..b05a78241 100644 --- a/docs/docs/components/select.md +++ b/docs/docs/components/select.md @@ -1,7 +1,7 @@ --- title: Select description: Selects allow you to choose items from a menu of predefined options. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/skeleton.md b/docs/docs/components/skeleton.md index 5db964120..741cb9e74 100644 --- a/docs/docs/components/skeleton.md +++ b/docs/docs/components/skeleton.md @@ -1,7 +1,7 @@ --- title: Skeleton description: Skeletons are used to provide a visual representation of where content will eventually be drawn. -layout: component.njk +layout: component --- These are simple containers for scaffolding layouts that mimic what users will see when content has finished loading. This prevents large areas of empty space during asynchronous operations. diff --git a/docs/docs/components/spinner.md b/docs/docs/components/spinner.md index 3b654a11e..97e432e0d 100644 --- a/docs/docs/components/spinner.md +++ b/docs/docs/components/spinner.md @@ -1,7 +1,7 @@ --- title: Spinner description: Spinners are used to show the progress of an indeterminate operation. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/split-panel.md b/docs/docs/components/split-panel.md index 36724a000..af5592c0a 100644 --- a/docs/docs/components/split-panel.md +++ b/docs/docs/components/split-panel.md @@ -1,7 +1,7 @@ --- title: Split Panel description: Split panels display two adjacent panels, allowing the user to reposition them. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/switch.md b/docs/docs/components/switch.md index e915c6250..4abb792da 100644 --- a/docs/docs/components/switch.md +++ b/docs/docs/components/switch.md @@ -1,7 +1,7 @@ --- title: Switch description: Switches allow the user to toggle an option on or off. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/tab-group.md b/docs/docs/components/tab-group.md index 88a4d6e9b..b9c5fa0b1 100644 --- a/docs/docs/components/tab-group.md +++ b/docs/docs/components/tab-group.md @@ -1,7 +1,7 @@ --- title: Tab Group description: Tab groups organize content into a container that shows one section at a time. -layout: component.njk +layout: component --- Tab groups make use of [tabs](/components/tab) and [tab panels](/components/tab-panel). Each tab must be slotted into the `nav` slot and its `panel` must refer to a tab panel of the same name. diff --git a/docs/docs/components/tab-panel.md b/docs/docs/components/tab-panel.md index 759663989..89560812d 100644 --- a/docs/docs/components/tab-panel.md +++ b/docs/docs/components/tab-panel.md @@ -1,7 +1,7 @@ --- title: Tab Panel description: Tab panels are used inside tab groups to display tabbed content. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/tab.md b/docs/docs/components/tab.md index 2d9996b96..befc249b5 100644 --- a/docs/docs/components/tab.md +++ b/docs/docs/components/tab.md @@ -1,7 +1,7 @@ --- title: Tab description: Tabs are used inside tab groups to represent and activate tab panels. -layout: component.njk +layout: component --- :::info diff --git a/docs/docs/components/tag.md b/docs/docs/components/tag.md index ee31b3b61..a64f99531 100644 --- a/docs/docs/components/tag.md +++ b/docs/docs/components/tag.md @@ -1,7 +1,7 @@ --- title: Tag description: Tags are used as labels to organize things or to indicate a selection. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/textarea.md b/docs/docs/components/textarea.md index 196cf20ca..08692760e 100644 --- a/docs/docs/components/textarea.md +++ b/docs/docs/components/textarea.md @@ -1,7 +1,7 @@ --- title: Textarea description: Textareas collect data from the user and allow multiple lines of text. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/tooltip.md b/docs/docs/components/tooltip.md index 245526f53..8225b3729 100644 --- a/docs/docs/components/tooltip.md +++ b/docs/docs/components/tooltip.md @@ -1,7 +1,7 @@ --- title: Tooltip description: Tooltips display additional information based on a specific action. -layout: component.njk +layout: component --- diff --git a/docs/docs/components/tree-item.md b/docs/docs/components/tree-item.md index cf77244ae..22ad3d07e 100644 --- a/docs/docs/components/tree-item.md +++ b/docs/docs/components/tree-item.md @@ -1,7 +1,7 @@ --- title: Tree Item description: A tree item serves as a hierarchical node that lives inside a tree. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/tree.md b/docs/docs/components/tree.md index 4de762cd4..a0006677f 100644 --- a/docs/docs/components/tree.md +++ b/docs/docs/components/tree.md @@ -1,7 +1,7 @@ --- title: Tree description: Trees allow you to display a hierarchical list of selectable tree items. Items with children can be expanded and collapsed as desired by the user. -layout: component.njk +layout: component --- ```html {.example} diff --git a/docs/docs/components/visually-hidden.md b/docs/docs/components/visually-hidden.md index bf9247d55..799620756 100644 --- a/docs/docs/components/visually-hidden.md +++ b/docs/docs/components/visually-hidden.md @@ -1,7 +1,7 @@ --- title: Visually Hidden description: The visually hidden utility makes content accessible to assistive devices without displaying it on the screen. -layout: component.njk +layout: component --- According to [The A11Y Project](https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/), "there are real world situations where visually hiding content may be appropriate, while the content should remain available to assistive technologies, such as screen readers. For instance, hiding a search field's label as a common magnifying glass icon is used in its stead." diff --git a/docs/docs/customizing.md b/docs/docs/customizing.md index 48e6bbdea..096523f82 100644 --- a/docs/docs/customizing.md +++ b/docs/docs/customizing.md @@ -1,7 +1,7 @@ --- title: Customizing description: Learn how to customize Web Awesome through parts and custom properties. -layout: page.njk +layout: page --- Web Awesome components can be customized at a high level through design tokens. This gives you control over theme colors and general styling. For more advanced customizations, you can make use of CSS parts and custom properties to target individual components. diff --git a/docs/docs/experimental/form-validation.md b/docs/docs/experimental/form-validation.md index 4afbfeef5..8b06cb1d3 100644 --- a/docs/docs/experimental/form-validation.md +++ b/docs/docs/experimental/form-validation.md @@ -1,7 +1,7 @@ --- title: Form Control Validation description: TODO -layout: page.njk +layout: page --- Adding the `wa-valid` or `wa-invalid` class to a form control will change its appearance. This is useful for applying validation styles to server-rendered form controls. diff --git a/docs/docs/experimental/sandbox.md b/docs/docs/experimental/sandbox.md index 8205c0a5b..4361fd90e 100644 --- a/docs/docs/experimental/sandbox.md +++ b/docs/docs/experimental/sandbox.md @@ -1,7 +1,7 @@ --- title: Theming Sandbox description: TODO -layout: page.njk +layout: page --- ## Card diff --git a/docs/docs/experimental/style-guide.md b/docs/docs/experimental/style-guide.md index 5efbf2593..8b1f86196 100644 --- a/docs/docs/experimental/style-guide.md +++ b/docs/docs/experimental/style-guide.md @@ -1,7 +1,7 @@ --- title: Style Guide description: TODO -layout: page.njk +layout: page --- The styles shown below can be all yours by adding Web Awesome's applied stylesheet to your project. diff --git a/docs/docs/experimental/themer.md b/docs/docs/experimental/themer.md index 526b04abb..e49c3a823 100644 --- a/docs/docs/experimental/themer.md +++ b/docs/docs/experimental/themer.md @@ -1,7 +1,7 @@ --- meta: title: Themer -layout: page.njk +layout: page hasOutline: false --- diff --git a/docs/docs/installation.md b/docs/docs/installation.md index 98cc4bfcd..296c6cac6 100644 --- a/docs/docs/installation.md +++ b/docs/docs/installation.md @@ -1,7 +1,7 @@ --- title: Installation description: Choose the installation method that works best for you. -layout: page.njk +layout: page --- You can load Web Awesome via CDN or by installing it locally. If you're using a framework, make sure to check out the pages for [React](/frameworks/react), [Vue](/frameworks/vue), and [Angular](/frameworks/angular) for additional information. diff --git a/docs/docs/localization.md b/docs/docs/localization.md index f4cb00e24..047644209 100644 --- a/docs/docs/localization.md +++ b/docs/docs/localization.md @@ -1,7 +1,7 @@ --- title: Localization description: Discover how to localize Web Awesome with minimal effort. -layout: page.njk +layout: page --- Components can be localized by importing the appropriate translation file and setting the desired [`lang`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang) and/or [`dir`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/dir) attributes on the `` element. Here's an example that renders Web Awesome components in Spanish. diff --git a/docs/docs/patterns/ecommerce.md b/docs/docs/patterns/ecommerce.md index 394bfa602..ad63b34e8 100644 --- a/docs/docs/patterns/ecommerce.md +++ b/docs/docs/patterns/ecommerce.md @@ -1,7 +1,7 @@ --- title: E-commerce description: TODO -layout: page.njk +layout: page --- TODO Page Description diff --git a/docs/docs/resources/accessibility.md b/docs/docs/resources/accessibility.md index 02857fd89..c9adc3d9d 100644 --- a/docs/docs/resources/accessibility.md +++ b/docs/docs/resources/accessibility.md @@ -1,7 +1,7 @@ --- title: Accessibility Commitment description: Web Awesome recognizes the need for all users to have undeterred access to the websites and applications that are created with it. -layout: page.njk +layout: page --- Web Awesome recognizes the need for all users, regardless of ability and device, to have undeterred access to the websites and applications that are created with it. This is an important goal of the project. diff --git a/docs/docs/resources/changelog.md b/docs/docs/resources/changelog.md index 9aa09e14b..57a6e64d7 100644 --- a/docs/docs/resources/changelog.md +++ b/docs/docs/resources/changelog.md @@ -1,7 +1,7 @@ --- title: Changelog description: Changes to each version of the project are documented here. -layout: page.njk +layout: page --- Web Awesome follows [Semantic Versioning](https://semver.org/). Breaking changes in components with the Stable badge will not be accepted until the next major version. As such, all contributions must consider the project's roadmap and take this into consideration. Features that are deemed no longer necessary will be deprecated but not removed. @@ -49,1740 +49,6 @@ New versions of Web Awesome are released as-needed and generally occur when a cr setter: `waInput.value = 5.toString()` getter: `Number(waInput.value)` -## Next +--- -- Fixed a bug in the submenu controller that prevented submenus from rendering in RTL without explicitly setting `dir` on the parent menu item [#1992] - -## 12.15.1 - -- Fixed a bug in `` where if a click did not contain a `` it would show a console error. [#2009] -- Fixed a bug in `` that caused it not to recalculate it's position when going from being `display: none;` to its original display value. [#1942] -- Fixed a bug in `` where when it showed it would cause a layout shift. [#1967] -- Fixed a bug in `` that allowed unwanted text properties to leak in [#1947] -- Fixed a bug in `` classes [#1974] -- Fixed a bug in `` that may throw errors on `disconnectedCallback` in test environments [#1985] -- Fixed a bug in `` that would log a non-passive event listener warning [#2005] -- Fixed a bug in the submenu controller that allowed submenus to go offscreen and not be scrollable [#2001] -- Fixed a bug in `` that caused the tooltip position to be incorrect in some cases [#1979] - -## 2.15.0 - -- Added support for `contextElement` to `VirtualElements` in `` [#1874] -- Added the `sync` property to `` [#1935] -- Fixed a bug in `` that did not properly apply mutators to spritesheets [#1927] -- Fixed a bug in `.sl-scroll-lock` causing layout shifts [#1895] -- Fixed a bug in `` that caused the rating to not reset in some circumstances [#1877] -- Fixed a bug in `` that caused the menu to not close when rendered in a shadow root [#1878] -- Fixed a bug in `` that caused a new stacking context resulting in tooltips being clipped [#1709] -- Fixed a bug in `` that caused the scroll controls to toggle indefinitely when zoomed in Safari [#1839] -- Fixed a bug in the submenu controller that allowed two submenus to be open at the same time [#1880] -- Fixed a bug in `` that prevented the control from receiving focus when clicking over the clear button -- Fixed a bug in `` where when it showed it would create a layout shift. [#1967] - -## 2.14.0 - -- Added the Arabic translation [#1852] -- Added help text to `` [#1860] -- Added help text to `` [#1800] -- Fixed a bug in `` that caused HTML tags to be included in `getTextLabel()` -- Fixed a bug in `` that caused slides to not switch correctly [#1862] -- Refactored component styles to be consumed more efficiently [#1692] - -## 2.13.1 - -- Fixed a bug where the safe triangle was always visible when selecting nested `` elements [#1835] - -## 2.13.0 - -- Added the `hover-bridge` feature to `` to support better tooltip accessibility [#1734] -- Added the `loading` attribute and the `spinner` and `spinner__base` part to `` [#1700] -- Fixed files that did not have `.js` extensions. [#1770] -- Fixed a bug in `` when providing custom expand / collapse icons [#1922] -- Fixed `` not accounting for elements with hidden dialog controls like `