@ahrowe/ui 0.41.1 → 0.41.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (24) hide show
  1. package/dist/cjs-types/common/hooks/useAnchorTracking.d.ts +4 -3
  2. package/dist/cjs-types/common/popover/usePopoverPosition.d.ts +6 -1
  3. package/dist/esm/common/fab/fab.module.mjs.map +1 -1
  4. package/dist/esm/common/hooks/useAnchorTracking.mjs +1 -1
  5. package/dist/esm/common/hooks/useAnchorTracking.mjs.map +1 -1
  6. package/dist/esm/common/hooks/useFocusBoundary.mjs +1 -1
  7. package/dist/esm/common/hooks/useFocusBoundary.mjs.map +1 -1
  8. package/dist/esm/common/hooks/useOverlay.mjs +1 -1
  9. package/dist/esm/common/hooks/useOverlay.mjs.map +1 -1
  10. package/dist/esm/common/modal/modal.module.mjs.map +1 -1
  11. package/dist/esm/common/popover/popover.mjs +1 -1
  12. package/dist/esm/common/popover/popover.mjs.map +1 -1
  13. package/dist/esm/common/popover/popover.module.mjs.map +1 -1
  14. package/dist/esm/common/popover/usePopoverPosition.mjs +1 -1
  15. package/dist/esm/common/popover/usePopoverPosition.mjs.map +1 -1
  16. package/dist/esm/common/styles/sheet.module.mjs.map +1 -1
  17. package/dist/esm/common/tooltip/tooltip.module.mjs.map +1 -1
  18. package/dist/index.cjs +3 -3
  19. package/dist/index.cjs.map +1 -1
  20. package/dist/style.css +1 -1
  21. package/dist/types/common/hooks/useAnchorTracking.d.ts +4 -3
  22. package/dist/types/common/popover/usePopoverPosition.d.ts +6 -1
  23. package/docs/Modal.md +1 -1
  24. package/package.json +1 -1
