query-assigned-nodes.d.ts 2.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. /**
  2. * @license
  3. * Copyright 2017 Google LLC
  4. * SPDX-License-Identifier: BSD-3-Clause
  5. */
  6. /**
  7. * Options for the {@linkcode queryAssignedNodes} decorator. Extends the options
  8. * that can be passed into [HTMLSlotElement.assignedNodes](https://developer.mozilla.org/en-US/docs/Web/API/HTMLSlotElement/assignedNodes).
  9. */
  10. export interface QueryAssignedNodesOptions extends AssignedNodesOptions {
  11. /**
  12. * Name of the slot to query. Leave empty for the default slot.
  13. */
  14. slot?: string;
  15. }
  16. declare type TSDecoratorReturnType = void | any;
  17. /**
  18. * A property decorator that converts a class property into a getter that
  19. * returns the `assignedNodes` of the given `slot`.
  20. *
  21. * Can be passed an optional {@linkcode QueryAssignedNodesOptions} object.
  22. *
  23. * Example usage:
  24. * ```ts
  25. * class MyElement {
  26. * @queryAssignedNodes({slot: 'list', flatten: true})
  27. * listItems!: Array<Node>;
  28. *
  29. * render() {
  30. * return html`
  31. * <slot name="list"></slot>
  32. * `;
  33. * }
  34. * }
  35. * ```
  36. *
  37. * Note the type of this property should be annotated as `Array<Node>`.
  38. *
  39. * @category Decorator
  40. */
  41. export declare function queryAssignedNodes(options?: QueryAssignedNodesOptions): TSDecoratorReturnType;
  42. /**
  43. * A property decorator that converts a class property into a getter that
  44. * returns the `assignedNodes` of the given named `slot`.
  45. *
  46. * Example usage:
  47. * ```ts
  48. * class MyElement {
  49. * @queryAssignedNodes('list', true, '.item')
  50. * listItems!: Array<HTMLElement>;
  51. *
  52. * render() {
  53. * return html`
  54. * <slot name="list"></slot>
  55. * `;
  56. * }
  57. * }
  58. * ```
  59. *
  60. * Note the type of this property should be annotated as `Array<Node>` if used
  61. * without a `selector` or `Array<HTMLElement>` if a selector is provided.
  62. * Use {@linkcode queryAssignedElements @queryAssignedElements} to list only
  63. * elements, and optionally filter the element list using a CSS selector.
  64. *
  65. * @param slotName A string name of the slot.
  66. * @param flatten A boolean which when true flattens the assigned nodes,
  67. * meaning any assigned nodes that are slot elements are replaced with their
  68. * assigned nodes.
  69. * @param selector A CSS selector used to filter the elements returned.
  70. *
  71. * @category Decorator
  72. * @deprecated Prefer passing in a single options object, i.e. `{slot: 'list'}`.
  73. * If using `selector` please use `@queryAssignedElements`.
  74. * `@queryAssignedNodes('', false, '.item')` is functionally identical to
  75. * `@queryAssignedElements({slot: '', flatten: false, selector: '.item'})` or
  76. * `@queryAssignedElements({selector: '.item'})`.
  77. */
  78. export declare function queryAssignedNodes(slotName?: string, flatten?: boolean, selector?: string): TSDecoratorReturnType;
  79. export {};
  80. //# sourceMappingURL=query-assigned-nodes.d.ts.map