@material/dom

  • Version 13.0.0
  • Published
  • 112 kB
  • 2 dependencies
  • MIT license

Install

npm i @material/dom
yarn add @material/dom
pnpm add @material/dom

Overview

DOM manipulation utilities for Material Components for the web

Index

Namespaces

namespace events

module 'events.d.ts' {}
  • Copyright 2019 Google Inc.

    Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

    The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

function applyPassive

applyPassive: (globalObj?: Window) => boolean | EventListenerOptions;
  • Determine whether the current browser supports passive event listeners, and if so, use them.

namespace focusTrap

module 'focus-trap.d.ts' {}
  • Copyright 2020 Google Inc.

    Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

    The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

    THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

class FocusTrap

class FocusTrap {}
  • Utility to trap focus in a given root element, e.g. for modal components such as dialogs. The root should have at least one focusable child element, for setting initial focus when trapping focus. Also tracks the previously focused element, and restores focus to that element when releasing focus.

constructor

constructor(root: HTMLElement, options?: FocusOptions);

    method releaseFocus

    releaseFocus: () => void;
    • Releases focus from root. Also restores focus to the previously focused element.

    method trapFocus

    trapFocus: () => void;
    • Traps focus in root. Also focuses on either initialFocusEl if set; otherwises sets initial focus to the first focusable child element.

    interface FocusOptions

    interface FocusOptions {}
    • Customization options.

    property initialFocusEl

    initialFocusEl?: HTMLElement;

      property skipInitialFocus

      skipInitialFocus?: boolean;

        property skipRestoreFocus

        skipRestoreFocus?: boolean;

          namespace keyboard

          module 'keyboard.d.ts' {}
          • Copyright 2020 Google Inc.

            Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

            The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

            THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

          variable KEY

          const KEY: {
          UNKNOWN: string;
          BACKSPACE: string;
          ENTER: string;
          SPACEBAR: string;
          PAGE_UP: string;
          PAGE_DOWN: string;
          END: string;
          HOME: string;
          ARROW_LEFT: string;
          ARROW_UP: string;
          ARROW_RIGHT: string;
          ARROW_DOWN: string;
          DELETE: string;
          ESCAPE: string;
          TAB: string;
          };
          • KEY provides normalized string values for keys.

          function isNavigationEvent

          isNavigationEvent: (evt: KeyboardEvent) => boolean;
          • isNavigationEvent returns whether the event is a navigation event

          function normalizeKey

          normalizeKey: (evt: KeyboardEvent) => string;
          • normalizeKey returns the normalized string for a navigational action.

          namespace ponyfill

          module 'ponyfill.d.ts' {}
          • Copyright 2018 Google Inc.

            Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

            The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

            THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

          function closest

          closest: (element: Element, selector: string) => Element | null;
          • A "ponyfill" is a polyfill that doesn't modify the global prototype chain. This makes ponyfills safer than traditional polyfills, especially for libraries like MDC.

          function estimateScrollWidth

          estimateScrollWidth: (element: Element) => number;
          • Used to compute the estimated scroll width of elements. When an element is hidden due to display: none; being applied to a parent element, the width is returned as 0. However, the element will have a true width once no longer inside a display: none context. This method computes an estimated width when the element is hidden or returns the true width when the element is visble.

            Parameter element

            the element whose width to estimate

          function matches

          matches: (element: Element, selector: string) => boolean;

            Package Files (5)

            Dependencies (2)

            Dev Dependencies (0)

            No dev dependencies.

            Peer Dependencies (0)

            No peer dependencies.

            Badge

            To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

            You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/@material/dom.

            • Markdown
              [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/@material/dom)
            • HTML
              <a href="https://www.jsdocs.io/package/@material/dom"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>