@patternfly/elements 2.0.0-rc.5 → 2.0.0

package/pf-tooltip/pf-tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"pf-tooltip.js","sourceRoot":"","sources":["pf-tooltip.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;;;AAI/C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuFG;AAEI,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,WAAW;IAAnC;;QAGO,aAAQ,GAAc,KAAK,CAAC;IAI1C,CAAC;;AANiB,gBAAM,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAE7C;IAAX,QAAQ,EAAE;2CAA6B;AAG5B;IAAX,QAAQ,EAAE;0CAAkB;AANlB,SAAS;IADrB,aAAa,CAAC,YAAY,CAAC;GACf,SAAS,CAOrB;SAPY,SAAS","sourcesContent":["import type { Placement } from '@patternfly/pfe-core/controllers/floating-dom-controller.js';\n\nimport { customElement, property } from 'lit/decorators.js';\nimport { BaseTooltip } from './BaseTooltip.js';\n\nimport styles from './pf-tooltip.css';\n\n/**\n * Patternfly tooltip\n *\n * A Tooltip is a floating text area triggered by a user that provides helpful or contextual information.\n *\n * @summary Toggle the visiblity of helpful or contextual information.\n *\n * @slot\n *       This slot wraps around the element that should be used to invoke the tooltip content to display.\n *       Typically this would be an icon, button, or other small sized element.\n * @slot content\n *       This slot renders the content that will be displayed inside of the tooltip.\n *       Typically this would include a string of text without any additional elements.\n *       This element is wrapped with a div inside of the component to give it the stylings and background colors.\n *\n * @cssprop     {<color>} --pf-c-tooltip__content--BackgroundColor\n *              Sets the background color for the tooltip content.\n *              {@default `#1b1d21`}\n * @cssprop     {<color>} --pf-c-tooltip__content--Color\n *              Sets the font color for the tooltip content.\n *              {@default `#e0e0e0`}\n * @cssprop     {<number>} --pf-c-tooltip--line-height\n *              Sets the font color for the tooltip content.\n *              {@default `1.5`}\n * @cssprop     {<length>} --pf-c-tooltip--MaxWidth\n *              Maximum width for the tooltip.\n *              {@default `18.75rem`}\n * @cssprop     --pf-c-tooltip--BoxShadow\n *              Box shadow for the tooltip.\n *              {@default `0 0.25rem 0.5rem 0rem rgba(3, 3, 3, 0.12), 0 0 0.25rem 0 rgba(3, 3, 3, 0.06)`}\n * @cssprop     {<length>} --pf-c-tooltip__content--PaddingTop\n *              Top padding for the tooltip.\n *              {@default `0.5rem`}\n * @cssprop     {<length>} --pf-c-tooltip__content--PaddingRight\n *              Right padding for the tooltip.\n *              {@default `0.5rem`}\n * @cssprop     {<length>} --pf-c-tooltip__content--PaddingBottom\n *              Bottom padding for the tooltip.\n *              {@default `0.5rem`}\n * @cssprop     {<length>} --pf-c-tooltip__content--PaddingLeft\n *              Left Padding for the tooltip.\n *              {@default `0.5rem`}\n * @cssprop     --pf-c-tooltip__content--FontSize\n *              Font size for the tooltip content.\n *              {@default `0.875rem`}\n * @cssprop     {<length>} --pf-c-tooltip__arrow--Width\n *              Tooltip arrow width.\n *              {@default `0.5rem`}\n * @cssprop     {<length>} --pf-c-tooltip__arrow--Height\n *              Tooltip arrow height.\n *              {@default `0.5rem`}\n * @cssprop     --pf-c-tooltip__arrow--m-top--TranslateX\n *              Positions the tooltip arrow along the x axis for `top` positioned arrows.\n *              {@default `-50%`}\n * @cssprop     --pf-c-tooltip__arrow--m-top--TranslateY\n *              Positions the tooltip arrow along the y axis for `top` positioned arrows.\n *              {@default `50%`}\n * @cssprop     --pf-c-tooltip__arrow--m-top--Rotate\n *              Rotates the tooltip arrow based on degrees of movement for `top` positioned arrows.\n *              {@default `45deg`}\n * @cssprop     --pf-c-tooltip__arrow--m-right--TranslateX\n *              Positions the tooltip arrow along the x axis for `right` positioned arrows.\n *              {@default `-50%`}\n * @cssprop     --pf-c-tooltip__arrow--m-right--TranslateY\n *              Positions the tooltip arrow along the y axis for `right` positioned arrows.\n *              {@default `-50%`}\n * @cssprop     --pf-c-tooltip__arrow--m-right--Rotate\n *              Rotates the tooltip arrow based on degrees of movement for `right` positioned arrows.\n *              {@default `45deg`}\n * @cssprop     --pf-c-tooltip__arrow--m-bottom--TranslateX\n *              Positions the tooltip arrow along the x axis for `bottom` positioned arrows.\n *              {@default `-50%`}\n * @cssprop     --pf-c-tooltip__arrow--m-bottom--TranslateY\n *              Positions the tooltip arrow along the y axis for `bottom` positioned arrows.\n *              {@default `-50%`}\n * @cssprop     --pf-c-tooltip__arrow--m-bottom--Rotate\n *              Rotates the tooltip arrow based on degrees of movement for `bottom` positioned arrows.\n *              {@default `45deg`}\n * @cssprop     --pf-c-tooltip__arrow--m-left--TranslateX\n *              Positions the tooltip arrow along the x axis for `left` positioned arrows.\n *              {@default `50%`}\n * @cssprop     --pf-c-tooltip__arrow--m-left--TranslateY\n *              Positions the tooltip arrow along the y axis for `left` positioned arrows.\n *              {@default `-50%`}\n * @cssprop     --pf-c-tooltip__arrow--m-left--Rotate\n *              Rotates the tooltip arrow based on degrees of movement for `left` positioned arrows.\n *              {@default `45deg`}\n */\n@customElement('pf-tooltip')\nexport class PfTooltip extends BaseTooltip {\n  static readonly styles = [...BaseTooltip.styles, styles];\n\n  @property() position: Placement = 'top';\n\n  /** Tooltip content. Overridden by the content slot */\n  @property() content?: string;\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-tooltip': PfTooltip;\n  }\n}\n"]}
+{"version":3,"file":"pf-tooltip.js","sourceRoot":"","sources":["pf-tooltip.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACjE,OAAO,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;;;AAI/C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuFG;AAEI,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,WAAW;IAAnC;;QAGO,aAAQ,GAAc,KAAK,CAAC;IAI1C,CAAC;;AANiB,gBAAM,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAE7C;IAAX,QAAQ,EAAE;2CAA6B;AAG5B;IAAX,QAAQ,EAAE;0CAAkB;AANlB,SAAS;IADrB,aAAa,CAAC,YAAY,CAAC;GACf,SAAS,CAOrB;SAPY,SAAS","sourcesContent":["import type { Placement } from '@patternfly/pfe-core/controllers/floating-dom-controller.js';\n\nimport { customElement } from 'lit/decorators/custom-element.js';\nimport { property } from 'lit/decorators/property.js';\nimport { BaseTooltip } from './BaseTooltip.js';\n\nimport styles from './pf-tooltip.css';\n\n/**\n * Patternfly tooltip\n *\n * A Tooltip is a floating text area triggered by a user that provides helpful or contextual information.\n *\n * @summary Toggle the visiblity of helpful or contextual information.\n *\n * @slot\n *       This slot wraps around the element that should be used to invoke the tooltip content to display.\n *       Typically this would be an icon, button, or other small sized element.\n * @slot content\n *       This slot renders the content that will be displayed inside of the tooltip.\n *       Typically this would include a string of text without any additional elements.\n *       This element is wrapped with a div inside of the component to give it the stylings and background colors.\n *\n * @cssprop     {<color>} --pf-c-tooltip__content--BackgroundColor\n *              Sets the background color for the tooltip content.\n *              {@default `#1b1d21`}\n * @cssprop     {<color>} --pf-c-tooltip__content--Color\n *              Sets the font color for the tooltip content.\n *              {@default `#e0e0e0`}\n * @cssprop     {<number>} --pf-c-tooltip--line-height\n *              Sets the font color for the tooltip content.\n *              {@default `1.5`}\n * @cssprop     {<length>} --pf-c-tooltip--MaxWidth\n *              Maximum width for the tooltip.\n *              {@default `18.75rem`}\n * @cssprop     --pf-c-tooltip--BoxShadow\n *              Box shadow for the tooltip.\n *              {@default `0 0.25rem 0.5rem 0rem rgba(3, 3, 3, 0.12), 0 0 0.25rem 0 rgba(3, 3, 3, 0.06)`}\n * @cssprop     {<length>} --pf-c-tooltip__content--PaddingTop\n *              Top padding for the tooltip.\n *              {@default `0.5rem`}\n * @cssprop     {<length>} --pf-c-tooltip__content--PaddingRight\n *              Right padding for the tooltip.\n *              {@default `0.5rem`}\n * @cssprop     {<length>} --pf-c-tooltip__content--PaddingBottom\n *              Bottom padding for the tooltip.\n *              {@default `0.5rem`}\n * @cssprop     {<length>} --pf-c-tooltip__content--PaddingLeft\n *              Left Padding for the tooltip.\n *              {@default `0.5rem`}\n * @cssprop     --pf-c-tooltip__content--FontSize\n *              Font size for the tooltip content.\n *              {@default `0.875rem`}\n * @cssprop     {<length>} --pf-c-tooltip__arrow--Width\n *              Tooltip arrow width.\n *              {@default `0.5rem`}\n * @cssprop     {<length>} --pf-c-tooltip__arrow--Height\n *              Tooltip arrow height.\n *              {@default `0.5rem`}\n * @cssprop     --pf-c-tooltip__arrow--m-top--TranslateX\n *              Positions the tooltip arrow along the x axis for `top` positioned arrows.\n *              {@default `-50%`}\n * @cssprop     --pf-c-tooltip__arrow--m-top--TranslateY\n *              Positions the tooltip arrow along the y axis for `top` positioned arrows.\n *              {@default `50%`}\n * @cssprop     --pf-c-tooltip__arrow--m-top--Rotate\n *              Rotates the tooltip arrow based on degrees of movement for `top` positioned arrows.\n *              {@default `45deg`}\n * @cssprop     --pf-c-tooltip__arrow--m-right--TranslateX\n *              Positions the tooltip arrow along the x axis for `right` positioned arrows.\n *              {@default `-50%`}\n * @cssprop     --pf-c-tooltip__arrow--m-right--TranslateY\n *              Positions the tooltip arrow along the y axis for `right` positioned arrows.\n *              {@default `-50%`}\n * @cssprop     --pf-c-tooltip__arrow--m-right--Rotate\n *              Rotates the tooltip arrow based on degrees of movement for `right` positioned arrows.\n *              {@default `45deg`}\n * @cssprop     --pf-c-tooltip__arrow--m-bottom--TranslateX\n *              Positions the tooltip arrow along the x axis for `bottom` positioned arrows.\n *              {@default `-50%`}\n * @cssprop     --pf-c-tooltip__arrow--m-bottom--TranslateY\n *              Positions the tooltip arrow along the y axis for `bottom` positioned arrows.\n *              {@default `-50%`}\n * @cssprop     --pf-c-tooltip__arrow--m-bottom--Rotate\n *              Rotates the tooltip arrow based on degrees of movement for `bottom` positioned arrows.\n *              {@default `45deg`}\n * @cssprop     --pf-c-tooltip__arrow--m-left--TranslateX\n *              Positions the tooltip arrow along the x axis for `left` positioned arrows.\n *              {@default `50%`}\n * @cssprop     --pf-c-tooltip__arrow--m-left--TranslateY\n *              Positions the tooltip arrow along the y axis for `left` positioned arrows.\n *              {@default `-50%`}\n * @cssprop     --pf-c-tooltip__arrow--m-left--Rotate\n *              Rotates the tooltip arrow based on degrees of movement for `left` positioned arrows.\n *              {@default `45deg`}\n */\n@customElement('pf-tooltip')\nexport class PfTooltip extends BaseTooltip {\n  static readonly styles = [...BaseTooltip.styles, styles];\n\n  @property() position: Placement = 'top';\n\n  /** Tooltip content. Overridden by the content slot */\n  @property() content?: string;\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'pf-tooltip': PfTooltip;\n  }\n}\n"]}