@ark-ui/solid - npm Package Compare versions

Comparing version 0.0.0-rc-20221128115758 to 0.0.0-rc-20221128131722

dist/index.cjs.js

@@ -46,6 +46,13 @@ "use strict";
   Tabs: () => Tabs,
+  Tooltip: () => Tooltip,
+  TooltipArrow: () => TooltipArrow,
+  TooltipContent: () => TooltipContent,
+  TooltipInnerArrow: () => TooltipInnerArrow,
+  TooltipPositioner: () => TooltipPositioner,
+  TooltipTrigger: () => TooltipTrigger,
   useAccordion: () => useAccordion,
   useAccordionItemContext: () => useAccordionItemContext,
   usePinInput: () => usePinInput,
-  useTabs: () => useTabs
+  useTabs: () => useTabs,
+  useTooltip: () => useTooltip
 });
@@ -368,2 +375,79 @@ module.exports = __toCommonJS(src_exports);
 };
+
+// src/tooltip/tooltip-context.tsx
+var [TooltipProvider, useTooltipContext] = createContext({
+  hookName: "useTooltipContext",
+  providerName: "<TooltipProvider />"
+});
+
+// src/tooltip/use-tooltip.ts
+var import_solid6 = require("@zag-js/solid");
+var tooltip = __toESM(require("@zag-js/tooltip"));
+var import_solid_js11 = require("solid-js");
+var useTooltip = (props) => {
+  const context = (0, import_solid_js11.mergeProps)({ id: (0, import_solid_js11.createUniqueId)() }, props);
+  const [state, send] = (0, import_solid6.useMachine)(tooltip.machine(context), { context });
+  return (0, import_solid_js11.createMemo)(() => tooltip.connect(state, send, import_solid6.normalizeProps));
+};
+
+// src/tooltip/tooltip.tsx
+var Tooltip = (props) => {
+  const [useTooltipProps, rest] = createSplitProps()(props, [
+    "aria-label",
+    "closeDelay",
+    "closeOnEsc",
+    "closeOnPointerDown",
+    "disabled",
+    "getRootNode",
+    "ids",
+    "id",
+    "interactive",
+    "onClose",
+    "onOpen",
+    "openDelay",
+    "positioning"
+  ]);
+  const tooltip2 = useTooltip(useTooltipProps);
+  return <TooltipProvider value={tooltip2} {...rest} />;
+};
+
+// src/tooltip/tooltip-arrow.tsx
+var TooltipArrow = (props) => {
+  const tooltip2 = useTooltipContext();
+  return <ark.div {...tooltip2().arrowProps} {...props} />;
+};
+
+// src/tooltip/tooltip-content.tsx
+var TooltipContent = (props) => {
+  const tooltip2 = useTooltipContext();
+  return <ark.div {...tooltip2().contentProps} {...props} />;
+};
+
+// src/tooltip/tooltip-inner-arrow.tsx
+var TooltipInnerArrow = (props) => {
+  const tooltip2 = useTooltipContext();
+  return <ark.div {...tooltip2().innerArrowProps} {...props} />;
+};
+
+// src/tooltip/tooltip-positioner.tsx
+var import_solid_js12 = require("solid-js");
+var TooltipPositioner = (props) => {
+  const tooltip2 = useTooltipContext();
+  return <import_solid_js12.Show when={tooltip2().isOpen}><ark.div {...tooltip2().positionerProps} {...props} /></import_solid_js12.Show>;
+};
+
+// src/tooltip/tooltip-trigger.tsx
+var import_solid_js13 = require("solid-js");
+var import_web = require("solid-js/web");
+var TooltipTrigger = (props) => {
+  const tooltip2 = useTooltipContext();
+  const getChildren = (0, import_solid_js13.children)(() => props.children);
+  (0, import_solid_js13.createEffect)(() => {
+    const children2 = getChildren();
+    if (children2 instanceof Element) {
+      (0, import_web.spread)(children2, tooltip2().triggerProps);
+    }
+  });
+  return <>{getChildren()}</>;
+};
 // Annotate the CommonJS export names for ESM import in node:
@@ -388,6 +472,13 @@ 0 && (module.exports = {
   Tabs,
+  Tooltip,
+  TooltipArrow,
+  TooltipContent,
+  TooltipInnerArrow,
+  TooltipPositioner,
+  TooltipTrigger,
   useAccordion,
   useAccordionItemContext,
   usePinInput,
-  useTabs
+  useTabs,
+  useTooltip
 });

