@kubit-ui-web/react-components 2.0.0-beta.7 → 2.0.0-beta.9

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 (36) hide show
  1. package/dist/cjs/components/calendar/list/list.js +1 -1
  2. package/dist/cjs/components/calendar/selector/monthSelector/monthSelector.js +1 -1
  3. package/dist/cjs/components/image/image.css +1 -38
  4. package/dist/cjs/components/listOptions/listOptionsStandAlone.js +1 -1
  5. package/dist/cjs/components/option/optionStandAlone.js +1 -1
  6. package/dist/cjs/components/popover/styles/index.css +1 -10
  7. package/dist/cjs/components/popover/styles/keyframes.css +1 -421
  8. package/dist/cjs/components/popover/styles/popover-arrow.css +1 -42
  9. package/dist/cjs/components/popover/styles/popover.css +1 -189
  10. package/dist/cjs/components/skeleton/skeleton.css +1 -20
  11. package/dist/cjs/components/table/__stories__/css/table.css +1 -7
  12. package/dist/cjs/components/text/text.css +1 -14
  13. package/dist/cjs/components/tooltip/hooks/useTooltip.js +1 -1
  14. package/dist/cjs/components/tooltip/tooltip.css +1 -69
  15. package/dist/cjs/lib/components/customComponent/customComponent.js +1 -1
  16. package/dist/cjs/lib/provider/cssProvider/provider.js +1 -1
  17. package/dist/cjs/lib/provider/cssProvider/stats/stats.js +1 -1641
  18. package/dist/esm/components/calendar/list/list.js +1 -1
  19. package/dist/esm/components/calendar/selector/monthSelector/monthSelector.js +1 -1
  20. package/dist/esm/components/image/image.css +1 -38
  21. package/dist/esm/components/listOptions/listOptionsStandAlone.js +1 -1
  22. package/dist/esm/components/option/optionStandAlone.js +7 -7
  23. package/dist/esm/components/popover/styles/index.css +1 -10
  24. package/dist/esm/components/popover/styles/keyframes.css +1 -421
  25. package/dist/esm/components/popover/styles/popover-arrow.css +1 -42
  26. package/dist/esm/components/popover/styles/popover.css +1 -189
  27. package/dist/esm/components/skeleton/skeleton.css +1 -20
  28. package/dist/esm/components/table/__stories__/css/table.css +1 -7
  29. package/dist/esm/components/text/text.css +1 -14
  30. package/dist/esm/components/tooltip/hooks/useTooltip.js +1 -1
  31. package/dist/esm/components/tooltip/tooltip.css +1 -69
  32. package/dist/esm/lib/components/customComponent/customComponent.js +2 -2
  33. package/dist/esm/lib/provider/cssProvider/provider.js +1 -1
  34. package/dist/esm/lib/provider/cssProvider/stats/stats.js +1 -1641
  35. package/dist/styles/kubit/css/kubit.css +1 -1
  36. package/package.json +7 -1