package/dist/esm/common/tooltip/tooltip.module.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tooltip.module.mjs","names":[],"sources":["../../../../package/common/tooltip/tooltip.module.pcss"],"sourcesContent":["/* Both bubbles are portaled to the end of the document and placed by\n `usePopoverPosition`, which writes `top`, `left`, `visibility` and\n `data-placement` straight onto them. */\n.tooltipBubble,\n.tooltipError {\n position: fixed;\n z-index: 10;\n width: max-content;\n\n /* So a max-width is the width you actually get, padding included. Without it the\n screen cap below let the box out by its own padding. */\n box-sizing: border-box;\n\n /* Hidden until the first coordinates are written, to avoid a top-left flash. */\n visibility: hidden;\n}\n\n.tooltipBubble {\n /* Resolved on the bubble so it, its arrow and the badge cannot drift apart. The\n default is an inverse of the theme, not a fixed slate: a tooltip has to separate\n from the page it floats over, and a dark bubble sat almost invisibly on a dark\n theme. */\n --custom-tooltip-background: var(--tooltip-background, color-mix(in oklab, var(--text-color) 82%, var(--background)));\n --custom-tooltip-color: var(--tooltip-color, var(--background));\n\n /* The lengths here are em against this bubble's own 0.75em, so the ratios are of 12px,\n not 16, and max-width is a line measure rather than a pixel cap. */\n border-radius: 0.25em;\n\n /* Padding included, per the border-box above. The second term is the screen, with\n the gutter `usePopoverPosition` keeps when it shifts a panel back on-screen: a\n bubble wider than that cannot be clamped into view, only pushed off one edge,\n so it wraps instead. */\n max-width: min(16.667em, calc(100vw - 16px));\n font-size: 0.75em;\n background-color: var(--custom-tooltip-background);\n padding: 0.5em 0.75em;\n color: var(--custom-tooltip-color);\n pointer-events: none;\n\n &::after {\n content: '';\n position: absolute;\n top: 100%;\n\n /* The bubble's leading edge is the trigger's, so half the trigger's width is the\n trigger's centre. The second term must stay half the arrow's own width, or it\n stops pointing at it. */\n left: calc(var(--tooltip-trigger-width, 10px) / 2 - 0.4167em);\n border-width: 0.4167em;\n border-style: solid;\n border-color: var(--custom-tooltip-background) transparent transparent;\n }\n\n &[data-placement='bottom']::after {\n top: auto;\n bottom: 100%;\n border-color: transparent transparent var(--custom-tooltip-background);\n }\n}\n\n.tooltipDetails {\n /* Repeated from .tooltipBubble above: the badge is a second root, rendered without one. */\n --custom-tooltip-background: var(--tooltip-background, color-mix(in oklab, var(--text-color) 82%, var(--background)));\n --custom-tooltip-color: var(--tooltip-color, var(--background));\n\n position: relative;\n display: inline-flex;\n align-items: center;\n\n &-icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n /* The theme's base, not a multiple of the font below: that landed a fraction of a pixel short. */\n width: var(--default-font-size);\n height: var(--default-font-size);\n border-radius: 50%;\n\n /* calc, not em: this badge renders inline wherever the consumer puts it, so em would\n measure that text. The bubble above can use em, because BodyEnd sets the theme's own\n font size on everything it portals. */\n font-size: calc(var(--default-font-size) * 0.6875);\n font-weight: 700;\n background-color: var(--custom-tooltip-background);\n color: var(--custom-tooltip-color);\n cursor: default;\n user-select: none;\n }\n}\n\n.tooltipError {\n border-radius: 0.3em;\n\n /* No measure of its own: a validator's message is as long as it is. The screen is\n still the limit, though, the same one the bubble above takes. */\n max-width: calc(100vw - 16px);\n background-color: var(--error-lighter);\n color: var(--error-color);\n font-size: 0.625em;\n padding: 0.6em 0.9em;\n\n &::after {\n content: '';\n position: absolute;\n top: 100%;\n right: 1.2em;\n border-width: 0.5em;\n border-style: solid;\n border-color: var(--error-border-color) transparent transparent transparent;\n }\n\n &[data-placement='bottom']::after {\n top: auto;\n bottom: 100%;\n border-color: transparent transparent var(--error-border-color) transparent;\n }\n}\n"],"mappings":""}
1
+ {"version":3,"file":"tooltip.module.mjs","names":[],"sources":["../../../../package/common/tooltip/tooltip.module.pcss"],"sourcesContent":["/* Both bubbles are portaled to the end of the document and placed by\n `usePopoverPosition`, which writes `top`, `left`, `visibility` and\n `data-placement` straight onto them. */\n.tooltipBubble,\n.tooltipError {\n position: fixed;\n\n /* Shared by every overlay, so the order they are portaled in, which is the order they opened in, decides. */\n z-index: 1;\n width: max-content;\n\n /* So a max-width is the width you actually get, padding included. Without it the\n screen cap below let the box out by its own padding. */\n box-sizing: border-box;\n\n /* Hidden until the first coordinates are written, to avoid a top-left flash. */\n visibility: hidden;\n}\n\n.tooltipBubble {\n /* Resolved on the bubble so it, its arrow and the badge cannot drift apart. The\n default is an inverse of the theme, not a fixed slate: a tooltip has to separate\n from the page it floats over, and a dark bubble sat almost invisibly on a dark\n theme. */\n --custom-tooltip-background: var(--tooltip-background, color-mix(in oklab, var(--text-color) 82%, var(--background)));\n --custom-tooltip-color: var(--tooltip-color, var(--background));\n\n /* The lengths here are em against this bubble's own 0.75em, so the ratios are of 12px,\n not 16, and max-width is a line measure rather than a pixel cap. */\n border-radius: 0.25em;\n\n /* Padding included, per the border-box above. The second term is the screen, with\n the gutter `usePopoverPosition` keeps when it shifts a panel back on-screen: a\n bubble wider than that cannot be clamped into view, only pushed off one edge,\n so it wraps instead. */\n max-width: min(16.667em, calc(100vw - 16px));\n font-size: 0.75em;\n background-color: var(--custom-tooltip-background);\n padding: 0.5em 0.75em;\n color: var(--custom-tooltip-color);\n pointer-events: none;\n\n &::after {\n content: '';\n position: absolute;\n top: 100%;\n\n /* The bubble's leading edge is the trigger's, so half the trigger's width is the\n trigger's centre. The second term must stay half the arrow's own width, or it\n stops pointing at it. */\n left: calc(var(--tooltip-trigger-width, 10px) / 2 - 0.4167em);\n border-width: 0.4167em;\n border-style: solid;\n border-color: var(--custom-tooltip-background) transparent transparent;\n }\n\n &[data-placement='bottom']::after {\n top: auto;\n bottom: 100%;\n border-color: transparent transparent var(--custom-tooltip-background);\n }\n}\n\n.tooltipDetails {\n /* Repeated from .tooltipBubble above: the badge is a second root, rendered without one. */\n --custom-tooltip-background: var(--tooltip-background, color-mix(in oklab, var(--text-color) 82%, var(--background)));\n --custom-tooltip-color: var(--tooltip-color, var(--background));\n\n position: relative;\n display: inline-flex;\n align-items: center;\n\n &-icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n /* The theme's base, not a multiple of the font below: that landed a fraction of a pixel short. */\n width: var(--default-font-size);\n height: var(--default-font-size);\n border-radius: 50%;\n\n /* calc, not em: this badge renders inline wherever the consumer puts it, so em would\n measure that text. The bubble above can use em, because BodyEnd sets the theme's own\n font size on everything it portals. */\n font-size: calc(var(--default-font-size) * 0.6875);\n font-weight: 700;\n background-color: var(--custom-tooltip-background);\n color: var(--custom-tooltip-color);\n cursor: default;\n user-select: none;\n }\n}\n\n.tooltipError {\n border-radius: 0.3em;\n\n /* No measure of its own: a validator's message is as long as it is. The screen is\n still the limit, though, the same one the bubble above takes. */\n max-width: calc(100vw - 16px);\n background-color: var(--error-lighter);\n color: var(--error-color);\n font-size: 0.625em;\n padding: 0.6em 0.9em;\n\n &::after {\n content: '';\n position: absolute;\n top: 100%;\n right: 1.2em;\n border-width: 0.5em;\n border-style: solid;\n border-color: var(--error-border-color) transparent transparent transparent;\n }\n\n &[data-placement='bottom']::after {\n top: auto;\n bottom: 100%;\n border-color: transparent transparent var(--error-border-color) transparent;\n }\n}\n"],"mappings":""}