dist/index.d.ts

@@ -9,2 +9,4 @@ import * as solid_js from 'solid-js';
 import { connect } from '@zag-js/tabs';
+import { JSX as JSX$1 } from 'solid-js/jsx-runtime';
+import * as tooltip from '@zag-js/tooltip';
 
@@ -164,2 +166,43 @@ type HTMLArkProps<T extends keyof JSX.IntrinsicElements> = HTMLPolymorphicProps<T>;
 
-export { Accordion, AccordionButton, AccordionButtonProps, AccordionIcon, AccordionIconProps, AccordionItem, AccordionItemContext, AccordionItemProps, AccordionPanel, AccordionPanelProps, AccordionProps, NumberInput, NumberInputDecrementButton, NumberInputDecrementButtonProps, NumberInputField, NumberInputFieldProps, NumberInputIncrementButton, NumberInputIncrementButtonProps, NumberInputProps, PinInput, PinInputField, PinInputFieldProps, PinInputProps, Tab, TabIndicator, TabIndicatorProps, TabList, TabListProps, TabPanel, TabPanelProps, TabPanels, TabPanelsProps, TabProps, Tabs, TabsProps, UseAccordionProps, UseAccordionReturn, UsePinInputProps, UsePinInputReturn, UseTabsProps, UseTabsReturn, useAccordion, useAccordionItemContext, usePinInput, useTabs };
+type UseTooltipProps = Optional<tooltip.Context, 'id'>;
+type UseTooltipReturn = ReturnType<typeof useTooltip>;
+declare const useTooltip: (props: UseTooltipProps) => solid_js.Accessor<{
+    isOpen: boolean;
+    open(): void;
+    close(): void;
+    getAnimationState(): {
+        enter: boolean;
+        exit: boolean;
+    };
+    triggerProps: solid_js.JSX.ButtonHTMLAttributes<HTMLButtonElement>;
+    arrowProps: solid_js.JSX.HTMLAttributes<any>;
+    innerArrowProps: solid_js.JSX.HTMLAttributes<any>;
+    positionerProps: solid_js.JSX.HTMLAttributes<any>;
+    contentProps: solid_js.JSX.HTMLAttributes<any>;
+    labelProps: solid_js.JSX.HTMLAttributes<any>;
+    createPortal(): HTMLElement;
+}>;
+
+type TooltipProps = UseTooltipProps & {
+    children: JSX$1.Element;
+};
+declare const Tooltip: (props: TooltipProps) => JSX$1.Element;
+
+type TooltipArrowProps = HTMLArkProps<'div'>;
+declare const TooltipArrow: (props: TooltipArrowProps) => solid_js.JSX.Element;
+
+type TooltipContentProps = HTMLArkProps<'div'>;
+declare const TooltipContent: (props: TooltipContentProps) => solid_js.JSX.Element;
+
+type TooltipInnerArrowProps = HTMLArkProps<'div'>;
+declare const TooltipInnerArrow: (props: TooltipInnerArrowProps) => solid_js.JSX.Element;
+
+type TooltipPositionerProps = HTMLArkProps<'div'>;
+declare const TooltipPositioner: (props: TooltipPositionerProps) => solid_js.JSX.Element;
+
+type TooltipTriggerProps = {
+    children: JSX$1.Element;
+};
+declare const TooltipTrigger: (props: TooltipTriggerProps) => JSX$1.Element;
+
+export { Accordion, AccordionButton, AccordionButtonProps, AccordionIcon, AccordionIconProps, AccordionItem, AccordionItemContext, AccordionItemProps, AccordionPanel, AccordionPanelProps, AccordionProps, NumberInput, NumberInputDecrementButton, NumberInputDecrementButtonProps, NumberInputField, NumberInputFieldProps, NumberInputIncrementButton, NumberInputIncrementButtonProps, NumberInputProps, PinInput, PinInputField, PinInputFieldProps, PinInputProps, Tab, TabIndicator, TabIndicatorProps, TabList, TabListProps, TabPanel, TabPanelProps, TabPanels, TabPanelsProps, TabProps, Tabs, TabsProps, Tooltip, TooltipArrow, TooltipArrowProps, TooltipContent, TooltipContentProps, TooltipInnerArrow, TooltipInnerArrowProps, TooltipPositioner, TooltipPositionerProps, TooltipProps, TooltipTrigger, TooltipTriggerProps, UseAccordionProps, UseAccordionReturn, UsePinInputProps, UsePinInputReturn, UseTabsProps, UseTabsReturn, UseTooltipProps, UseTooltipReturn, useAccordion, useAccordionItemContext, usePinInput, useTabs, useTooltip };

