woby-tooltip 1.0.3 → 1.0.5
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.
- package/dist/index.es.js +15 -12
- package/dist/index.es.js.map +1 -1
- package/dist/output.css +23 -4
- package/dist/style.css +23 -4
- package/dist/types/Arrow.d.ts +1 -0
- package/dist/types/Arrow.d.ts.map +1 -0
- package/dist/types/AutoTooltip.d.ts +7 -0
- package/dist/types/AutoTooltip.d.ts.map +1 -0
- package/dist/types/TextBox.d.ts +1 -0
- package/dist/types/TextBox.d.ts.map +1 -0
- package/dist/types/Tooltip.d.ts +2 -0
- package/dist/types/Tooltip.d.ts.map +1 -0
- package/dist/types/assets/arrow-down.d.ts +4 -0
- package/dist/types/assets/arrow-down.d.ts.map +1 -0
- package/dist/types/assets/arrow-up.d.ts +4 -0
- package/dist/types/assets/arrow-up.d.ts.map +1 -0
- package/dist/types/assets/logo.d.ts +4 -0
- package/dist/types/assets/logo.d.ts.map +1 -0
- package/dist/types/index.d.ts +2 -0
- package/dist/types/index.d.ts.map +1 -0
- package/package.json +19 -12
- package/tailwind.config.js +11 -11
- package/tsconfig.json +61 -59
- package/tsconfig.web.json +61 -0
- package/{vite.config.ts → vite.config.mts} +40 -40
- package/{vite.config.web.ts → vite.config.web.mts} +7 -5
- package/dist/index.cjs.js +0 -406
- package/dist/index.cjs.js.map +0 -1
- package/dist/index.umd.js +0 -408
- package/dist/index.umd.js.map +0 -1
package/dist/index.es.js
CHANGED
@@ -1,5 +1,5 @@
|
|
1
|
-
import { jsxs, jsx } from "woby/jsx-runtime";
|
2
|
-
import { $$, $, store, useMemo,
|
1
|
+
import { jsxs, jsx as jsx$1 } from "woby/jsx-runtime";
|
2
|
+
import { $$, $, store, useMemo, jsx, useEffect, isObservable } from "woby";
|
3
3
|
const isSide = (side, str) => $$(side) === str;
|
4
4
|
const isAlign = (align, str) => $$(align) === str;
|
5
5
|
const isAlignA = (position, str) => $$(position) === str;
|
@@ -70,7 +70,7 @@ const TextBox = (props) => {
|
|
70
70
|
// style,
|
71
71
|
onMouseOver: () => onSpanHover(index, lastIndex, numberChildren)
|
72
72
|
};
|
73
|
-
return
|
73
|
+
return jsx(child, { ...childProps });
|
74
74
|
});
|
75
75
|
const calcHPos = (align, left2, center, right2) => {
|
76
76
|
return isAlign(align, "center") ? center : isAlign(align, "left") ? left2 : right2;
|
@@ -164,7 +164,7 @@ const TextBox = (props) => {
|
|
164
164
|
padding: `${move.down}px ${move.left}px ${move.up}px ${move.right}px`
|
165
165
|
},
|
166
166
|
children: [
|
167
|
-
/* @__PURE__ */ jsx(
|
167
|
+
/* @__PURE__ */ jsx$1(
|
168
168
|
"div",
|
169
169
|
{
|
170
170
|
class: [`absolute animation-none w-full h-full z-0`, borderRadius],
|
@@ -175,12 +175,12 @@ const TextBox = (props) => {
|
|
175
175
|
}
|
176
176
|
}
|
177
177
|
),
|
178
|
-
/* @__PURE__ */ jsx(
|
178
|
+
/* @__PURE__ */ jsx$1(
|
179
179
|
"div",
|
180
180
|
{
|
181
181
|
class: [`relative z-[2] w-full`, backgroundColor, borderRadius],
|
182
182
|
onMouseLeave: unsetHover,
|
183
|
-
children: /* @__PURE__ */ jsx(
|
183
|
+
children: /* @__PURE__ */ jsx$1(
|
184
184
|
"div",
|
185
185
|
{
|
186
186
|
class: [!tpStatic ? "[&_span]:cursor-pointer w-full" : null, borderRadius, "overflow-hidden"],
|
@@ -196,9 +196,8 @@ const TextBox = (props) => {
|
|
196
196
|
const Arrow = ({ isHovered, hovBkg, bkgCol, flat }) => {
|
197
197
|
const backgroundColor = useMemo(() => $$(isHovered) ? $$(hovBkg) : $$(bkgCol));
|
198
198
|
const boxShadow = useMemo(() => $$(flat) ? null : "[box-shadow:rgba(0,0,0,0.18)0px_0px_0px_1px]");
|
199
|
-
return /* @__PURE__ */ jsx("div", { class: [`rotate-45 w-[14px] h-[14px] m-[3px] z-[1]`, backgroundColor, boxShadow] });
|
199
|
+
return /* @__PURE__ */ jsx$1("div", { class: [`rotate-45 w-[14px] h-[14px] m-[3px] z-[1]`, backgroundColor, boxShadow] });
|
200
200
|
};
|
201
|
-
const output = "";
|
202
201
|
const Tooltip = (properties = {}) => {
|
203
202
|
const props = {
|
204
203
|
/** tailwind */
|
@@ -361,7 +360,7 @@ const Tooltip = (properties = {}) => {
|
|
361
360
|
animation: () => $$(show) ? `rpt-${$$(animation)} 0.2s` : `rpt-${$$(animation)}-out 0.15s`
|
362
361
|
};
|
363
362
|
const e = useMemo(
|
364
|
-
() => !$$(animation) && $$(show) && $$(props.children) || $$(show) && $$(mount) && $$(props.children) ? /* @__PURE__ */ jsx(
|
363
|
+
() => !$$(animation) && $$(show) && $$(props.children) || $$(show) && $$(mount) && $$(props.children) ? /* @__PURE__ */ jsx$1(
|
365
364
|
"div",
|
366
365
|
{
|
367
366
|
className: classes,
|
@@ -371,7 +370,7 @@ const Tooltip = (properties = {}) => {
|
|
371
370
|
mount(false);
|
372
371
|
},
|
373
372
|
children: /* @__PURE__ */ jsxs("div", { class: "flex justify-center", children: [
|
374
|
-
/* @__PURE__ */ jsx(
|
373
|
+
/* @__PURE__ */ jsx$1(
|
375
374
|
Arrow,
|
376
375
|
{
|
377
376
|
isHovered: hoverArrow,
|
@@ -380,7 +379,7 @@ const Tooltip = (properties = {}) => {
|
|
380
379
|
flat
|
381
380
|
}
|
382
381
|
),
|
383
|
-
/* @__PURE__ */ jsx(
|
382
|
+
/* @__PURE__ */ jsx$1(
|
384
383
|
TextBox,
|
385
384
|
{
|
386
385
|
...props,
|
@@ -401,6 +400,10 @@ const Tooltip = (properties = {}) => {
|
|
401
400
|
] }) : e);
|
402
401
|
};
|
403
402
|
export {
|
404
|
-
|
403
|
+
TextBox,
|
404
|
+
Tooltip,
|
405
|
+
isAlign,
|
406
|
+
isAlignA,
|
407
|
+
isSide
|
405
408
|
};
|
406
409
|
//# sourceMappingURL=index.es.js.map
|
package/dist/index.es.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.es.js","sources":["../src/lib/TextBox.tsx","../src/lib/Arrow.tsx","../src/lib/Tooltip.tsx"],"sourcesContent":["import { $, $$, useEffect, cloneElement, Child, useMemo, Observable, ObservableMaybe, jsx, getMeta, store, type JSX } from 'woby'\r\n\r\n\r\ntype _Align = 'start' | 'end' | 'center' | 'bottom' | 'top' | 'right' | 'left'\r\nexport type Align = _Align | `v-${_Align}` | `h-${_Align}`\r\nexport type Side = 'bottom' | 'top' | 'left' | 'right'\r\n\r\nexport const isSide = (side: ObservableMaybe<Side>, str: Side) => $$(side) === str\r\nexport const isAlign = (align: ObservableMaybe<Align>, str: Align) => $$(align) === str\r\nexport const isAlignA = (position, str: string) => $$(position) === str\r\n\r\ntype TextboxType = {\r\n // lineSeparated?: boolean | string, position?: string,\r\n // /** tailwind */\r\n hoverBackground?: ObservableMaybe<string>, backgroundColor?: ObservableMaybe<string>, arrowAlign?: ObservableMaybe<Align>,\r\n moveDown?: ObservableMaybe<string>, moveRight?: ObservableMaybe<string>, moveLeft?: ObservableMaybe<string>,\r\n // moveUp?: string, textAlign?: string, fontFamily?: string, fontWeight?: string, fontSize?: string,\r\n // /** tailwind */\r\n color?: ObservableMaybe<string>, animation?: ObservableMaybe<string>, zIndex?: ObservableMaybe<string>, flat?: ObservableMaybe<boolean>, show?: ObservableMaybe<boolean>,\r\n hoverColor?: ObservableMaybe<string>,\r\n /** no tailwind */\r\n textboxWidth?: ObservableMaybe<string>,\r\n /** no tailwind */\r\n padding?: ObservableMaybe<string>,\r\n /** tailwind */\r\n borderRadius?: ObservableMaybe<string>, shadowColor?: ObservableMaybe<string>, shadowShape?: ObservableMaybe<string>,\r\n static?: ObservableMaybe<boolean>, alert?: ObservableMaybe<string>,\r\n\r\n hoverArrow: Observable<boolean>\r\n\r\n arw: ObservableMaybe<Align>,\r\n pos: {\r\n side: ObservableMaybe<Side>\r\n align: ObservableMaybe<Align>\r\n },\r\n /** tailwind border-b-*/\r\n lines: ObservableMaybe<string>,\r\n move: {\r\n down: number\r\n up: number\r\n left: number\r\n right: number\r\n },\r\n children?: Child\r\n}\r\n\r\n\r\nexport const TextBox = (props: TextboxType & JSX.HTMLAttributes<HTMLDivElement>): JSX.Element => {\r\n const hoverIndex = $<number>(null)\r\n const firstH = $<number>(null)\r\n const lastH = $<number>(null)\r\n const totH = $<number>(null)\r\n\r\n const spanHeightsRef = store({})\r\n\r\n store.on(spanHeightsRef, () => {\r\n const heights = Object.keys(spanHeightsRef)\r\n .map(key => spanHeightsRef[key].clientHeight)\r\n const firsth = heights[0]\r\n const lasth = heights[heights.length - 1]\r\n const toth = heights.reduce((accumulator, currentValue) => accumulator + currentValue, 0)\r\n totH(toth)\r\n firstH(firsth)\r\n lastH(lasth)\r\n })\r\n\r\n const unsetHover = () => {\r\n hoverIndex(null)\r\n props.hoverArrow(false)\r\n }\r\n\r\n // Set & unset hover state\r\n const onSpanHover = (index: number, lastIndex: number, numChildren: number) => {\r\n hoverIndex(index)\r\n const { static: rctStatic, arw: arrow, pos: position, hoverArrow } = props\r\n if (!rctStatic &&\r\n ((index === 0 && (isSide(position.side, 'bottom') || isAlignA(arrow, 'v-start'))) ||\r\n (index === lastIndex && (isSide(position.side, 'top') || isAlignA(arrow, 'v-end'))) ||\r\n numChildren === 1)) {\r\n return hoverArrow(true)\r\n }\r\n return hoverArrow(false)\r\n }\r\n\r\n const {\r\n arw: arrow,\r\n pos: position,\r\n lines: lineSeparated,\r\n static: tpStatic,\r\n textboxWidth: width,\r\n shadowColor: shCol,\r\n shadowShape: shShape,\r\n move,\r\n backgroundColor,\r\n padding,\r\n borderRadius,\r\n hoverBackground,\r\n hoverColor,\r\n color,\r\n alert,\r\n flat,\r\n children,\r\n class: cls, className\r\n } = props\r\n\r\n const numberChildren = Array.isArray(children) ? children.length : 1\r\n const lastIndex = numberChildren - 1\r\n\r\n const adjChildren = [children].flat().map((child, index) => {\r\n const hover = useMemo(() => !tpStatic && $$(hoverIndex) === index)\r\n const nhover = useMemo(() => !$$(hover))\r\n\r\n // whiteSpace: undefined,\r\n // color: undefined,\r\n // borderBottom: undefined,\r\n // }\r\n\r\n\r\n // if (!tpStatic && $$(hoverIndex) === index) {\r\n // class.push(hoverColor)\r\n // class.push(hoverBackground)\r\n // } else {\r\n // class.push(color)\r\n // class.push(backgroundColor)\r\n // }\r\n\r\n const style = { borderBottom: () => ($$(lineSeparated) && lastIndex !== index) ? $$(lineSeparated) : undefined }\r\n\r\n const childProps = {\r\n // ...child.props,\r\n ref: span => spanHeightsRef[`span${index + 1}`] = span,\r\n class: [padding, {\r\n 'whitespace-nowrap': () => $$(width) === 'auto', [$$(hoverColor)]: hover, [$$(hoverBackground)]: hover, [$$(color)]: nhover,\r\n [$$(backgroundColor)]: nhover,\r\n [$$(lineSeparated)]: () => ($$(lineSeparated) && lastIndex !== index)\r\n },],\r\n // style,\r\n onMouseOver: () => onSpanHover(index, lastIndex, numberChildren)\r\n }\r\n return cloneElement(child, childProps)\r\n })\r\n const calcHPos = (align: ObservableMaybe<Align>, left: string, center: string, right: string) => {\r\n return isAlign(align, 'center')\r\n ? center : isAlign(align, 'left') ? left : right\r\n }\r\n const calcVPos = (perc: number, elHeight: number, divider: number, adjMove: number, totHeight?: number) => {\r\n return `calc(${perc}% - ${totHeight || 0}px - ${elHeight}px/${divider} + ${adjMove || 0}px)`\r\n }\r\n // TODO: REfactor\r\n const calcTopPos = (align: ObservableMaybe<Align>, elHeight: number, totHeight: number) => {\r\n if ($$(align) === 'center') {\r\n return calcVPos(50, elHeight, 2, null, totHeight)\r\n }\r\n if ($$(align) === 'bottom') {\r\n return calcVPos(100, elHeight, 2, -12, totHeight)\r\n }\r\n return calcVPos(0, elHeight, 2, 12, totHeight)\r\n }\r\n\r\n let left = $('')\r\n let right = $('')\r\n let top = $('8px')\r\n // Align: left, center, right\r\n const hLeftPos = useMemo(() => calcHPos(position.align, '100% - 50px', '50% - 40px', '0% - 30px'))\r\n const hRightPos = useMemo(() => calcHPos(position.align, '0% - 30px', '50% - 40px', '100% - 50px'))\r\n\r\n useEffect(() => {\r\n const { align } = position\r\n switch ($$(arrow)) {\r\n case 'h-start':\r\n left(`calc(${$$(hRightPos)})`)\r\n break\r\n case 'h-end':\r\n right(`calc(${$$(hLeftPos)})`)\r\n break\r\n case 'v-start':\r\n top(calcTopPos(align, $$(firstH), null))\r\n break\r\n case 'v-end':\r\n top(calcTopPos(align, $$(lineSeparated) ? -$$(lastH) + 1 : -$$(lastH), $$(totH)))\r\n break\r\n case 'v-center':\r\n top(`calc(0% - ${$$(totH)}px/2 + 11px)`)\r\n if (isAlign(align, 'center')) {\r\n top(`calc(50% - ${$$(totH)}px/2)`)\r\n }\r\n if (isAlign(align, 'bottom')) {\r\n top(`calc(100% - ${$$(totH)}px/2 - 11px)`)\r\n }\r\n break\r\n default:\r\n break\r\n }\r\n\r\n switch ($$(position.side)) {\r\n case 'top':\r\n top(calcVPos(0, $$(totH), 1, 13))\r\n break\r\n case 'left':\r\n right('8px')\r\n break\r\n case 'right':\r\n left('8px')\r\n break\r\n default:\r\n break\r\n }\r\n })\r\n\r\n const textBoxWidthValue = useMemo(() => {\r\n let textBoxWidthValue: number | string = $$(width)\r\n\r\n if (textBoxWidthValue !== 'auto') {\r\n textBoxWidthValue = Number($$(width).slice(0, -2))\r\n if (move.left > 0) textBoxWidthValue += move.left\r\n if (move.right > 0) textBoxWidthValue += move.right\r\n }\r\n\r\n return textBoxWidthValue\r\n })\r\n\r\n const boxStyle = {\r\n left,\r\n right,\r\n top,\r\n width: textBoxWidthValue,\r\n borderRadius\r\n }\r\n\r\n const shColAdj = useMemo(() => $$(shCol).substr(0, $$(shCol).lastIndexOf(',')).replace(/[)]/g, ','))\r\n const shadow = useMemo(() => `${$$(shShape)} ${$$(shCol)}, 0 0 3px ${$$(shColAdj)}, 0.1), 0 0 0 1px ${$$(shColAdj)}, 0.15)`)\r\n const boxShadow = useMemo(() => $$(flat) ? null : $$(shadow))\r\n const alertStyle = useMemo(() => $$(alert) ? 'rpt-alert' : '')\r\n const rgb = useMemo(() => $$(alert) || 'rgb(248, 109, 109)')\r\n const alertShadow = useMemo(() => $$(alert) ? `0 0 0 ${$$(rgb).slice(0, $$(rgb).length - 1)}, 0.4)` : null)\r\n const noNeg = (number: number) => number > 0 ? number : 0\r\n\r\n return (\r\n <div\r\n class={[`absolute animation-none`, alertStyle, cls ?? className]}\r\n style={{\r\n ...boxStyle,\r\n boxShadow: alertShadow,\r\n padding: `${move.down}px ${move.left}px ${move.up}px ${move.right}px`\r\n }}\r\n >\r\n <div\r\n class={[`absolute animation-none w-full h-full z-0`, borderRadius]}\r\n style={{\r\n boxShadow,\r\n height: () => `calc(100% - ${noNeg(move.down) + noNeg(move.up)}px)`,\r\n width: () => `calc(100% - ${noNeg(move.left) + noNeg(move.right)}px)`\r\n }}\r\n />\r\n <div\r\n class={[`relative z-[2] w-full`, backgroundColor, borderRadius]}\r\n onMouseLeave={unsetHover}\r\n >\r\n <div\r\n class={[!tpStatic ? '[&_span]:cursor-pointer w-full' : null, borderRadius, 'overflow-hidden']}>\r\n {adjChildren}\r\n </div>\r\n </div>\r\n </div>\r\n )\r\n}\r\n\r\n","import { $$, ObservableMaybe, useMemo, type JSX } from 'woby'\r\n//\r\n\r\nexport const Arrow = ({ isHovered, hovBkg, bkgCol, flat }: { isHovered: ObservableMaybe<boolean>, hovBkg: ObservableMaybe<string>, bkgCol: ObservableMaybe<string>, flat?: ObservableMaybe<boolean> }): JSX.Element => {\r\n const backgroundColor = useMemo(() => $$(isHovered) ? $$(hovBkg) : $$(bkgCol))\r\n // const boxShadow = flat ? null : 'shadow-[rgba(0,0,0,.18)0_0_0_1px]'\r\n const boxShadow = useMemo(() => $$(flat) ? null : '[box-shadow:rgba(0,0,0,0.18)0px_0px_0px_1px]')\r\n\r\n return <div class={[`rotate-45 w-[14px] h-[14px] m-[3px] z-[1]`, backgroundColor, boxShadow]} />\r\n}\r\n","import { $$, $, useEffect, ObservableMaybe, Observable, isObservable, useMemo, getMeta, type JSX } from 'woby'\r\n\r\nimport { Align, Side, TextBox, isSide } from './TextBox'\r\nimport { Arrow } from './Arrow'\r\n\r\n//import cssRules from './Tooltip/styles'\r\nimport '../../dist/output.css'\r\n\r\nexport type TooltipType = {\r\n /** tailwind\r\n * border-b border-b-[#ececec]\r\n */\r\n lineSeparated?: ObservableMaybe<boolean | string>, position?: ObservableMaybe<string>,\r\n /** tailwind */\r\n hoverBackground?: ObservableMaybe<string>,\r\n /** tailwind */\r\n backgroundColor?: ObservableMaybe<string>,\r\n arrowAlign?: ObservableMaybe<Align>, moveDown?: ObservableMaybe<string>,\r\n moveRight?: ObservableMaybe<string>, moveLeft?: ObservableMaybe<string>,\r\n moveUp?: ObservableMaybe<string>, textAlign?: ObservableMaybe<string>, fontFamily?: ObservableMaybe<string>, fontWeight?: ObservableMaybe<string>,\r\n /** tailwind */\r\n fontSize?: ObservableMaybe<string>,\r\n /** tailwind */\r\n color?: ObservableMaybe<string>, animation?: ObservableMaybe<string>, zIndex?: ObservableMaybe<string>, flat?: ObservableMaybe<boolean>, show?: ObservableMaybe<boolean>,\r\n /** tailwind */\r\n hoverColor?: ObservableMaybe<string>,\r\n /** no tailwind */\r\n textboxWidth?: ObservableMaybe<string>,\r\n /** tailwind */\r\n padding?: ObservableMaybe<string>,\r\n /** tailwind */\r\n borderRadius?: ObservableMaybe<string>, shadowColor?: ObservableMaybe<string>, shadowShape?: ObservableMaybe<string>,\r\n static?: ObservableMaybe<boolean>, alert?: ObservableMaybe<string>,\r\n children?: JSX.Element\r\n}\r\n\r\nexport const Tooltip = <T extends HTMLElement>(properties: TooltipType & JSX.HTMLAttributes<HTMLDivElement> & { parentRef?: Observable<HTMLElement>, parent?: JSX.Child, containerClass?: JSX.Class /* | ((props: { ref: Refs }) => Child), */ } = {}): JSX.Element => {\r\n const props = {\r\n /** tailwind */\r\n hoverBackground: 'bg-[#ececec]',\r\n /** tailwind */\r\n hoverColor: 'text-[black]',\r\n /** tailwind */\r\n backgroundColor: 'bg-[white]',\r\n /** not tailwind */\r\n textboxWidth: '150px',\r\n /** tailwind */\r\n fontSize: '[font-size:inherit]',\r\n /** tailwind */\r\n color: 'text-inherit',\r\n borderRadius: 'rounded-[5px]',\r\n shadowColor: 'rgba(0,0,0,0.251)', shadowShape: '0 8px 15px', moveDown: '0px', moveRight: '0px', moveLeft: '0px', moveUp: '0px',\r\n position: 'bottom center', arrowAlign: $<Align>('start'), textAlign: 'left', fontFamily: 'inherit', fontWeight: 'bold',\r\n\r\n zIndex: '100', animation: '', show: false, ...properties\r\n }\r\n\r\n const { position: pos, lineSeparated: lines, arrowAlign: arwAlign,\r\n hoverBackground, backgroundColor,\r\n moveDown, moveRight, moveLeft, moveUp,\r\n textAlign, fontFamily, fontWeight, fontSize, color, zIndex, animation, flat, parentRef: pf, parent: Parent,\r\n // shadowColor, shadowShape, textboxWidth, padding, borderRadius, hoverColor,\r\n containerClass,\r\n } = props\r\n\r\n const show = /* $$(parent) ? props.show : */ (isObservable(props.show) ? props.show : $(props.show))\r\n const parentRef: Observable<HTMLElement> = isObservable(pf) ? pf : $(pf)\r\n\r\n useEffect(() => {\r\n const p = $$(parentRef)\r\n if (!p) return\r\n\r\n const on = () => show(true)\r\n const off = () => show(false)\r\n p.addEventListener('mouseenter', on)\r\n p.addEventListener('mouseleave', off)\r\n\r\n return () => {\r\n p.removeEventListener('mouseenter', on)\r\n p.removeEventListener('mouseleave', off)\r\n }\r\n })\r\n\r\n const hoverArrow = $(false)\r\n const mount = $(true)\r\n // const tooltipRef = useRef(null)\r\n // const {\r\n // lineSeparated = '1px solid #ececec', position = 'right center', hoverBackground = '#ececec', backgroundColor = 'white', arrowAlign = 'start', moveDown = '0px',\r\n // moveRight = '0px', moveLeft = '0px', moveUp = '0px', textAlign = 'left', fontFamily = 'inherit', fontWeight = 'bold', fontSize = 'inherit', color = 'inherit',\r\n // animation = '', zIndex = '100', flat,\r\n // show\r\n // } = props\r\n\r\n // useEffect(() => {\r\n // // // Injecting styles directly into header\r\n // // // if (!document.getElementById('rpt-css')) {\r\n // // // const $style = document.createElement('style')\r\n // // // $style.type = 'text/css'\r\n // // // $style.id = 'rpt-css'\r\n // // // document.head.appendChild($style)\r\n // // // $style.innerHTML = cssRules\r\n // // // }\r\n\r\n // // // Basic prop type checking\r\n // // Object.keys(props).forEach((propName) => {\r\n // // const type = typeof $$(props[propName])\r\n // // const text = `React-power-tooltip: [${propName}] prop should be a`\r\n // // if (propName !== 'children' && type !== 'boolean' && type !== 'string') {\r\n // // // eslint-disable-next-line\r\n // // console.error(`${text} string (check also units)`)\r\n // // }\r\n // // })\r\n // // })\r\n\r\n // useEffect(() => {\r\n // show(props.show())\r\n // })\r\n\r\n useEffect(() => {\r\n if ($$(show)) mount(true)\r\n if (!$$(animation)) mount(false)\r\n })\r\n\r\n // const hoverArrowHandler = (bool) => {\r\n // setHoverArrow(bool)\r\n // }\r\n\r\n // const {\r\n // hoverBackground = '#ececec', hoverColor = 'black', backgroundColor = 'white', textboxWidth = '150px', padding = '15px 20px', borderRadius = '5px',\r\n // shadowColor = 'rgba(0,0,0,0.251)', shadowShape = '0 8px 15px', moveDown = '0px', moveRight = '0px', moveLeft = '0px', moveUp = '0px',\r\n // position: pos = 'right center', arrowAlign: arwAlign = 'start', textAlign = 'left', fontFamily = 'inherit', fontWeight = 'bold', fontSize = 'inherit', color = 'inherit',\r\n // zIndex = '100', animation = '', lineSeparated: lines,\r\n // flat,\r\n // } = props\r\n\r\n\r\n // const { lineSeparated: lines, position: pos, hoverBackground, backgroundColor, arrowAlign: arwAlign, moveDown, moveRight, moveLeft, moveUp, textAlign, fontFamily, fontWeight, fontSize, color, animation, zIndex, flat } = props\r\n\r\n // Sets if false no line; if true default line; if string custom line;\r\n const lineSeparated: Observable<string> = typeof ($$(lines)) === 'boolean'\r\n ? $('border-b border-b-[#ececec]') : (isObservable(lines) ? lines : $(lines)) as Observable<string>\r\n\r\n const position = {\r\n side: $$(pos).split(' ')[0] as Side,\r\n align: $$(pos).split(' ')[1] as Align,\r\n }\r\n\r\n const arrow = $($$(arwAlign))//isObservable(arwAlign) ? arwAlign : $(arwAlign)\r\n\r\n const { side, align } = position\r\n const classes = ['absolute flex']\r\n let tooltipStyle = {}\r\n let bottom\r\n\r\n // const arrange = (top, left, right, height, width, cssSel) => {\r\n // tooltipStyle = { top, left, right, height, width }\r\n // classes.push(cssSel)\r\n // }\r\n\r\n switch (side) {\r\n case 'bottom':\r\n classes.push('top-full left-0 w-full justify-center')\r\n break\r\n case 'top':\r\n classes.push('left-0 w-full justify-center')\r\n bottom = '100%'\r\n break\r\n case 'right':\r\n classes.push('top-0 left-full h-full justify-start')\r\n break\r\n default:\r\n classes.push('top-0 right-full h-full justify-end')\r\n break\r\n }\r\n\r\n const onAxis = {\r\n y: isSide(position.side, 'top') || isSide(position.side, 'bottom'),\r\n x: isSide(position.side, 'left') || isSide(position.side, 'right')\r\n }\r\n\r\n arrow((onAxis.y ? `h-${$$(arrow)}` : `v-${$$(arrow)}`) as Align)\r\n\r\n const num = str => Number(str.slice(0, -2))\r\n const move = {\r\n down: num(moveDown),\r\n up: num(moveUp),\r\n left: num(moveLeft),\r\n right: num(moveRight)\r\n }\r\n\r\n const oneMovePropIsNeg = move.down < 0 || move.up < 0\r\n || move.left < 0 || move.right < 0\r\n\r\n switch (align) {\r\n case 'left':\r\n if (onAxis.y) classes.push('!justify-start')\r\n break\r\n case 'right':\r\n if (onAxis.y) classes.push('!justify-end')\r\n break\r\n case 'bottom':\r\n if (onAxis.x) classes.push('items-end')\r\n break\r\n case 'top':\r\n break\r\n default:\r\n if (onAxis.x) {\r\n classes.push('items-center')\r\n if (!oneMovePropIsNeg) {\r\n move.down *= 2\r\n move.up *= 2\r\n }\r\n }\r\n if (onAxis.y && !oneMovePropIsNeg) {\r\n move.right *= 2\r\n move.left *= 2\r\n }\r\n break\r\n }\r\n\r\n const adjustment = `${move.down}px ${move.left}px ${move.up}px ${move.right}px`\r\n\r\n tooltipStyle = {\r\n ...tooltipStyle,\r\n zIndex,\r\n color,\r\n bottom,\r\n fontSize,\r\n textAlign,\r\n fontFamily,\r\n fontWeight,\r\n padding: oneMovePropIsNeg ? null : adjustment,\r\n margin: oneMovePropIsNeg ? adjustment : null,\r\n animation: () => $$(show) ? `rpt-${$$(animation)} 0.2s` : `rpt-${$$(animation)}-out 0.15s`\r\n }\r\n\r\n const e = useMemo(() => ((!$$(animation) && $$(show) && $$(props.children)) || ($$(show) && $$(mount)) && $$(props.children)) ? (\r\n <div\r\n className={classes}\r\n style={tooltipStyle}\r\n onAnimationEnd={() => { if (!$$(show) && $$(animation)) mount(false) }}\r\n >\r\n <div class='flex justify-center' >\r\n <Arrow\r\n isHovered={hoverArrow}\r\n hovBkg={hoverBackground}\r\n bkgCol={backgroundColor}\r\n flat={flat}\r\n />\r\n <TextBox\r\n {...props}\r\n hoverArrow={hoverArrow}\r\n lines={lineSeparated}\r\n pos={position}\r\n arw={arrow}\r\n move={move}\r\n />\r\n </div>\r\n </div>\r\n ) : null\r\n )\r\n\r\n return useMemo(() => $$(Parent) ? <div class={[containerClass ?? 'relative']} ref={parentRef}>{Parent}{e}</div> : e)\r\n}\r\n\r\n\r\n\r\n"],"names":["lastIndex","arrow","position","left","right","textBoxWidthValue"],"mappings":"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"}
|
1
|
+
{"version":3,"file":"index.es.js","sources":["../src/TextBox.tsx","../src/Arrow.tsx","../src/Tooltip.tsx"],"sourcesContent":["import { $, $$, useEffect, Child, useMemo, Observable, ObservableMaybe, jsx, store, type JSX } from 'woby'\r\n\r\n\r\ntype _Align = 'start' | 'end' | 'center' | 'bottom' | 'top' | 'right' | 'left'\r\nexport type Align = _Align | `v-${_Align}` | `h-${_Align}`\r\nexport type Side = 'bottom' | 'top' | 'left' | 'right'\r\n\r\nexport const isSide = (side: ObservableMaybe<Side>, str: Side) => $$(side) === str\r\nexport const isAlign = (align: ObservableMaybe<Align>, str: Align) => $$(align) === str\r\nexport const isAlignA = (position, str: string) => $$(position) === str\r\n\r\ntype TextboxType = {\r\n // lineSeparated?: boolean | string, position?: string,\r\n // /** tailwind */\r\n hoverBackground?: ObservableMaybe<string>, backgroundColor?: ObservableMaybe<string>, arrowAlign?: ObservableMaybe<Align>,\r\n moveDown?: ObservableMaybe<string>, moveRight?: ObservableMaybe<string>, moveLeft?: ObservableMaybe<string>,\r\n // moveUp?: string, textAlign?: string, fontFamily?: string, fontWeight?: string, fontSize?: string,\r\n // /** tailwind */\r\n color?: ObservableMaybe<string>, animation?: ObservableMaybe<string>, zIndex?: ObservableMaybe<string>, flat?: ObservableMaybe<boolean>, show?: ObservableMaybe<boolean>,\r\n hoverColor?: ObservableMaybe<string>,\r\n /** no tailwind */\r\n textboxWidth?: ObservableMaybe<string>,\r\n /** no tailwind */\r\n padding?: ObservableMaybe<string>,\r\n /** tailwind */\r\n borderRadius?: ObservableMaybe<string>, shadowColor?: ObservableMaybe<string>, shadowShape?: ObservableMaybe<string>,\r\n static?: ObservableMaybe<boolean>, alert?: ObservableMaybe<string>,\r\n\r\n hoverArrow: Observable<boolean>\r\n\r\n arw: ObservableMaybe<Align>,\r\n pos: {\r\n side: ObservableMaybe<Side>\r\n align: ObservableMaybe<Align>\r\n },\r\n /** tailwind border-b-*/\r\n lines: ObservableMaybe<string>,\r\n move: {\r\n down: number\r\n up: number\r\n left: number\r\n right: number\r\n },\r\n children?: Child\r\n}\r\n\r\n\r\nexport const TextBox = (props: TextboxType & JSX.HTMLAttributes<HTMLDivElement>): JSX.Element => {\r\n const hoverIndex = $<number>(null)\r\n const firstH = $<number>(null)\r\n const lastH = $<number>(null)\r\n const totH = $<number>(null)\r\n\r\n const spanHeightsRef = store({})\r\n\r\n store.on(spanHeightsRef, () => {\r\n const heights = Object.keys(spanHeightsRef)\r\n .map(key => spanHeightsRef[key].clientHeight)\r\n const firsth = heights[0]\r\n const lasth = heights[heights.length - 1]\r\n const toth = heights.reduce((accumulator, currentValue) => accumulator + currentValue, 0)\r\n totH(toth)\r\n firstH(firsth)\r\n lastH(lasth)\r\n })\r\n\r\n const unsetHover = () => {\r\n hoverIndex(null)\r\n props.hoverArrow(false)\r\n }\r\n\r\n // Set & unset hover state\r\n const onSpanHover = (index: number, lastIndex: number, numChildren: number) => {\r\n hoverIndex(index)\r\n const { static: rctStatic, arw: arrow, pos: position, hoverArrow } = props\r\n if (!rctStatic &&\r\n ((index === 0 && (isSide(position.side, 'bottom') || isAlignA(arrow, 'v-start'))) ||\r\n (index === lastIndex && (isSide(position.side, 'top') || isAlignA(arrow, 'v-end'))) ||\r\n numChildren === 1)) {\r\n return hoverArrow(true)\r\n }\r\n return hoverArrow(false)\r\n }\r\n\r\n const {\r\n arw: arrow,\r\n pos: position,\r\n lines: lineSeparated,\r\n static: tpStatic,\r\n textboxWidth: width,\r\n shadowColor: shCol,\r\n shadowShape: shShape,\r\n move,\r\n backgroundColor,\r\n padding,\r\n borderRadius,\r\n hoverBackground,\r\n hoverColor,\r\n color,\r\n alert,\r\n flat,\r\n children,\r\n class: cls, className\r\n } = props\r\n\r\n const numberChildren = Array.isArray(children) ? children.length : 1\r\n const lastIndex = numberChildren - 1\r\n\r\n const adjChildren = [children].flat().map((child, index) => {\r\n const hover = useMemo(() => !tpStatic && $$(hoverIndex) === index)\r\n const nhover = useMemo(() => !$$(hover))\r\n const style = { borderBottom: () => ($$(lineSeparated) && lastIndex !== index) ? $$(lineSeparated) : undefined }\r\n\r\n const childProps = {\r\n // ...child.props,\r\n ref: span => spanHeightsRef[`span${index + 1}`] = span,\r\n class: [padding, {\r\n 'whitespace-nowrap': () => $$(width) === 'auto', [$$(hoverColor)]: hover, [$$(hoverBackground)]: hover, [$$(color)]: nhover,\r\n [$$(backgroundColor)]: nhover,\r\n [$$(lineSeparated)]: () => ($$(lineSeparated) && lastIndex !== index)\r\n },],\r\n // style,\r\n onMouseOver: () => onSpanHover(index, lastIndex, numberChildren)\r\n }\r\n //@ts-ignore\r\n return jsx(child, { ...childProps })\r\n })\r\n const calcHPos = (align: ObservableMaybe<Align>, left: string, center: string, right: string) => {\r\n return isAlign(align, 'center')\r\n ? center : isAlign(align, 'left') ? left : right\r\n }\r\n const calcVPos = (perc: number, elHeight: number, divider: number, adjMove: number, totHeight?: number) => {\r\n return `calc(${perc}% - ${totHeight || 0}px - ${elHeight}px/${divider} + ${adjMove || 0}px)`\r\n }\r\n // TODO: REfactor\r\n const calcTopPos = (align: ObservableMaybe<Align>, elHeight: number, totHeight: number) => {\r\n if ($$(align) === 'center') {\r\n return calcVPos(50, elHeight, 2, null, totHeight)\r\n }\r\n if ($$(align) === 'bottom') {\r\n return calcVPos(100, elHeight, 2, -12, totHeight)\r\n }\r\n return calcVPos(0, elHeight, 2, 12, totHeight)\r\n }\r\n\r\n let left = $('')\r\n let right = $('')\r\n let top = $('8px')\r\n // Align: left, center, right\r\n const hLeftPos = useMemo(() => calcHPos(position.align, '100% - 50px', '50% - 40px', '0% - 30px'))\r\n const hRightPos = useMemo(() => calcHPos(position.align, '0% - 30px', '50% - 40px', '100% - 50px'))\r\n\r\n useEffect(() => {\r\n const { align } = position\r\n switch ($$(arrow)) {\r\n case 'h-start':\r\n left(`calc(${$$(hRightPos)})`)\r\n break\r\n case 'h-end':\r\n right(`calc(${$$(hLeftPos)})`)\r\n break\r\n case 'v-start':\r\n top(calcTopPos(align, $$(firstH), null))\r\n break\r\n case 'v-end':\r\n top(calcTopPos(align, $$(lineSeparated) ? -$$(lastH) + 1 : -$$(lastH), $$(totH)))\r\n break\r\n case 'v-center':\r\n top(`calc(0% - ${$$(totH)}px/2 + 11px)`)\r\n if (isAlign(align, 'center')) {\r\n top(`calc(50% - ${$$(totH)}px/2)`)\r\n }\r\n if (isAlign(align, 'bottom')) {\r\n top(`calc(100% - ${$$(totH)}px/2 - 11px)`)\r\n }\r\n break\r\n default:\r\n break\r\n }\r\n\r\n switch ($$(position.side)) {\r\n case 'top':\r\n top(calcVPos(0, $$(totH), 1, 13))\r\n break\r\n case 'left':\r\n right('8px')\r\n break\r\n case 'right':\r\n left('8px')\r\n break\r\n default:\r\n break\r\n }\r\n })\r\n\r\n const textBoxWidthValue = useMemo(() => {\r\n let textBoxWidthValue: number | string = $$(width)\r\n\r\n if (textBoxWidthValue !== 'auto') {\r\n textBoxWidthValue = Number($$(width).slice(0, -2))\r\n if (move.left > 0) textBoxWidthValue += move.left\r\n if (move.right > 0) textBoxWidthValue += move.right\r\n }\r\n\r\n return textBoxWidthValue\r\n })\r\n\r\n const boxStyle = {\r\n left,\r\n right,\r\n top,\r\n width: textBoxWidthValue,\r\n borderRadius\r\n }\r\n\r\n const shColAdj = useMemo(() => $$(shCol).substr(0, $$(shCol).lastIndexOf(',')).replace(/[)]/g, ','))\r\n const shadow = useMemo(() => `${$$(shShape)} ${$$(shCol)}, 0 0 3px ${$$(shColAdj)}, 0.1), 0 0 0 1px ${$$(shColAdj)}, 0.15)`)\r\n const boxShadow = useMemo(() => $$(flat) ? null : $$(shadow))\r\n const alertStyle = useMemo(() => $$(alert) ? 'rpt-alert' : '')\r\n const rgb = useMemo(() => $$(alert) || 'rgb(248, 109, 109)')\r\n const alertShadow = useMemo(() => $$(alert) ? `0 0 0 ${$$(rgb).slice(0, $$(rgb).length - 1)}, 0.4)` : null)\r\n const noNeg = (number: number) => number > 0 ? number : 0\r\n\r\n return (\r\n <div\r\n class={[`absolute animation-none`, alertStyle, cls ?? className]}\r\n style={{\r\n ...boxStyle,\r\n boxShadow: alertShadow,\r\n padding: `${move.down}px ${move.left}px ${move.up}px ${move.right}px`\r\n }}\r\n >\r\n <div\r\n class={[`absolute animation-none w-full h-full z-0`, borderRadius]}\r\n style={{\r\n boxShadow,\r\n height: () => `calc(100% - ${noNeg(move.down) + noNeg(move.up)}px)`,\r\n width: () => `calc(100% - ${noNeg(move.left) + noNeg(move.right)}px)`\r\n }}\r\n />\r\n <div\r\n class={[`relative z-[2] w-full`, backgroundColor, borderRadius]}\r\n onMouseLeave={unsetHover}\r\n >\r\n <div\r\n class={[!tpStatic ? '[&_span]:cursor-pointer w-full' : null, borderRadius, 'overflow-hidden']}>\r\n {adjChildren}\r\n </div>\r\n </div>\r\n </div>\r\n )\r\n}\r\n\r\n","import { $$, ObservableMaybe, useMemo, type JSX } from 'woby'\r\n//\r\n\r\nexport const Arrow = ({ isHovered, hovBkg, bkgCol, flat }: { isHovered: ObservableMaybe<boolean>, hovBkg: ObservableMaybe<string>, bkgCol: ObservableMaybe<string>, flat?: ObservableMaybe<boolean> }): JSX.Element => {\r\n const backgroundColor = useMemo(() => $$(isHovered) ? $$(hovBkg) : $$(bkgCol))\r\n // const boxShadow = flat ? null : 'shadow-[rgba(0,0,0,.18)0_0_0_1px]'\r\n const boxShadow = useMemo(() => $$(flat) ? null : '[box-shadow:rgba(0,0,0,0.18)0px_0px_0px_1px]')\r\n\r\n return <div class={[`rotate-45 w-[14px] h-[14px] m-[3px] z-[1]`, backgroundColor, boxShadow]} />\r\n}\r\n","import { $$, $, useEffect, ObservableMaybe, Observable, isObservable, useMemo, getMeta, type JSX } from 'woby'\r\n\r\nimport { Align, Side, TextBox, isSide } from './TextBox'\r\nimport { Arrow } from './Arrow'\r\n\r\n//import cssRules from './Tooltip/styles'\r\nimport '../dist/output.css'\r\n\r\nexport type TooltipType = {\r\n /** tailwind\r\n * border-b border-b-[#ececec]\r\n */\r\n lineSeparated?: ObservableMaybe<boolean | string>, position?: ObservableMaybe<string>,\r\n /** tailwind */\r\n hoverBackground?: ObservableMaybe<string>,\r\n /** tailwind */\r\n backgroundColor?: ObservableMaybe<string>,\r\n arrowAlign?: ObservableMaybe<Align>, moveDown?: ObservableMaybe<string>,\r\n moveRight?: ObservableMaybe<string>, moveLeft?: ObservableMaybe<string>,\r\n moveUp?: ObservableMaybe<string>, textAlign?: ObservableMaybe<string>, fontFamily?: ObservableMaybe<string>, fontWeight?: ObservableMaybe<string>,\r\n /** tailwind */\r\n fontSize?: ObservableMaybe<string>,\r\n /** tailwind */\r\n color?: ObservableMaybe<string>, animation?: ObservableMaybe<string>, zIndex?: ObservableMaybe<string>, flat?: ObservableMaybe<boolean>, show?: ObservableMaybe<boolean>,\r\n /** tailwind */\r\n hoverColor?: ObservableMaybe<string>,\r\n /** no tailwind */\r\n textboxWidth?: ObservableMaybe<string>,\r\n /** tailwind */\r\n padding?: ObservableMaybe<string>,\r\n /** tailwind */\r\n borderRadius?: ObservableMaybe<string>, shadowColor?: ObservableMaybe<string>, shadowShape?: ObservableMaybe<string>,\r\n static?: ObservableMaybe<boolean>, alert?: ObservableMaybe<string>,\r\n children?: JSX.Element\r\n}\r\n\r\nexport const Tooltip = <T extends HTMLElement>(properties: TooltipType & JSX.HTMLAttributes<HTMLDivElement> & { parentRef?: Observable<HTMLElement>, parent?: JSX.Child, containerClass?: JSX.Class /* | ((props: { ref: Refs }) => Child), */ } = {}): JSX.Element => {\r\n const props = {\r\n /** tailwind */\r\n hoverBackground: 'bg-[#ececec]',\r\n /** tailwind */\r\n hoverColor: 'text-[black]',\r\n /** tailwind */\r\n backgroundColor: 'bg-[white]',\r\n /** not tailwind */\r\n textboxWidth: '150px',\r\n /** tailwind */\r\n fontSize: '[font-size:inherit]',\r\n /** tailwind */\r\n color: 'text-inherit',\r\n borderRadius: 'rounded-[5px]',\r\n shadowColor: 'rgba(0,0,0,0.251)', shadowShape: '0 8px 15px', moveDown: '0px', moveRight: '0px', moveLeft: '0px', moveUp: '0px',\r\n position: 'bottom center', arrowAlign: $<Align>('start'), textAlign: 'left', fontFamily: 'inherit', fontWeight: 'bold',\r\n\r\n zIndex: '100', animation: '', show: false, ...properties\r\n }\r\n\r\n const { position: pos, lineSeparated: lines, arrowAlign: arwAlign,\r\n hoverBackground, backgroundColor,\r\n moveDown, moveRight, moveLeft, moveUp,\r\n textAlign, fontFamily, fontWeight, fontSize, color, zIndex, animation, flat, parentRef: pf, parent: Parent,\r\n // shadowColor, shadowShape, textboxWidth, padding, borderRadius, hoverColor,\r\n containerClass,\r\n } = props\r\n\r\n const show = /* $$(parent) ? props.show : */ (isObservable(props.show) ? props.show : $(props.show))\r\n const parentRef: Observable<HTMLElement> = isObservable(pf) ? pf : $(pf)\r\n\r\n useEffect(() => {\r\n const p = $$(parentRef)\r\n if (!p) return\r\n\r\n const on = () => show(true)\r\n const off = () => show(false)\r\n p.addEventListener('mouseenter', on)\r\n p.addEventListener('mouseleave', off)\r\n\r\n return () => {\r\n p.removeEventListener('mouseenter', on)\r\n p.removeEventListener('mouseleave', off)\r\n }\r\n })\r\n\r\n const hoverArrow = $(false)\r\n const mount = $(true)\r\n // const tooltipRef = useRef(null)\r\n // const {\r\n // lineSeparated = '1px solid #ececec', position = 'right center', hoverBackground = '#ececec', backgroundColor = 'white', arrowAlign = 'start', moveDown = '0px',\r\n // moveRight = '0px', moveLeft = '0px', moveUp = '0px', textAlign = 'left', fontFamily = 'inherit', fontWeight = 'bold', fontSize = 'inherit', color = 'inherit',\r\n // animation = '', zIndex = '100', flat,\r\n // show\r\n // } = props\r\n\r\n // useEffect(() => {\r\n // // // Injecting styles directly into header\r\n // // // if (!document.getElementById('rpt-css')) {\r\n // // // const $style = document.createElement('style')\r\n // // // $style.type = 'text/css'\r\n // // // $style.id = 'rpt-css'\r\n // // // document.head.appendChild($style)\r\n // // // $style.innerHTML = cssRules\r\n // // // }\r\n\r\n // // // Basic prop type checking\r\n // // Object.keys(props).forEach((propName) => {\r\n // // const type = typeof $$(props[propName])\r\n // // const text = `React-power-tooltip: [${propName}] prop should be a`\r\n // // if (propName !== 'children' && type !== 'boolean' && type !== 'string') {\r\n // // // eslint-disable-next-line\r\n // // console.error(`${text} string (check also units)`)\r\n // // }\r\n // // })\r\n // // })\r\n\r\n // useEffect(() => {\r\n // show(props.show())\r\n // })\r\n\r\n useEffect(() => {\r\n if ($$(show)) mount(true)\r\n if (!$$(animation)) mount(false)\r\n })\r\n\r\n // const hoverArrowHandler = (bool) => {\r\n // setHoverArrow(bool)\r\n // }\r\n\r\n // const {\r\n // hoverBackground = '#ececec', hoverColor = 'black', backgroundColor = 'white', textboxWidth = '150px', padding = '15px 20px', borderRadius = '5px',\r\n // shadowColor = 'rgba(0,0,0,0.251)', shadowShape = '0 8px 15px', moveDown = '0px', moveRight = '0px', moveLeft = '0px', moveUp = '0px',\r\n // position: pos = 'right center', arrowAlign: arwAlign = 'start', textAlign = 'left', fontFamily = 'inherit', fontWeight = 'bold', fontSize = 'inherit', color = 'inherit',\r\n // zIndex = '100', animation = '', lineSeparated: lines,\r\n // flat,\r\n // } = props\r\n\r\n\r\n // const { lineSeparated: lines, position: pos, hoverBackground, backgroundColor, arrowAlign: arwAlign, moveDown, moveRight, moveLeft, moveUp, textAlign, fontFamily, fontWeight, fontSize, color, animation, zIndex, flat } = props\r\n\r\n // Sets if false no line; if true default line; if string custom line;\r\n const lineSeparated: Observable<string> = typeof ($$(lines)) === 'boolean'\r\n ? $('border-b border-b-[#ececec]') : (isObservable(lines) ? lines : $(lines)) as Observable<string>\r\n\r\n const position = {\r\n side: $$(pos).split(' ')[0] as Side,\r\n align: $$(pos).split(' ')[1] as Align,\r\n }\r\n\r\n const arrow = $($$(arwAlign))//isObservable(arwAlign) ? arwAlign : $(arwAlign)\r\n\r\n const { side, align } = position\r\n const classes = ['absolute flex']\r\n let tooltipStyle = {}\r\n let bottom\r\n\r\n // const arrange = (top, left, right, height, width, cssSel) => {\r\n // tooltipStyle = { top, left, right, height, width }\r\n // classes.push(cssSel)\r\n // }\r\n\r\n switch (side) {\r\n case 'bottom':\r\n classes.push('top-full left-0 w-full justify-center')\r\n break\r\n case 'top':\r\n classes.push('left-0 w-full justify-center')\r\n bottom = '100%'\r\n break\r\n case 'right':\r\n classes.push('top-0 left-full h-full justify-start')\r\n break\r\n default:\r\n classes.push('top-0 right-full h-full justify-end')\r\n break\r\n }\r\n\r\n const onAxis = {\r\n y: isSide(position.side, 'top') || isSide(position.side, 'bottom'),\r\n x: isSide(position.side, 'left') || isSide(position.side, 'right')\r\n }\r\n\r\n arrow((onAxis.y ? `h-${$$(arrow)}` : `v-${$$(arrow)}`) as Align)\r\n\r\n const num = str => Number(str.slice(0, -2))\r\n const move = {\r\n down: num(moveDown),\r\n up: num(moveUp),\r\n left: num(moveLeft),\r\n right: num(moveRight)\r\n }\r\n\r\n const oneMovePropIsNeg = move.down < 0 || move.up < 0\r\n || move.left < 0 || move.right < 0\r\n\r\n switch (align) {\r\n case 'left':\r\n if (onAxis.y) classes.push('!justify-start')\r\n break\r\n case 'right':\r\n if (onAxis.y) classes.push('!justify-end')\r\n break\r\n case 'bottom':\r\n if (onAxis.x) classes.push('items-end')\r\n break\r\n case 'top':\r\n break\r\n default:\r\n if (onAxis.x) {\r\n classes.push('items-center')\r\n if (!oneMovePropIsNeg) {\r\n move.down *= 2\r\n move.up *= 2\r\n }\r\n }\r\n if (onAxis.y && !oneMovePropIsNeg) {\r\n move.right *= 2\r\n move.left *= 2\r\n }\r\n break\r\n }\r\n\r\n const adjustment = `${move.down}px ${move.left}px ${move.up}px ${move.right}px`\r\n\r\n tooltipStyle = {\r\n ...tooltipStyle,\r\n zIndex,\r\n color,\r\n bottom,\r\n fontSize,\r\n textAlign,\r\n fontFamily,\r\n fontWeight,\r\n padding: oneMovePropIsNeg ? null : adjustment,\r\n margin: oneMovePropIsNeg ? adjustment : null,\r\n animation: () => $$(show) ? `rpt-${$$(animation)} 0.2s` : `rpt-${$$(animation)}-out 0.15s`\r\n }\r\n\r\n const e = useMemo(() => ((!$$(animation) && $$(show) && $$(props.children)) || ($$(show) && $$(mount)) && $$(props.children)) ? (\r\n <div\r\n className={classes}\r\n style={tooltipStyle}\r\n onAnimationEnd={() => { if (!$$(show) && $$(animation)) mount(false) }}\r\n >\r\n <div class='flex justify-center' >\r\n <Arrow\r\n isHovered={hoverArrow}\r\n hovBkg={hoverBackground}\r\n bkgCol={backgroundColor}\r\n flat={flat}\r\n />\r\n <TextBox\r\n {...props}\r\n hoverArrow={hoverArrow}\r\n lines={lineSeparated}\r\n pos={position}\r\n arw={arrow}\r\n move={move}\r\n />\r\n </div>\r\n </div>\r\n ) : null\r\n )\r\n\r\n return useMemo(() => $$(Parent) ? <div class={[containerClass ?? 'relative']} ref={parentRef}>{Parent}{e}</div> : e)\r\n}\r\n\r\n\r\n\r\n"],"names":["lastIndex","arrow","position","jsx","left","right","textBoxWidthValue"],"mappings":"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"}
|
package/dist/output.css
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
/*
|
2
|
-
! tailwindcss v3.4.
|
2
|
+
! tailwindcss v3.4.3 | MIT License | https://tailwindcss.com
|
3
3
|
*/
|
4
4
|
|
5
5
|
/*
|
@@ -211,6 +211,8 @@ textarea {
|
|
211
211
|
/* 1 */
|
212
212
|
line-height: inherit;
|
213
213
|
/* 1 */
|
214
|
+
letter-spacing: inherit;
|
215
|
+
/* 1 */
|
214
216
|
color: inherit;
|
215
217
|
/* 1 */
|
216
218
|
margin: 0;
|
@@ -234,9 +236,9 @@ select {
|
|
234
236
|
*/
|
235
237
|
|
236
238
|
button,
|
237
|
-
[type='button'],
|
238
|
-
[type='reset'],
|
239
|
-
[type='submit'] {
|
239
|
+
input:where([type='button']),
|
240
|
+
input:where([type='reset']),
|
241
|
+
input:where([type='submit']) {
|
240
242
|
-webkit-appearance: button;
|
241
243
|
/* 1 */
|
242
244
|
background-color: transparent;
|
@@ -558,6 +560,10 @@ video {
|
|
558
560
|
--tw-backdrop-opacity: ;
|
559
561
|
--tw-backdrop-saturate: ;
|
560
562
|
--tw-backdrop-sepia: ;
|
563
|
+
--tw-contain-size: ;
|
564
|
+
--tw-contain-layout: ;
|
565
|
+
--tw-contain-paint: ;
|
566
|
+
--tw-contain-style: ;
|
561
567
|
}
|
562
568
|
|
563
569
|
::backdrop {
|
@@ -608,6 +614,10 @@ video {
|
|
608
614
|
--tw-backdrop-opacity: ;
|
609
615
|
--tw-backdrop-saturate: ;
|
610
616
|
--tw-backdrop-sepia: ;
|
617
|
+
--tw-contain-size: ;
|
618
|
+
--tw-contain-layout: ;
|
619
|
+
--tw-contain-paint: ;
|
620
|
+
--tw-contain-style: ;
|
611
621
|
}
|
612
622
|
|
613
623
|
.static {
|
@@ -1232,6 +1242,15 @@ video {
|
|
1232
1242
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
1233
1243
|
}
|
1234
1244
|
|
1245
|
+
.blur {
|
1246
|
+
--tw-blur: blur(8px);
|
1247
|
+
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
|
1248
|
+
}
|
1249
|
+
|
1250
|
+
.filter {
|
1251
|
+
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
|
1252
|
+
}
|
1253
|
+
|
1235
1254
|
.\[box-shadow\:rgba\(0\2c 0\2c 0\2c 0\.18\)0px_0px_0px_1px\] {
|
1236
1255
|
box-shadow: rgba(0,0,0,0.18)0px 0px 0px 1px;
|
1237
1256
|
}
|
package/dist/style.css
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
/*
|
2
|
-
! tailwindcss v3.4.
|
2
|
+
! tailwindcss v3.4.3 | MIT License | https://tailwindcss.com
|
3
3
|
*/
|
4
4
|
|
5
5
|
/*
|
@@ -211,6 +211,8 @@ textarea {
|
|
211
211
|
/* 1 */
|
212
212
|
line-height: inherit;
|
213
213
|
/* 1 */
|
214
|
+
letter-spacing: inherit;
|
215
|
+
/* 1 */
|
214
216
|
color: inherit;
|
215
217
|
/* 1 */
|
216
218
|
margin: 0;
|
@@ -234,9 +236,9 @@ select {
|
|
234
236
|
*/
|
235
237
|
|
236
238
|
button,
|
237
|
-
[type='button'],
|
238
|
-
[type='reset'],
|
239
|
-
[type='submit'] {
|
239
|
+
input:where([type='button']),
|
240
|
+
input:where([type='reset']),
|
241
|
+
input:where([type='submit']) {
|
240
242
|
-webkit-appearance: button;
|
241
243
|
/* 1 */
|
242
244
|
background-color: transparent;
|
@@ -558,6 +560,10 @@ video {
|
|
558
560
|
--tw-backdrop-opacity: ;
|
559
561
|
--tw-backdrop-saturate: ;
|
560
562
|
--tw-backdrop-sepia: ;
|
563
|
+
--tw-contain-size: ;
|
564
|
+
--tw-contain-layout: ;
|
565
|
+
--tw-contain-paint: ;
|
566
|
+
--tw-contain-style: ;
|
561
567
|
}
|
562
568
|
|
563
569
|
::backdrop {
|
@@ -608,6 +614,10 @@ video {
|
|
608
614
|
--tw-backdrop-opacity: ;
|
609
615
|
--tw-backdrop-saturate: ;
|
610
616
|
--tw-backdrop-sepia: ;
|
617
|
+
--tw-contain-size: ;
|
618
|
+
--tw-contain-layout: ;
|
619
|
+
--tw-contain-paint: ;
|
620
|
+
--tw-contain-style: ;
|
611
621
|
}
|
612
622
|
|
613
623
|
.static {
|
@@ -1232,6 +1242,15 @@ video {
|
|
1232
1242
|
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
1233
1243
|
}
|
1234
1244
|
|
1245
|
+
.blur {
|
1246
|
+
--tw-blur: blur(8px);
|
1247
|
+
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
|
1248
|
+
}
|
1249
|
+
|
1250
|
+
.filter {
|
1251
|
+
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
|
1252
|
+
}
|
1253
|
+
|
1235
1254
|
.\[box-shadow\:rgba\(0\2c 0\2c 0\2c 0\.18\)0px_0px_0px_1px\] {
|
1236
1255
|
box-shadow: rgba(0,0,0,0.18)0px 0px 0px 1px;
|
1237
1256
|
}
|
package/dist/types/Arrow.d.ts
CHANGED
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Arrow.d.ts","sourceRoot":"","sources":["../../src/Arrow.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAM,eAAe,EAAW,KAAK,GAAG,EAAE,MAAM,MAAM,CAAA;AAG7D,eAAO,MAAM,KAAK,wCAAyC;IAAE,SAAS,EAAE,gBAAgB,OAAO,CAAC,CAAC;IAAC,MAAM,EAAE,gBAAgB,MAAM,CAAC,CAAC;IAAC,MAAM,EAAE,gBAAgB,MAAM,CAAC,CAAC;IAAC,IAAI,CAAC,EAAE,gBAAgB,OAAO,CAAC,CAAA;CAAE,KAAG,WAMvM,CAAA"}
|
@@ -0,0 +1,7 @@
|
|
1
|
+
import '../../dist/output.css';
|
2
|
+
import { Observable, type JSX } from 'woby';
|
3
|
+
import { TooltipType } from './Tooltip';
|
4
|
+
export declare const AutoTooltip: <T extends HTMLElement>({ children, parent, ...properties }?: TooltipType & {
|
5
|
+
parent?: Observable<T>;
|
6
|
+
}) => JSX.Element;
|
7
|
+
//# sourceMappingURL=AutoTooltip.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"AutoTooltip.d.ts","sourceRoot":"","sources":["../../src/AutoTooltip.tsx"],"names":[],"mappings":"AACA,OAAO,uBAAuB,CAAA;AAE9B,OAAO,EAAS,UAAU,EAAa,KAAK,GAAG,EAAE,MAAM,MAAM,CAAA;AAC7D,OAAO,EAAW,WAAW,EAAE,MAAM,WAAW,CAAA;AAGhD,eAAO,MAAM,WAAW,gEAAiE,WAAW,GAAG;IAAE,MAAM,CAAC,EAAE,WAAW,CAAC,CAAC,CAAA;CAAE,KAAQ,WAoBxI,CAAA"}
|
package/dist/types/TextBox.d.ts
CHANGED
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"TextBox.d.ts","sourceRoot":"","sources":["../../src/TextBox.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoB,KAAK,EAAW,UAAU,EAAE,eAAe,EAAc,KAAK,GAAG,EAAE,MAAM,MAAM,CAAA;AAG1G,KAAK,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,GAAG,QAAQ,GAAG,KAAK,GAAG,OAAO,GAAG,MAAM,CAAA;AAC9E,MAAM,MAAM,KAAK,GAAG,MAAM,GAAG,KAAK,MAAM,EAAE,GAAG,KAAK,MAAM,EAAE,CAAA;AAC1D,MAAM,MAAM,IAAI,GAAG,QAAQ,GAAG,KAAK,GAAG,MAAM,GAAG,OAAO,CAAA;AAEtD,eAAO,MAAM,MAAM,SAAU,gBAAgB,IAAI,CAAC,OAAO,IAAI,YAAqB,CAAA;AAClF,eAAO,MAAM,OAAO,UAAW,gBAAgB,KAAK,CAAC,OAAO,KAAK,YAAsB,CAAA;AACvF,eAAO,MAAM,QAAQ,uBAAmB,MAAM,YAAyB,CAAA;AAEvE,KAAK,WAAW,GAAG;IAGf,eAAe,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,eAAe,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,UAAU,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC;IAC1H,QAAQ,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,SAAS,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,QAAQ,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAG5G,KAAK,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,SAAS,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,MAAM,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,IAAI,CAAC,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;IAAC,IAAI,CAAC,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;IACzK,UAAU,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IACrC,kBAAkB;IAClB,YAAY,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IACvC,kBAAkB;IAClB,OAAO,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAClC,eAAe;IACf,YAAY,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,WAAW,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,WAAW,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IACrH,MAAM,CAAC,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;IAAC,KAAK,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAEnE,UAAU,EAAE,UAAU,CAAC,OAAO,CAAC,CAAA;IAE/B,GAAG,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC;IAC5B,GAAG,EAAE;QACD,IAAI,EAAE,eAAe,CAAC,IAAI,CAAC,CAAA;QAC3B,KAAK,EAAE,eAAe,CAAC,KAAK,CAAC,CAAA;KAChC,CAAC;IACF,wBAAwB;IACxB,KAAK,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAC/B,IAAI,EAAE;QACF,IAAI,EAAE,MAAM,CAAA;QACZ,EAAE,EAAE,MAAM,CAAA;QACV,IAAI,EAAE,MAAM,CAAA;QACZ,KAAK,EAAE,MAAM,CAAA;KAChB,CAAC;IACF,QAAQ,CAAC,EAAE,KAAK,CAAA;CACnB,CAAA;AAGD,eAAO,MAAM,OAAO,UAAW,WAAW,GAAG,IAAI,cAAc,CAAC,cAAc,CAAC,KAAG,WA4MjF,CAAA"}
|
package/dist/types/Tooltip.d.ts
CHANGED
@@ -1,5 +1,6 @@
|
|
1
1
|
import { ObservableMaybe, Observable, type JSX } from 'woby';
|
2
2
|
import { Align } from './TextBox';
|
3
|
+
import '../dist/output.css';
|
3
4
|
export type TooltipType = {
|
4
5
|
/** tailwind
|
5
6
|
* border-b border-b-[#ececec]
|
@@ -45,3 +46,4 @@ export declare const Tooltip: <T extends HTMLElement>(properties?: TooltipType &
|
|
45
46
|
parent?: JSX.Child;
|
46
47
|
containerClass?: JSX.Class;
|
47
48
|
}) => JSX.Element;
|
49
|
+
//# sourceMappingURL=Tooltip.d.ts.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../src/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoB,eAAe,EAAE,UAAU,EAAkC,KAAK,GAAG,EAAE,MAAM,MAAM,CAAA;AAE9G,OAAO,EAAE,KAAK,EAAyB,MAAM,WAAW,CAAA;AAIxD,OAAO,oBAAoB,CAAA;AAE3B,MAAM,MAAM,WAAW,GAAG;IACtB;;MAEE;IACF,aAAa,CAAC,EAAE,eAAe,CAAC,OAAO,GAAG,MAAM,CAAC,CAAC;IAAC,QAAQ,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IACtF,eAAe;IACf,eAAe,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAC1C,eAAe;IACf,eAAe,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAC1C,UAAU,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC;IAAC,QAAQ,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IACxE,SAAS,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,QAAQ,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IACxE,MAAM,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,SAAS,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,UAAU,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,UAAU,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAClJ,eAAe;IACf,QAAQ,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IACnC,eAAe;IACf,KAAK,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,SAAS,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,MAAM,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,IAAI,CAAC,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;IAAC,IAAI,CAAC,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;IACzK,eAAe;IACf,UAAU,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IACrC,kBAAkB;IAClB,YAAY,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IACvC,eAAe;IACf,OAAO,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAClC,eAAe;IACf,YAAY,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,WAAW,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAAC,WAAW,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IACrH,MAAM,CAAC,EAAE,eAAe,CAAC,OAAO,CAAC,CAAC;IAAC,KAAK,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IACnE,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAA;CACzB,CAAA;AAED,eAAO,MAAM,OAAO,uCAAuC,WAAW,GAAG,IAAI,cAAc,CAAC,cAAc,CAAC,GAAG;IAAE,SAAS,CAAC,EAAE,WAAW,WAAW,CAAC,CAAC;IAAC,MAAM,CAAC,EAAE,IAAI,KAAK,CAAC;IAAC,cAAc,CAAC,EAAE,IAAI,KAAK,CAAA;CAA6C,KAAQ,WAmOvP,CAAA"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"arrow-down.d.ts","sourceRoot":"","sources":["../../../src/assets/arrow-down.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,GAAG,EAAE,MAAM,MAAM,CAAA;gCACR,IAAI,aAAa,CAAC,UAAU,CAAC;AAApD,wBAEM"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"arrow-up.d.ts","sourceRoot":"","sources":["../../../src/assets/arrow-up.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,GAAG,EAAE,MAAM,MAAM,CAAA;gCACR,IAAI,aAAa,CAAC,UAAU,CAAC;AAApD,wBAEM"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"logo.d.ts","sourceRoot":"","sources":["../../../src/assets/logo.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,GAAG,EAAE,MAAM,MAAM,CAAA;gCACR,IAAI,aAAa,CAAC,UAAU,CAAC;AAApD,wBAeM"}
|
package/dist/types/index.d.ts
CHANGED
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA;AACzB,cAAc,WAAW,CAAA"}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "woby-tooltip",
|
3
|
-
"version": "1.0.
|
3
|
+
"version": "1.0.5",
|
4
4
|
"description": "A powerful tooltip and menu component library for woby.",
|
5
5
|
"main": "./dist/index.cjs.js",
|
6
6
|
"module": "./dist/index.es.js",
|
@@ -15,16 +15,16 @@
|
|
15
15
|
],
|
16
16
|
"license": "MIT",
|
17
17
|
"peerDependencies": {
|
18
|
-
"woby": "0.
|
18
|
+
"woby": "0.58.5"
|
19
19
|
},
|
20
20
|
"devDependencies": {
|
21
|
-
"concurrently": "^
|
22
|
-
"puppeteer": "^
|
23
|
-
"style-loader": "^0.
|
24
|
-
"tailwindcss": "^3.4.
|
25
|
-
"vite": "^
|
26
|
-
"vite-plugin-
|
27
|
-
"svg2tsx": "1.0.
|
21
|
+
"concurrently": "^8.2.2",
|
22
|
+
"puppeteer": "^22.6.5",
|
23
|
+
"style-loader": "^4.0.0",
|
24
|
+
"tailwindcss": "^3.4.3",
|
25
|
+
"vite": "^5.2.8",
|
26
|
+
"vite-plugin-tsconfig": "^1.0.5",
|
27
|
+
"svg2tsx": "1.0.2"
|
28
28
|
},
|
29
29
|
"author": "Chi Chong <wongchichong@gmail.com>",
|
30
30
|
"homepage": "https://github.com/wongchichong/woby-tooltip",
|
@@ -32,13 +32,20 @@
|
|
32
32
|
"type": "git",
|
33
33
|
"url": "git@github.com:wongchichong/woby-tooltip.git"
|
34
34
|
},
|
35
|
+
"dependencies": {
|
36
|
+
"typescript": "5.4.5"
|
37
|
+
},
|
35
38
|
"scripts": {
|
39
|
+
"git": "git add . && git commit -m \"Bump version\" && git push",
|
40
|
+
"bump": "pnpm version patch",
|
41
|
+
"npmjs": "pnpm publish",
|
42
|
+
"release": "run-s -c git bump npmjs",
|
36
43
|
"css:watch": "tailwindcss -i ./src/input.css -o ./dist/output.css --watch",
|
37
44
|
"css": "tailwindcss -i ./src/input.css -o ./dist/output.css",
|
38
|
-
"declaration": "tsc --build --force --declaration --emitDeclarationOnly --verbose",
|
39
|
-
"declaration:watch": "tsc --build --force --declaration --emitDeclarationOnly --verbose --watch",
|
45
|
+
"declaration": "tsc --build --force --declaration --emitDeclarationOnly --declarationMap --verbose",
|
46
|
+
"declaration:watch": "tsc --build --force --declaration --emitDeclarationOnly --declarationMap --verbose --watch",
|
40
47
|
"watch": "run-p build:watch css:watch",
|
41
|
-
"build": "run-s css build:vite css",
|
48
|
+
"build": "run-s css build:vite css declaration",
|
42
49
|
"build:web": "vite build --config=vite.config.web.ts --force --mode production",
|
43
50
|
"web": "vite preview --config=vite.config.web.ts --host",
|
44
51
|
"dev:only": "vite --config=vite.config.web.ts --force --mode dev --host",
|
package/tailwind.config.js
CHANGED
@@ -1,11 +1,11 @@
|
|
1
|
-
/** @type {import('tailwindcss').Config} */
|
2
|
-
module.exports = {
|
3
|
-
content: ["./src/**/*.{html,tsx}"],
|
4
|
-
theme: {
|
5
|
-
extend: {
|
6
|
-
|
7
|
-
},
|
8
|
-
},
|
9
|
-
plugins: [],
|
10
|
-
}
|
11
|
-
|
1
|
+
/** @type {import('tailwindcss').Config} */
|
2
|
+
module.exports = {
|
3
|
+
content: ["./src/**/*.{html,tsx}"],
|
4
|
+
theme: {
|
5
|
+
extend: {
|
6
|
+
|
7
|
+
},
|
8
|
+
},
|
9
|
+
plugins: [],
|
10
|
+
}
|
11
|
+
|