@@ -1,189 +1 @@
1
- /**
2
- * PopoverV2 Main Styles
3
- * Contains animation logic and positioning styles
4
- */
5
-
6
- /* Import all animation keyframes */
7
- @import './keyframes.css';
8
-
9
- /* Popover Animation Styles */
10
- /* ============================================= */
11
-
12
- /* Base animation properties - ALWAYS applied (even with disableAnimations=true) */
13
- /* This allows additionalClasses to work properly */
14
- [data-kbt-id='popover'][data-kbt-placement] {
15
- animation-duration: 500ms;
16
- animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
17
- animation-fill-mode: forwards;
18
- animation-iteration-count: 1;
19
- }
20
-
21
- /* Opening animations based on placement - ONLY when animations are enabled */
22
- [data-kbt-id='popover'][data-kbt-closing='false']:not(
23
- [data-kbt-disable-animations='true']
24
- ) {
25
- --animation-prefix: 'popover-enter-';
26
- }
27
-
28
- [data-kbt-id='popover'][data-kbt-placement='center'][data-kbt-closing='false']:not(
29
- [data-kbt-disable-animations='true']
30
- ) {
31
- animation-name: popover-enter-center;
32
- }
33
-
34
- [data-kbt-id='popover'][data-kbt-placement^='top'][data-kbt-closing='false']:not(
35
- [data-kbt-disable-animations='true']
36
- ) {
37
- animation-name: var(--animation-name, popover-enter-top);
38
- }
39
-
40
- [data-kbt-id='popover'][data-kbt-placement='top-start'][data-kbt-closing='false']:not(
41
- [data-kbt-disable-animations='true']
42
- ) {
43
- animation-name: popover-enter-top-start;
44
- }
45
-
46
- [data-kbt-id='popover'][data-kbt-placement='top-end'][data-kbt-closing='false']:not(
47
- [data-kbt-disable-animations='true']
48
- ) {
49
- animation-name: popover-enter-top-end;
50
- }
51
-
52
- [data-kbt-id='popover'][data-kbt-placement^='bottom'][data-kbt-closing='false']:not(
53
- [data-kbt-disable-animations='true']
54
- ) {
55
- animation-name: var(--animation-name, popover-enter-bottom);
56
- }
57
-
58
- [data-kbt-id='popover'][data-kbt-placement='bottom-start'][data-kbt-closing='false']:not(
59
- [data-kbt-disable-animations='true']
60
- ) {
61
- animation-name: popover-enter-bottom-start;
62
- }
63
-
64
- [data-kbt-id='popover'][data-kbt-placement='bottom-end'][data-kbt-closing='false']:not(
65
- [data-kbt-disable-animations='true']
66
- ) {
67
- animation-name: popover-enter-bottom-end;
68
- }
69
-
70
- [data-kbt-id='popover'][data-kbt-placement^='left'][data-kbt-closing='false']:not(
71
- [data-kbt-disable-animations='true']
72
- ) {
73
- animation-name: var(--animation-name, popover-enter-left);
74
- }
75
-
76
- [data-kbt-id='popover'][data-kbt-placement='left-start'][data-kbt-closing='false']:not(
77
- [data-kbt-disable-animations='true']
78
- ) {
79
- animation-name: popover-enter-left-start;
80
- }
81
-
82
- [data-kbt-id='popover'][data-kbt-placement='left-end'][data-kbt-closing='false']:not(
83
- [data-kbt-disable-animations='true']
84
- ) {
85
- animation-name: popover-enter-left-end;
86
- }
87
-
88
- [data-kbt-id='popover'][data-kbt-placement^='right'][data-kbt-closing='false']:not(
89
- [data-kbt-disable-animations='true']
90
- ) {
91
- animation-name: var(--animation-name, popover-enter-right);
92
- }
93
-
94
- [data-kbt-id='popover'][data-kbt-placement='right-start'][data-kbt-closing='false']:not(
95
- [data-kbt-disable-animations='true']
96
- ) {
97
- animation-name: popover-enter-right-start;
98
- }
99
-
100
- [data-kbt-id='popover'][data-kbt-placement='right-end'][data-kbt-closing='false']:not(
101
- [data-kbt-disable-animations='true']
102
- ) {
103
- animation-name: popover-enter-right-end;
104
- }
105
-
106
- /* Closing animations based on placement - ONLY when animations are enabled */
107
- [data-kbt-id='popover'][data-kbt-closing='true']:not(
108
- [data-kbt-disable-animations='true']
109
- ) {
110
- --animation-prefix: 'popover-exit-';
111
- }
112
-
113
- [data-kbt-id='popover'][data-kbt-placement='center'][data-kbt-closing='true']:not(
114
- [data-kbt-disable-animations='true']
115
- ) {
116
- animation-name: popover-exit-center;
117
- }
118
-
119
- [data-kbt-id='popover'][data-kbt-placement^='top'][data-kbt-closing='true']:not(
120
- [data-kbt-disable-animations='true']
121
- ) {
122
- animation-name: var(--exit-animation-name, popover-exit-top);
123
- }
124
-
125
- [data-kbt-id='popover'][data-kbt-placement='top-start'][data-kbt-closing='true']:not(
126
- [data-kbt-disable-animations='true']
127
- ) {
128
- animation-name: popover-exit-top-start;
129
- }
130
-
131
- [data-kbt-id='popover'][data-kbt-placement='top-end'][data-kbt-closing='true']:not(
132
- [data-kbt-disable-animations='true']
133
- ) {
134
- animation-name: popover-exit-top-end;
135
- }
136
-
137
- [data-kbt-id='popover'][data-kbt-placement^='bottom'][data-kbt-closing='true']:not(
138
- [data-kbt-disable-animations='true']
139
- ) {
140
- animation-name: var(--exit-animation-name, popover-exit-bottom);
141
- }
142
-
143
- [data-kbt-id='popover'][data-kbt-placement='bottom-start'][data-kbt-closing='true']:not(
144
- [data-kbt-disable-animations='true']
145
- ) {
146
- animation-name: popover-exit-bottom-start;
147
- }
148
-
149
- [data-kbt-id='popover'][data-kbt-placement='bottom-end'][data-kbt-closing='true']:not(
150
- [data-kbt-disable-animations='true']
151
- ) {
152
- animation-name: popover-exit-bottom-end;
153
- }
154
-
155
- [data-kbt-id='popover'][data-kbt-placement^='left'][data-kbt-closing='true']:not(
156
- [data-kbt-disable-animations='true']
157
- ) {
158
- animation-name: var(--exit-animation-name, popover-exit-left);
159
- }
160
-
161
- [data-kbt-id='popover'][data-kbt-placement='left-start'][data-kbt-closing='true']:not(
162
- [data-kbt-disable-animations='true']
163
- ) {
164
- animation-name: popover-exit-left-start;
165
- }
166
-
167
- [data-kbt-id='popover'][data-kbt-placement='left-end'][data-kbt-closing='true']:not(
168
- [data-kbt-disable-animations='true']
169
- ) {
170
- animation-name: popover-exit-left-end;
171
- }
172
-
173
- [data-kbt-id='popover'][data-kbt-placement^='right'][data-kbt-closing='true']:not(
174
- [data-kbt-disable-animations='true']
175
- ) {
176
- animation-name: var(--exit-animation-name, popover-exit-right);
177
- }
178
-
179
- [data-kbt-id='popover'][data-kbt-placement='right-start'][data-kbt-closing='true']:not(
180
- [data-kbt-disable-animations='true']
181
- ) {
182
- animation-name: popover-exit-right-start;
183
- }
184
-
185
- [data-kbt-id='popover'][data-kbt-placement='right-end'][data-kbt-closing='true']:not(
186
- [data-kbt-disable-animations='true']
187
- ) {
188
- animation-name: popover-exit-right-end;
189
- }
1
+ @import "./keyframes.css";[data-kbt-id=popover][data-kbt-placement]{animation-duration:.5s;animation-fill-mode:forwards;animation-iteration-count:1;animation-timing-function:cubic-bezier(.16,1,.3,1)}[data-kbt-id=popover][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){--animation-prefix:"popover-enter-"}[data-kbt-id=popover][data-kbt-placement=center][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-center}[data-kbt-id=popover][data-kbt-placement^=top][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:var(--animation-name,popover-enter-top)}[data-kbt-id=popover][data-kbt-placement=top-start][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-top-start}[data-kbt-id=popover][data-kbt-placement=top-end][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-top-end}[data-kbt-id=popover][data-kbt-placement^=bottom][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:var(--animation-name,popover-enter-bottom)}[data-kbt-id=popover][data-kbt-placement=bottom-start][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-bottom-start}[data-kbt-id=popover][data-kbt-placement=bottom-end][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-bottom-end}[data-kbt-id=popover][data-kbt-placement^=left][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:var(--animation-name,popover-enter-left)}[data-kbt-id=popover][data-kbt-placement=left-start][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-left-start}[data-kbt-id=popover][data-kbt-placement=left-end][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-left-end}[data-kbt-id=popover][data-kbt-placement^=right][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:var(--animation-name,popover-enter-right)}[data-kbt-id=popover][data-kbt-placement=right-start][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-right-start}[data-kbt-id=popover][data-kbt-placement=right-end][data-kbt-closing=false]:not([data-kbt-disable-animations=true]){animation-name:popover-enter-right-end}[data-kbt-id=popover][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){--animation-prefix:"popover-exit-"}[data-kbt-id=popover][data-kbt-placement=center][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-center}[data-kbt-id=popover][data-kbt-placement^=top][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:var(--exit-animation-name,popover-exit-top)}[data-kbt-id=popover][data-kbt-placement=top-start][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-top-start}[data-kbt-id=popover][data-kbt-placement=top-end][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-top-end}[data-kbt-id=popover][data-kbt-placement^=bottom][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:var(--exit-animation-name,popover-exit-bottom)}[data-kbt-id=popover][data-kbt-placement=bottom-start][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-bottom-start}[data-kbt-id=popover][data-kbt-placement=bottom-end][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-bottom-end}[data-kbt-id=popover][data-kbt-placement^=left][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:var(--exit-animation-name,popover-exit-left)}[data-kbt-id=popover][data-kbt-placement=left-start][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-left-start}[data-kbt-id=popover][data-kbt-placement=left-end][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-left-end}[data-kbt-id=popover][data-kbt-placement^=right][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:var(--exit-animation-name,popover-exit-right)}[data-kbt-id=popover][data-kbt-placement=right-start][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-right-start}[data-kbt-id=popover][data-kbt-placement=right-end][data-kbt-closing=true]:not([data-kbt-disable-animations=true]){animation-name:popover-exit-right-end}
@@ -1,20 +1 @@
1
- @keyframes breatheAnimation {
2
- from {
3
- background-position-x: 0%;
4
- }
5
-
6
- to {
7
- background-position-x: -200%;
8
- }
9
- }
10
-
11
- .kbt-skeleton {
12
- width: var(--skeleton-width, 100%);
13
- height: var(--skeleton-height, 20px);
14
- animation-name: breatheAnimation;
15
- animation-timing-function: linear;
16
- animation-iteration-count: infinite;
17
- animation-duration: var(--skeleton-duration, 2s);
18
- animation-delay: 1ms;
19
- background-size: 200% 100%;
20
- }
1
+ @keyframes breatheAnimation{0%{background-position-x:0}to{background-position-x:-200%}}.kbt-skeleton{animation-delay:1ms;animation-duration:var(--skeleton-duration,2s);animation-iteration-count:infinite;animation-name:breatheAnimation;animation-timing-function:linear;background-size:200% 100%;height:var(--skeleton-height,20px);width:var(--skeleton-width,100%)}
@@ -1,7 +1 @@
1
- .scrollablecontainer-max-height {
2
- max-height: 200px;
3
- }
4
-
5
- .container-over-width {
6
- width: 120% !important;
7
- }
1
+ .scrollablecontainer-max-height{max-height:200px}.container-over-width{width:120%!important}
@@ -1,14 +1 @@
1
- .kbt-text {
2
- -webkit-text-size-adjust: 100%;
3
- text-size-adjust: 100%;
4
- }
5
-
6
- .kbt-text--disabled {
7
- pointer-events: none;
8
- }
9
-
10
- .kbt-text--truncate {
11
- white-space: nowrap;
12
- overflow: hidden;
13
- text-overflow: ellipsis;
14
- }
1
+ .kbt-text{-webkit-text-size-adjust:100%;text-size-adjust:100%}.kbt-text--disabled{pointer-events:none}.kbt-text--truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@floating-ui/dom"),t=require("react"),o=require("../../../lib/hooks/useClassName/useClassName.js"),r=require("../../../lib/hooks/useClickOutside/useClickOutside.js"),s=require("../../../lib/hooks/useEscPressed/useEscPressed.js"),i=require("../../../lib/hooks/useMediaDevice/useActiveBreakpoints.js"),l=require("../../../lib/types/breakpoints/breakpoints.js"),n=require("../../../lib/types/positions/positions.js"),a=require("../../../lib/utils/focusHandlers/focusHandlers.js"),u=require("../positioning/computePosition.js");exports.useTooltip=({align:c=n.POSITIONS.TOP,...p})=>{const{device:d,isDesktop:f,isTablet:O}=i.useActiveBreakpoints(),m=f||O,b=t.useRef(null),P=t.useRef(!0),y=t.useRef(!1),[T,E]=t.useState(!1),[R,S]=t.useState(c),v=o.useClassName({additionalClassNames:p.additionalClasses,component:"TOOLTIP",variant:p.variant}),g=async()=>{if(!p.labelRef.current||!p.tooltipRef.current)return;const t=p.tooltipRef.current.lastElementChild;try{const o=await u.computePosition(p.labelRef.current,p.tooltipRef.current,{middleware:[e.flip(),e.shift({padding:4}),e.arrow({element:t})],placement:c,strategy:"absolute"}),{middlewareData:r,placement:s,x:i,y:a}=o;S(s),Object.assign(p.tooltipRef.current.style,{left:`${i}px`,top:`${a}px`});const{x:d,y:f}=r.arrow,O={bottom:n.POSITIONS.TOP,left:n.POSITIONS.RIGHT,right:n.POSITIONS.LEFT,top:n.POSITIONS.BOTTOM}[R.split("-")[0]],m={bottom:"",left:null!==d?`${d}px`:"",right:"",[O]:`calc(${v.tooltipexternalcontainer?.[l.DEVICE_BREAKPOINTS.DESKTOP]?.padding??0} - ${v.arrowposition?.[l.DEVICE_BREAKPOINTS.DESKTOP]?.top??"0px"} / 2)`,top:null!==f?`${f}px`:""};t&&t.style&&(t.style.removeProperty("left"),t.style.removeProperty("top"),t.style.removeProperty("right"),t.style.removeProperty("bottom"),Object.assign(t?.style,m))}catch(o){}},w=e=>{p.tooltipRef.current?.contains(e.target)||g()};t.useEffect(()=>{const e=()=>{g()};return window.addEventListener("scroll",w,!0),window.addEventListener("resize",e),()=>{window.removeEventListener("scroll",w,!0),window.removeEventListener("resize",e)}},[]);const C=t.useCallback(()=>{if(y.current){if(y.current=!1,P.current=!1,p.tooltipAsModal&&b.current?.focus({preventScroll:!0}),P.current=!0,m){if(!p.tooltipRef.current)return;p.tooltipRef.current.style.display="none"}E(!1),p.onOpenClose?.(!1)}},[d,p.onOpenClose,p.tooltipAsModal]),I=t.useCallback(e=>{y.current&&(e.stopPropagation(),C())},[C]);return s.useEscPressed({disableStopPropagation:!0,onEscPress:I,ref:p.labelRef}),r.useClickOutside(p.tooltipRef,C,[p.labelRef.current]),{allowFocusOpenTooltip:P,hideTooltip:C,open:T,placement:R,showTooltip:()=>{if(!y.current){if(y.current=!0,b.current=document.activeElement,m){if(!p.tooltipRef.current)return;p.tooltipRef.current.style.display="flex",g(),a.focusElementOrFirstDescendant(p.tooltipRef.current,{preventScroll:!0})}E(!0),p.onOpenClose?.(!0)}}}};
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@floating-ui/dom"),t=require("react"),o=require("../../../lib/hooks/useClassName/useClassName.js"),r=require("../../../lib/hooks/useClickOutside/useClickOutside.js"),s=require("../../../lib/hooks/useEscPressed/useEscPressed.js"),i=require("../../../lib/hooks/useMediaDevice/useActiveBreakpoints.js"),l=require("../../../lib/types/breakpoints/breakpoints.js"),n=require("../../../lib/types/positions/positions.js"),u=require("../../../lib/utils/focusHandlers/focusHandlers.js"),a=require("../positioning/computePosition.js");exports.useTooltip=({align:c=n.POSITIONS.TOP,...p})=>{const{device:f,isDesktop:d,isTablet:O}=i.useActiveBreakpoints(),m=d||O,y=t.useRef(null),b=t.useRef(!0),P=t.useRef(!1),[R,T]=t.useState(!1),[E,S]=t.useState(c),v=o.useClassName({additionalClassNames:p.additionalClasses,component:"TOOLTIP",variant:p.variant}),g=async()=>{if(!p.labelRef.current||!p.tooltipRef.current)return;const t=p.tooltipRef.current.lastElementChild;try{const o=await a.computePosition(p.labelRef.current,p.tooltipRef.current,{middleware:[e.flip(),e.shift({padding:4}),e.arrow({element:t})],placement:c,strategy:"absolute"}),{middlewareData:r,placement:s,x:i,y:u}=o;S(s),p.tooltipRef.current?.style&&Object.assign(p.tooltipRef.current.style,{left:`${i}px`,top:`${u}px`});const{x:f,y:d}=r.arrow,O={bottom:n.POSITIONS.TOP,left:n.POSITIONS.RIGHT,right:n.POSITIONS.LEFT,top:n.POSITIONS.BOTTOM}[E.split("-")[0]],m={bottom:"",left:null!==f?`${f}px`:"",right:"",[O]:`calc(${v.tooltipexternalcontainer?.[l.DEVICE_BREAKPOINTS.DESKTOP]?.padding??0} - ${v.arrowposition?.[l.DEVICE_BREAKPOINTS.DESKTOP]?.top??"0px"} / 2)`,top:null!==d?`${d}px`:""};t&&t.style&&(t.style.removeProperty("left"),t.style.removeProperty("top"),t.style.removeProperty("right"),t.style.removeProperty("bottom"),Object.assign(t?.style,m))}catch(o){}},w=e=>{p.tooltipRef.current?.contains(e.target)||g()};t.useEffect(()=>{const e=()=>{g()};return window.addEventListener("scroll",w,!0),window.addEventListener("resize",e),()=>{window.removeEventListener("scroll",w,!0),window.removeEventListener("resize",e)}},[]);const C=t.useCallback(()=>{if(P.current){if(P.current=!1,b.current=!1,p.tooltipAsModal&&y.current?.focus({preventScroll:!0}),b.current=!0,m){if(!p.tooltipRef.current)return;p.tooltipRef.current.style&&(p.tooltipRef.current.style.display="none")}T(!1),p.onOpenClose?.(!1)}},[f,p.onOpenClose,p.tooltipAsModal]),I=t.useCallback(e=>{P.current&&(e.stopPropagation(),C())},[C]);return s.useEscPressed({disableStopPropagation:!0,onEscPress:I,ref:p.labelRef}),r.useClickOutside(p.tooltipRef,C,[p.labelRef.current]),{allowFocusOpenTooltip:b,hideTooltip:C,open:R,placement:E,showTooltip:()=>{if(!P.current){if(P.current=!0,y.current=document.activeElement,m){if(!p.tooltipRef.current)return;p.tooltipRef.current.style&&(p.tooltipRef.current.style.display="flex"),g(),u.focusElementOrFirstDescendant(p.tooltipRef.current,{preventScroll:!0})}T(!0),p.onOpenClose?.(!0)}}}};
@@ -1,69 +1 @@
1
- .kbt-tooltip {
2
- display: inline-block;
3
- }
4
-
5
- .kbt-tooltip__trigger-wrapper {
6
- display: flex;
7
- align-items: center;
8
- justify-content: center;
9
- padding: 0;
10
- border: none;
11
- background: none;
12
- min-height: 1.5rem;
13
- min-width: 1.5rem;
14
- }
15
-
16
- .kbt-tooltip__external-container {
17
- display: flex;
18
- }
19
-
20
- .kbt-tooltip__header-content {
21
- display: flex;
22
- align-items: flex-start;
23
- }
24
-
25
- .kbt-tooltip__close-icon {
26
- display: flex;
27
- justify-content: flex-end;
28
- align-self: flex-end;
29
- }
30
-
31
- .kbt-tooltip__title {
32
- word-break: break-word;
33
- }
34
-
35
- .kbt-tooltip__paragraph {
36
- word-break: break-word;
37
- }
38
-
39
- .kbt-tooltip__inner-content {
40
- overflow-y: auto;
41
- }
42
-
43
- .kbt-tooltip__arrow {
44
- position: absolute;
45
- }
46
-
47
- .kbt-tooltip__arrow--top {
48
- bottom: 100%;
49
- left: 50%;
50
- transform: translateX(-50%);
51
- }
52
-
53
- .kbt-tooltip__arrow--right {
54
- top: 50%;
55
- left: 100%;
56
- transform: translateY(-50%);
57
- }
58
-
59
- .kbt-tooltip__arrow--bottom {
60
- top: 100%;
61
- left: 50%;
62
- transform: translateX(-50%);
63
- }
64
-
65
- .kbt-tooltip__arrow--left {
66
- top: 50%;
67
- right: 100%;
68
- transform: translateY(-50%);
69
- }
1
+ .kbt-tooltip{display:inline-block}.kbt-tooltip__trigger-wrapper{align-items:center;background:none;border:none;display:flex;justify-content:center;min-height:1.5rem;min-width:1.5rem;padding:0}.kbt-tooltip__external-container{display:flex}.kbt-tooltip__header-content{align-items:flex-start;display:flex}.kbt-tooltip__close-icon{align-self:flex-end;display:flex;justify-content:flex-end}.kbt-tooltip__paragraph,.kbt-tooltip__title{word-break:break-word}.kbt-tooltip__inner-content{overflow-y:auto}.kbt-tooltip__arrow{position:absolute}.kbt-tooltip__arrow--top{bottom:100%;left:50%;transform:translateX(-50%)}.kbt-tooltip__arrow--right{left:100%;top:50%;transform:translateY(-50%)}.kbt-tooltip__arrow--bottom{left:50%;top:100%;transform:translateX(-50%)}.kbt-tooltip__arrow--left{right:100%;top:50%;transform:translateY(-50%)}
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../_virtual/jsx-runtime.js"),r=require("react").forwardRef(({children:r,className:t,component:s,...o},n)=>{const a=s||"span";return e.jsxRuntimeExports.jsx(a,{ref:n,className:t,...o,children:r})});exports.CustomComponent=r;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../_virtual/jsx-runtime.js"),s=require("react").forwardRef(({children:s,className:r,component:t,...o},n)=>{const i=t||"span",c=["middlewareOptions","pressEscapeClose","onSelectItem","ariaDisabled","focus","index"],a="string"==typeof i?Object.keys(o).reduce((e,s)=>(c.includes(s)||(e[s]=o[s]),e),{}):o;return e.jsxRuntimeExports.jsx(i,{ref:n,className:r,...a,children:s})});exports.CustomComponent=s;
@@ -1 +1 @@
1
- import{cssThemes as e,cssClasses as t,cssVars as s,cssAvailableComponents as i,cssGlobalStyles as n,cssMediaQueries as h}from"./stats/stats";export class Provider{#e;#t;#s;#i;#n;#h;#r;#l;#m;#o=(e,t)=>{if("undefined"==typeof document)return;let s=document.getElementById(t);s||(s=document.createElement("link"),s.id=t,s.rel="stylesheet",document.head.appendChild(s)),s.href=e};#a=e=>{const{css:t,foreign:s}=e,i=s?.before||[],n=s?.after||[];i.forEach((e,t)=>{const s=`${this.#l}-foreign-before-${t+1}`;this.#o(e,s)}),this.#o(t,this.#l),n.forEach((e,t)=>{const s=`${this.#l}-foreign-after-${t+1}`;this.#o(e,s)})};#c=()=>{"undefined"!=typeof document&&document.querySelectorAll(`link[id^="${this.#l}"]`).forEach(e=>e.remove())};constructor({linkId:r,jsInCss:l}={}){this.#t=e,this.#s=s,this.#i=t,this.#n=i,this.#h=n,this.#r=h,this.#l=r||"kb-styled-link",this.#e=Object.keys(e)[0],this.#m=!!l,this.getComponentStyles=this.getComponentStyles.bind(this),"undefined"!=typeof window&&"undefined"!=typeof document&&this.#m&&(this.#c(),this.#a(this.#t[this.#e]))}get themeSelected(){return this.#e}set themeSelected(e){if(!(e in this.#t))throw new Error(`${e} is not exists`);this.#m&&(this.#c(),this.#a(this.#t[e])),this.#e=e}get allThemesNames(){return Object.keys(this.#t)}get allThemes(){return this.#t}get variables(){return this.#s[this.#e]}get classNames(){return this.#i[this.#e]}get components(){return this.#n[this.#e]}get globalStyles(){return this.#h[this.#e]}get mediaQueries(){return this.#r[this.#e]}getComponentStyles({variant:e,component:t,additionalClassNames:s}){const i=this.#i[this.#e][t.toLocaleUpperCase()];if(!i)return{};const n={},h=!!e&&`$_${e.toLocaleLowerCase().replace(/-/g,"_")}`;if(h&&h in i){const e=i[h];Object.entries(e).forEach(([e,t])=>{e in n||(n[e]=t)})}return Object.entries(i).forEach(([e,t])=>{e.startsWith("$_")||e in n||(n[e]=t)}),s&&Object.keys(s).length&&Object.entries(s).forEach(([e,t])=>{e in n||(n[e]=""),n[e]+=` ${t}`}),n}}
1
+ import{cssThemes as e,cssClasses as t,cssVars as s,cssAvailableComponents as i,cssGlobalStyles as n,cssMediaQueries as h}from"./stats/stats";export class Provider{#e;#t;#s;#i;#n;#h;#r;#o;#a;#c=(e,t)=>{if("undefined"==typeof document)return;let s=document.getElementById(t);s||(s=document.createElement("link"),s.id=t,s.rel="stylesheet",document.head.appendChild(s)),s.href=e};#l=e=>{const{css:t,foreign:s}=e,i=s?.before||[],n=s?.after||[];i.forEach((e,t)=>{const s=`${this.#o}-foreign-before-${t+1}`;this.#c(e,s)}),this.#c(t,this.#o),n.forEach((e,t)=>{const s=`${this.#o}-foreign-after-${t+1}`;this.#c(e,s)})};#d=()=>{"undefined"!=typeof document&&document.querySelectorAll(`link[id^="${this.#o}"]`).forEach(e=>e.remove())};constructor({linkId:r,jsInCss:o}={}){this.#t=e,this.#s=s,this.#i=t,this.#n=i,this.#h=n,this.#r=h,this.#o=r||"kb-styled-link",this.#e=Object.keys(e)[0],this.#a=!!o,this.getComponentStyles=this.getComponentStyles.bind(this),"undefined"!=typeof window&&"undefined"!=typeof document&&this.#a&&(this.#d(),this.#l(this.#t[this.#e]))}get themeSelected(){return this.#e}set themeSelected(e){if(!(e in this.#t))throw new Error(`${e} is not exists`);this.#a&&(this.#d(),this.#l(this.#t[e])),this.#e=e}get allThemesNames(){return Object.keys(this.#t)}get allThemes(){return this.#t}get variables(){return this.#s[this.#e]}get classNames(){return this.#i[this.#e]}get components(){return this.#n[this.#e]}get globalStyles(){return this.#h[this.#e]}get mediaQueries(){return this.#r[this.#e]}getComponentStyles({variant:e,component:t,additionalClassNames:s}){const i=this.#i[this.#e][t.toLocaleUpperCase()];if(!i)return{};const n={},h=!!e&&`$_${e.toLocaleLowerCase().replace(/-/g,"_")}`;if(h&&h in i){const e=i[h];Object.entries(e).forEach(([e,t])=>{e in n||(n[e]=t)})}return Object.entries(i).forEach(([e,t])=>{e.startsWith("$_")||e in n||(n[e]=t)}),s&&Object.keys(s).length&&Object.entries(s).forEach(([e,t])=>{e in n||(n[e]=""),n[e]+=` ${t}`}),n}}