dist/index.esm.js

@@ -320,2 +320,79 @@ // src/accordion/accordion.tsx
 };
+
+// src/tooltip/tooltip-context.tsx
+var [TooltipProvider, useTooltipContext] = createContext({
+  hookName: "useTooltipContext",
+  providerName: "<TooltipProvider />"
+});
+
+// src/tooltip/use-tooltip.ts
+import { normalizeProps as normalizeProps5, useMachine as useMachine5 } from "@zag-js/solid";
+import * as tooltip from "@zag-js/tooltip";
+import { createMemo as createMemo5, createUniqueId as createUniqueId5, mergeProps as mergeProps5 } from "solid-js";
+var useTooltip = (props) => {
+  const context = mergeProps5({ id: createUniqueId5() }, props);
+  const [state, send] = useMachine5(tooltip.machine(context), { context });
+  return createMemo5(() => tooltip.connect(state, send, normalizeProps5));
+};
+
+// src/tooltip/tooltip.tsx
+var Tooltip = (props) => {
+  const [useTooltipProps, rest] = createSplitProps()(props, [
+    "aria-label",
+    "closeDelay",
+    "closeOnEsc",
+    "closeOnPointerDown",
+    "disabled",
+    "getRootNode",
+    "ids",
+    "id",
+    "interactive",
+    "onClose",
+    "onOpen",
+    "openDelay",
+    "positioning"
+  ]);
+  const tooltip2 = useTooltip(useTooltipProps);
+  return <TooltipProvider value={tooltip2} {...rest} />;
+};
+
+// src/tooltip/tooltip-arrow.tsx
+var TooltipArrow = (props) => {
+  const tooltip2 = useTooltipContext();
+  return <ark.div {...tooltip2().arrowProps} {...props} />;
+};
+
+// src/tooltip/tooltip-content.tsx
+var TooltipContent = (props) => {
+  const tooltip2 = useTooltipContext();
+  return <ark.div {...tooltip2().contentProps} {...props} />;
+};
+
+// src/tooltip/tooltip-inner-arrow.tsx
+var TooltipInnerArrow = (props) => {
+  const tooltip2 = useTooltipContext();
+  return <ark.div {...tooltip2().innerArrowProps} {...props} />;
+};
+
+// src/tooltip/tooltip-positioner.tsx
+import { Show } from "solid-js";
+var TooltipPositioner = (props) => {
+  const tooltip2 = useTooltipContext();
+  return <Show when={tooltip2().isOpen}><ark.div {...tooltip2().positionerProps} {...props} /></Show>;
+};
+
+// src/tooltip/tooltip-trigger.tsx
+import { children, createEffect } from "solid-js";
+import { spread } from "solid-js/web";
+var TooltipTrigger = (props) => {
+  const tooltip2 = useTooltipContext();
+  const getChildren = children(() => props.children);
+  createEffect(() => {
+    const children2 = getChildren();
+    if (children2 instanceof Element) {
+      spread(children2, tooltip2().triggerProps);
+    }
+  });
+  return <>{getChildren()}</>;
+};
 export {
@@ -339,6 +416,13 @@ Accordion,
   Tabs,
+  Tooltip,
+  TooltipArrow,
+  TooltipContent,
+  TooltipInnerArrow,
+  TooltipPositioner,
+  TooltipTrigger,
   useAccordion,
   useAccordionItemContext,
   usePinInput,
-  useTabs
+  useTabs,
+  useTooltip
 };

package.json

 {
   "name": "@ark-ui/solid",
-  "version": "0.0.0-rc-20221128115758",
+  "version": "0.0.0-rc-20221128131722",
   "description": "",
@@ -5,0 +5,0 @@ "keywords": [],

No alert changes

Improved metrics

Total package byte prevSize

39306

increased by22.61%

Lines of code

1006

increased by24.2%

No dependency changes