@kushagradhawan/kookie-ui 0.1.71 → 0.1.72

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 (96) hide show
  1. package/README.md +4 -0
  2. package/components.css +63 -380
  3. package/dist/cjs/components/_internal/base-button.d.ts.map +1 -1
  4. package/dist/cjs/components/_internal/base-button.js +1 -1
  5. package/dist/cjs/components/_internal/base-button.js.map +3 -3
  6. package/dist/cjs/components/button.d.ts.map +1 -1
  7. package/dist/cjs/components/button.js +1 -1
  8. package/dist/cjs/components/button.js.map +3 -3
  9. package/dist/cjs/components/chatbar.d.ts.map +1 -1
  10. package/dist/cjs/components/chatbar.js.map +2 -2
  11. package/dist/cjs/components/icon-button.d.ts.map +1 -1
  12. package/dist/cjs/components/icon-button.js +2 -2
  13. package/dist/cjs/components/icon-button.js.map +3 -3
  14. package/dist/cjs/components/shell.d.ts.map +1 -1
  15. package/dist/cjs/components/shell.js +1 -1
  16. package/dist/cjs/components/shell.js.map +3 -3
  17. package/dist/cjs/components/toggle-button.d.ts.map +1 -1
  18. package/dist/cjs/components/toggle-button.js +1 -1
  19. package/dist/cjs/components/toggle-button.js.map +3 -3
  20. package/dist/cjs/components/toggle-icon-button.d.ts.map +1 -1
  21. package/dist/cjs/components/toggle-icon-button.js +1 -1
  22. package/dist/cjs/components/toggle-icon-button.js.map +3 -3
  23. package/dist/cjs/hooks/index.d.ts +2 -0
  24. package/dist/cjs/hooks/index.d.ts.map +1 -1
  25. package/dist/cjs/hooks/index.js +1 -1
  26. package/dist/cjs/hooks/index.js.map +3 -3
  27. package/dist/cjs/hooks/use-live-announcer.d.ts.map +1 -1
  28. package/dist/cjs/hooks/use-live-announcer.js +2 -2
  29. package/dist/cjs/hooks/use-live-announcer.js.map +3 -3
  30. package/dist/cjs/hooks/use-toggle-state.d.ts +37 -0
  31. package/dist/cjs/hooks/use-toggle-state.d.ts.map +1 -0
  32. package/dist/cjs/hooks/use-toggle-state.js +2 -0
  33. package/dist/cjs/hooks/use-toggle-state.js.map +7 -0
  34. package/dist/cjs/hooks/use-tooltip-wrapper.d.ts +29 -0
  35. package/dist/cjs/hooks/use-tooltip-wrapper.d.ts.map +1 -0
  36. package/dist/cjs/hooks/use-tooltip-wrapper.js +2 -0
  37. package/dist/cjs/hooks/use-tooltip-wrapper.js.map +7 -0
  38. package/dist/esm/components/_internal/base-button.d.ts.map +1 -1
  39. package/dist/esm/components/_internal/base-button.js +1 -1
  40. package/dist/esm/components/_internal/base-button.js.map +3 -3
  41. package/dist/esm/components/button.d.ts.map +1 -1
  42. package/dist/esm/components/button.js +1 -1
  43. package/dist/esm/components/button.js.map +3 -3
  44. package/dist/esm/components/chatbar.d.ts.map +1 -1
  45. package/dist/esm/components/chatbar.js.map +2 -2
  46. package/dist/esm/components/icon-button.d.ts.map +1 -1
  47. package/dist/esm/components/icon-button.js +2 -2
  48. package/dist/esm/components/icon-button.js.map +3 -3
  49. package/dist/esm/components/shell.d.ts.map +1 -1
  50. package/dist/esm/components/shell.js +1 -1
  51. package/dist/esm/components/shell.js.map +3 -3
  52. package/dist/esm/components/toggle-button.d.ts.map +1 -1
  53. package/dist/esm/components/toggle-button.js +1 -1
  54. package/dist/esm/components/toggle-button.js.map +3 -3
  55. package/dist/esm/components/toggle-icon-button.d.ts.map +1 -1
  56. package/dist/esm/components/toggle-icon-button.js +1 -1
  57. package/dist/esm/components/toggle-icon-button.js.map +3 -3
  58. package/dist/esm/hooks/index.d.ts +2 -0
  59. package/dist/esm/hooks/index.d.ts.map +1 -1
  60. package/dist/esm/hooks/index.js +1 -1
  61. package/dist/esm/hooks/index.js.map +3 -3
  62. package/dist/esm/hooks/use-live-announcer.d.ts.map +1 -1
  63. package/dist/esm/hooks/use-live-announcer.js +2 -2
  64. package/dist/esm/hooks/use-live-announcer.js.map +3 -3
  65. package/dist/esm/hooks/use-toggle-state.d.ts +37 -0
  66. package/dist/esm/hooks/use-toggle-state.d.ts.map +1 -0
  67. package/dist/esm/hooks/use-toggle-state.js +2 -0
  68. package/dist/esm/hooks/use-toggle-state.js.map +7 -0
  69. package/dist/esm/hooks/use-tooltip-wrapper.d.ts +29 -0
  70. package/dist/esm/hooks/use-tooltip-wrapper.d.ts.map +1 -0
  71. package/dist/esm/hooks/use-tooltip-wrapper.js +2 -0
  72. package/dist/esm/hooks/use-tooltip-wrapper.js.map +7 -0
  73. package/package.json +4 -4
  74. package/schemas/base-button.json +1 -1
  75. package/schemas/button.json +1 -1
  76. package/schemas/icon-button.json +1 -1
  77. package/schemas/index.json +6 -6
  78. package/schemas/toggle-button.json +1 -1
  79. package/schemas/toggle-icon-button.json +1 -1
  80. package/src/components/_internal/base-button.css +136 -614
  81. package/src/components/_internal/base-button.tsx +15 -13
  82. package/src/components/button.tsx +13 -42
  83. package/src/components/chatbar.tsx +1 -13
  84. package/src/components/icon-button.tsx +20 -44
  85. package/src/components/image.css +10 -8
  86. package/src/components/shell.tsx +13 -9
  87. package/src/components/toggle-button.tsx +30 -59
  88. package/src/components/toggle-icon-button.tsx +29 -51
  89. package/src/hooks/index.ts +2 -0
  90. package/src/hooks/use-live-announcer.ts +34 -7
  91. package/src/hooks/use-toggle-state.ts +72 -0
  92. package/src/hooks/use-tooltip-wrapper.ts +28 -0
  93. package/src/styles/tokens/color.css +11 -1
  94. package/styles.css +70 -381
  95. package/tokens/base.css +7 -1
  96. package/tokens.css +7 -1
@@ -1,4 +1,4 @@
1
- import*as n from"react";function o(){return n.useEffect(()=>{let e=document.getElementById("rt-live-announcer");return e||(e=document.createElement("div"),e.id="rt-live-announcer",e.setAttribute("aria-live","polite"),e.setAttribute("aria-atomic","true"),e.style.cssText=`
1
+ import*as i from"react";let o=0;function u(){const n=i.useRef(void 0);return i.useEffect(()=>{let e=document.getElementById("rt-live-announcer");return e||(e=document.createElement("div"),e.id="rt-live-announcer",e.setAttribute("aria-live","polite"),e.setAttribute("aria-atomic","true"),e.style.cssText=`
2
2
  position: absolute;
3
3
  left: -10000px;
4
4
  width: 1px;
@@ -6,5 +6,5 @@ import*as n from"react";function o(){return n.useEffect(()=>{let e=document.getE
6
6
  overflow: hidden;
7
7
  clip: rect(0, 0, 0, 0);
8
8
  white-space: nowrap;
9
- `,document.body.appendChild(e)),()=>{e&&!e.hasChildNodes()&&e.remove()}},[]),n.useCallback(e=>{const t=document.getElementById("rt-live-announcer");t&&(t.textContent="",setTimeout(()=>{t.textContent=e},100))},[])}export{o as useLiveAnnouncer};
9
+ `,document.body.appendChild(e)),o++,()=>{if(o--,n.current&&clearTimeout(n.current),o===0){const t=document.getElementById("rt-live-announcer");t&&t.remove()}}},[]),i.useCallback(e=>{const t=document.getElementById("rt-live-announcer");t&&(n.current&&clearTimeout(n.current),t.textContent="",n.current=setTimeout(()=>{t.textContent=e},100))},[])}export{u as useLiveAnnouncer};
10
10
  //# sourceMappingURL=use-live-announcer.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/hooks/use-live-announcer.ts"],
4
- "sourcesContent": ["import * as React from 'react';\n\n/**\n * Hook for making live announcements to screen readers\n * Creates a hidden aria-live region for announcing dynamic content changes\n */\nexport function useLiveAnnouncer() {\n\n // Create aria-live region if it doesn't exist\n React.useEffect(() => {\n let liveRegion = document.getElementById('rt-live-announcer');\n \n if (!liveRegion) {\n liveRegion = document.createElement('div');\n liveRegion.id = 'rt-live-announcer';\n liveRegion.setAttribute('aria-live', 'polite');\n liveRegion.setAttribute('aria-atomic', 'true');\n liveRegion.style.cssText = `\n position: absolute;\n left: -10000px;\n width: 1px;\n height: 1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n `;\n document.body.appendChild(liveRegion);\n }\n\n return () => {\n // Clean up on unmount if no other components are using it\n if (liveRegion && !liveRegion.hasChildNodes()) {\n liveRegion.remove();\n }\n };\n }, []);\n\n const announce = React.useCallback((message: string) => {\n const liveRegion = document.getElementById('rt-live-announcer');\n if (liveRegion) {\n // Clear previous announcements\n liveRegion.textContent = '';\n \n // Add new announcement with a small delay to ensure it's announced\n setTimeout(() => {\n liveRegion.textContent = message;\n }, 100);\n }\n }, []);\n\n return announce;\n} "],
5
- "mappings": "AAAA,UAAYA,MAAW,QAMhB,SAASC,GAAmB,CAGjC,OAAAD,EAAM,UAAU,IAAM,CACpB,IAAIE,EAAa,SAAS,eAAe,mBAAmB,EAE5D,OAAKA,IACHA,EAAa,SAAS,cAAc,KAAK,EACzCA,EAAW,GAAK,oBAChBA,EAAW,aAAa,YAAa,QAAQ,EAC7CA,EAAW,aAAa,cAAe,MAAM,EAC7CA,EAAW,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAS3B,SAAS,KAAK,YAAYA,CAAU,GAG/B,IAAM,CAEPA,GAAc,CAACA,EAAW,cAAc,GAC1CA,EAAW,OAAO,CAEtB,CACF,EAAG,CAAC,CAAC,EAEYF,EAAM,YAAaG,GAAoB,CACtD,MAAMD,EAAa,SAAS,eAAe,mBAAmB,EAC1DA,IAEFA,EAAW,YAAc,GAGzB,WAAW,IAAM,CACfA,EAAW,YAAcC,CAC3B,EAAG,GAAG,EAEV,EAAG,CAAC,CAAC,CAGP",
6
- "names": ["React", "useLiveAnnouncer", "liveRegion", "message"]
4
+ "sourcesContent": ["import * as React from 'react';\n\n/**\n * Reference counter to track how many components are using the live region.\n * Only remove the live region when no components are using it.\n */\nlet liveRegionRefCount = 0;\n\n/**\n * Hook for making live announcements to screen readers\n * Creates a hidden aria-live region for announcing dynamic content changes\n */\nexport function useLiveAnnouncer() {\n // Track the timeout so we can clean it up on unmount\n const timeoutRef = React.useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n\n // Create aria-live region if it doesn't exist\n React.useEffect(() => {\n let liveRegion = document.getElementById('rt-live-announcer');\n\n if (!liveRegion) {\n liveRegion = document.createElement('div');\n liveRegion.id = 'rt-live-announcer';\n liveRegion.setAttribute('aria-live', 'polite');\n liveRegion.setAttribute('aria-atomic', 'true');\n liveRegion.style.cssText = `\n position: absolute;\n left: -10000px;\n width: 1px;\n height: 1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n `;\n document.body.appendChild(liveRegion);\n }\n\n // Increment ref count when component mounts\n liveRegionRefCount++;\n\n return () => {\n // Decrement ref count when component unmounts\n liveRegionRefCount--;\n\n // Clean up timeout on unmount\n if (timeoutRef.current) {\n clearTimeout(timeoutRef.current);\n }\n\n // Only remove the live region if no components are using it\n if (liveRegionRefCount === 0) {\n const region = document.getElementById('rt-live-announcer');\n if (region) {\n region.remove();\n }\n }\n };\n }, []);\n\n const announce = React.useCallback((message: string) => {\n const liveRegion = document.getElementById('rt-live-announcer');\n if (liveRegion) {\n // Clear any pending timeout\n if (timeoutRef.current) {\n clearTimeout(timeoutRef.current);\n }\n\n // Clear previous announcements\n liveRegion.textContent = '';\n\n // Add new announcement with a small delay to ensure it's announced\n timeoutRef.current = setTimeout(() => {\n liveRegion.textContent = message;\n }, 100);\n }\n }, []);\n\n return announce;\n}\n"],
5
+ "mappings": "AAAA,UAAYA,MAAW,QAMvB,IAAIC,EAAqB,EAMlB,SAASC,GAAmB,CAEjC,MAAMC,EAAaH,EAAM,OAAkD,MAAS,EAGpF,OAAAA,EAAM,UAAU,IAAM,CACpB,IAAII,EAAa,SAAS,eAAe,mBAAmB,EAE5D,OAAKA,IACHA,EAAa,SAAS,cAAc,KAAK,EACzCA,EAAW,GAAK,oBAChBA,EAAW,aAAa,YAAa,QAAQ,EAC7CA,EAAW,aAAa,cAAe,MAAM,EAC7CA,EAAW,MAAM,QAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAS3B,SAAS,KAAK,YAAYA,CAAU,GAItCH,IAEO,IAAM,CAUX,GARAA,IAGIE,EAAW,SACb,aAAaA,EAAW,OAAO,EAI7BF,IAAuB,EAAG,CAC5B,MAAMI,EAAS,SAAS,eAAe,mBAAmB,EACtDA,GACFA,EAAO,OAAO,CAElB,CACF,CACF,EAAG,CAAC,CAAC,EAEYL,EAAM,YAAaM,GAAoB,CACtD,MAAMF,EAAa,SAAS,eAAe,mBAAmB,EAC1DA,IAEED,EAAW,SACb,aAAaA,EAAW,OAAO,EAIjCC,EAAW,YAAc,GAGzBD,EAAW,QAAU,WAAW,IAAM,CACpCC,EAAW,YAAcE,CAC3B,EAAG,GAAG,EAEV,EAAG,CAAC,CAAC,CAGP",
6
+ "names": ["React", "liveRegionRefCount", "useLiveAnnouncer", "timeoutRef", "liveRegion", "region", "message"]
7
7
  }
@@ -0,0 +1,37 @@
1
+ /**
2
+ * Options for the useToggleState hook
3
+ */
4
+ interface UseToggleStateOptions {
5
+ /** Controlled pressed state */
6
+ pressed?: boolean;
7
+ /** Callback when pressed state changes */
8
+ onPressedChange?: (pressed: boolean) => void;
9
+ /** Function to get the accessible name for announcements */
10
+ getAccessibleName: () => string;
11
+ /** Component name for warning messages */
12
+ componentName: string;
13
+ }
14
+ /**
15
+ * Hook for shared toggle button state management.
16
+ * Provides accessibility announcements and controlled/uncontrolled warnings.
17
+ *
18
+ * @param options - Configuration options for the toggle state
19
+ * @returns Object containing the handlePressedChange callback
20
+ *
21
+ * @example
22
+ * ```tsx
23
+ * const getAccessibleName = React.useCallback(() => 'Toggle button', []);
24
+ *
25
+ * const { handlePressedChange } = useToggleState({
26
+ * pressed,
27
+ * onPressedChange,
28
+ * getAccessibleName,
29
+ * componentName: 'ToggleButton',
30
+ * });
31
+ * ```
32
+ */
33
+ export declare function useToggleState({ pressed, onPressedChange, getAccessibleName, componentName }: UseToggleStateOptions): {
34
+ handlePressedChange: (newPressed: boolean) => void;
35
+ };
36
+ export {};
37
+ //# sourceMappingURL=use-toggle-state.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"use-toggle-state.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-toggle-state.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,UAAU,qBAAqB;IAC7B,+BAA+B;IAC/B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,0CAA0C;IAC1C,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,4DAA4D;IAC5D,iBAAiB,EAAE,MAAM,MAAM,CAAC;IAChC,0CAA0C;IAC1C,aAAa,EAAE,MAAM,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,cAAc,CAAC,EAAE,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,aAAa,EAAE,EAAE,qBAAqB;sCAWnG,OAAO;EAwBvB"}
@@ -0,0 +1,2 @@
1
+ import*as n from"react";import{useLiveAnnouncer as i}from"./use-live-announcer.js";function p({pressed:r,onPressedChange:e,getAccessibleName:o,componentName:a}){const s=i(),l=n.useRef(!1),d=n.useCallback(t=>{const u=o();s(`${u} ${t?"pressed":"unpressed"}`),e?.(t)},[s,e,o]);return n.useEffect(()=>{},[r,e,a]),{handlePressedChange:d}}export{p as useToggleState};
2
+ //# sourceMappingURL=use-toggle-state.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../src/hooks/use-toggle-state.ts"],
4
+ "sourcesContent": ["import * as React from 'react';\nimport { useLiveAnnouncer } from './use-live-announcer.js';\n\n/**\n * Options for the useToggleState hook\n */\ninterface UseToggleStateOptions {\n /** Controlled pressed state */\n pressed?: boolean;\n /** Callback when pressed state changes */\n onPressedChange?: (pressed: boolean) => void;\n /** Function to get the accessible name for announcements */\n getAccessibleName: () => string;\n /** Component name for warning messages */\n componentName: string;\n}\n\n/**\n * Hook for shared toggle button state management.\n * Provides accessibility announcements and controlled/uncontrolled warnings.\n *\n * @param options - Configuration options for the toggle state\n * @returns Object containing the handlePressedChange callback\n *\n * @example\n * ```tsx\n * const getAccessibleName = React.useCallback(() => 'Toggle button', []);\n *\n * const { handlePressedChange } = useToggleState({\n * pressed,\n * onPressedChange,\n * getAccessibleName,\n * componentName: 'ToggleButton',\n * });\n * ```\n */\nexport function useToggleState({ pressed, onPressedChange, getAccessibleName, componentName }: UseToggleStateOptions) {\n const announce = useLiveAnnouncer();\n\n // Track if we've already warned about controlled without handler\n const warnedRef = React.useRef(false);\n\n /**\n * Memoized handler for state changes with accessibility announcements.\n * Announces the new state immediately for screen readers.\n */\n const handlePressedChange = React.useCallback(\n (newPressed: boolean) => {\n const accessibleName = getAccessibleName();\n // Announce the state change for screen readers\n announce(`${accessibleName} ${newPressed ? 'pressed' : 'unpressed'}`);\n // Call the user's change handler\n onPressedChange?.(newPressed);\n },\n [announce, onPressedChange, getAccessibleName],\n );\n\n // Development-only warning for controlled/uncontrolled pattern\n // Only warns once to avoid console spam\n React.useEffect(() => {\n if (process.env.NODE_ENV === 'development' && pressed !== undefined && onPressedChange === undefined && !warnedRef.current) {\n warnedRef.current = true;\n console.warn(\n `${componentName}: You provided a \\`pressed\\` prop without an \\`onPressedChange\\` handler. ` +\n 'This will result in a read-only toggle button. If you want the button to be interactive, ' +\n 'you should provide an `onPressedChange` handler.',\n );\n }\n }, [pressed, onPressedChange, componentName]);\n\n return { handlePressedChange };\n}\n"],
5
+ "mappings": "AAAA,UAAYA,MAAW,QACvB,OAAS,oBAAAC,MAAwB,0BAmC1B,SAASC,EAAe,CAAE,QAAAC,EAAS,gBAAAC,EAAiB,kBAAAC,EAAmB,cAAAC,CAAc,EAA0B,CACpH,MAAMC,EAAWN,EAAiB,EAG5BO,EAAYR,EAAM,OAAO,EAAK,EAM9BS,EAAsBT,EAAM,YAC/BU,GAAwB,CACvB,MAAMC,EAAiBN,EAAkB,EAEzCE,EAAS,GAAGI,CAAc,IAAID,EAAa,UAAY,WAAW,EAAE,EAEpEN,IAAkBM,CAAU,CAC9B,EACA,CAACH,EAAUH,EAAiBC,CAAiB,CAC/C,EAIA,OAAAL,EAAM,UAAU,IAAM,CAStB,EAAG,CAACG,EAASC,EAAiBE,CAAa,CAAC,EAErC,CAAE,oBAAAG,CAAoB,CAC/B",
6
+ "names": ["React", "useLiveAnnouncer", "useToggleState", "pressed", "onPressedChange", "getAccessibleName", "componentName", "announce", "warnedRef", "handlePressedChange", "newPressed", "accessibleName"]
7
+ }
@@ -0,0 +1,29 @@
1
+ import * as React from 'react';
2
+ /**
3
+ * Hook for managing tooltip accessibility props and conditional rendering.
4
+ * Encapsulates tooltip ID generation and aria-describedby binding.
5
+ *
6
+ * @param tooltip - The tooltip content (if any)
7
+ * @returns Object containing tooltipId, hasTooltip flag, and accessibility props
8
+ *
9
+ * @example
10
+ * ```tsx
11
+ * const { tooltipId, hasTooltip, accessibilityProps } = useTooltipWrapper(tooltip);
12
+ *
13
+ * const button = <button {...accessibilityProps}>Click me</button>;
14
+ *
15
+ * if (!hasTooltip) return button;
16
+ *
17
+ * return <Tooltip id={tooltipId} content={tooltip}>{button}</Tooltip>;
18
+ * ```
19
+ */
20
+ export declare function useTooltipWrapper(tooltip: React.ReactNode): {
21
+ tooltipId: string;
22
+ hasTooltip: boolean;
23
+ accessibilityProps: {
24
+ 'aria-describedby': string;
25
+ } | {
26
+ 'aria-describedby'?: undefined;
27
+ };
28
+ };
29
+ //# sourceMappingURL=use-tooltip-wrapper.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"use-tooltip-wrapper.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-tooltip-wrapper.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,KAAK,CAAC,SAAS;;;;;;;;EAOzD"}
@@ -0,0 +1,2 @@
1
+ import*as t from"react";function c(s){const o=t.useId(),e=!!s,a=t.useMemo(()=>e?{"aria-describedby":o}:{},[e,o]);return{tooltipId:o,hasTooltip:e,accessibilityProps:a}}export{c as useTooltipWrapper};
2
+ //# sourceMappingURL=use-tooltip-wrapper.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../src/hooks/use-tooltip-wrapper.ts"],
4
+ "sourcesContent": ["import * as React from 'react';\n\n/**\n * Hook for managing tooltip accessibility props and conditional rendering.\n * Encapsulates tooltip ID generation and aria-describedby binding.\n *\n * @param tooltip - The tooltip content (if any)\n * @returns Object containing tooltipId, hasTooltip flag, and accessibility props\n *\n * @example\n * ```tsx\n * const { tooltipId, hasTooltip, accessibilityProps } = useTooltipWrapper(tooltip);\n *\n * const button = <button {...accessibilityProps}>Click me</button>;\n *\n * if (!hasTooltip) return button;\n *\n * return <Tooltip id={tooltipId} content={tooltip}>{button}</Tooltip>;\n * ```\n */\nexport function useTooltipWrapper(tooltip: React.ReactNode) {\n const tooltipId = React.useId();\n const hasTooltip = Boolean(tooltip);\n\n const accessibilityProps = React.useMemo(() => (hasTooltip ? { 'aria-describedby': tooltipId } : {}), [hasTooltip, tooltipId]);\n\n return { tooltipId, hasTooltip, accessibilityProps };\n}\n"],
5
+ "mappings": "AAAA,UAAYA,MAAW,QAoBhB,SAASC,EAAkBC,EAA0B,CAC1D,MAAMC,EAAYH,EAAM,MAAM,EACxBI,EAAa,EAAQF,EAErBG,EAAqBL,EAAM,QAAQ,IAAOI,EAAa,CAAE,mBAAoBD,CAAU,EAAI,CAAC,EAAI,CAACC,EAAYD,CAAS,CAAC,EAE7H,MAAO,CAAE,UAAAA,EAAW,WAAAC,EAAY,mBAAAC,CAAmB,CACrD",
6
+ "names": ["React", "useTooltipWrapper", "tooltip", "tooltipId", "hasTooltip", "accessibilityProps"]
7
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kushagradhawan/kookie-ui",
3
- "version": "0.1.71",
3
+ "version": "0.1.72",
4
4
  "description": "A modern React component library with beautiful design tokens, flexible theming, and comprehensive docs",
5
5
  "keywords": [
6
6
  "react",
@@ -193,12 +193,12 @@
193
193
  "typescript-eslint": "^8.18.1",
194
194
  "vitest": "^2.1.9"
195
195
  },
196
- "homepage": "https://github.com/kushagradhawan/kookie-ui",
196
+ "homepage": "https://github.com/KushagraDhawan1997/kookie-ui",
197
197
  "repository": {
198
198
  "type": "git",
199
- "url": "git+https://github.com/kushagradhawan/kookie-ui.git"
199
+ "url": "git+https://github.com/KushagraDhawan1997/kookie-ui.git"
200
200
  },
201
201
  "bugs": {
202
- "url": "https://github.com/kushagradhawan/kookie-ui/issues"
202
+ "url": "https://github.com/KushagraDhawan1997/kookie-ui/issues"
203
203
  }
204
204
  }
@@ -279,6 +279,6 @@
279
279
  "title": "Base-button Component Props",
280
280
  "description": "Props schema for the base-button component in Kookie UI",
281
281
  "version": "1.0.0",
282
- "generatedAt": "2025-12-08T07:51:01.509Z",
282
+ "generatedAt": "2025-12-23T11:05:44.037Z",
283
283
  "source": "Zod schema"
284
284
  }
@@ -530,6 +530,6 @@
530
530
  "title": "Button Component Props",
531
531
  "description": "Props schema for the button component in Kookie UI",
532
532
  "version": "1.0.0",
533
- "generatedAt": "2025-12-08T07:51:01.514Z",
533
+ "generatedAt": "2025-12-23T11:05:44.044Z",
534
534
  "source": "Zod schema"
535
535
  }
@@ -313,6 +313,6 @@
313
313
  "title": "Icon-button Component Props",
314
314
  "description": "Props schema for the icon-button component in Kookie UI",
315
315
  "version": "1.0.0",
316
- "generatedAt": "2025-12-08T07:51:01.515Z",
316
+ "generatedAt": "2025-12-23T11:05:44.045Z",
317
317
  "source": "Zod schema"
318
318
  }
@@ -3,7 +3,7 @@
3
3
  "title": "Kookie UI Button Components",
4
4
  "description": "Complete JSON Schema collection for all button components in Kookie UI",
5
5
  "version": "1.0.0",
6
- "generatedAt": "2025-12-08T07:51:01.518Z",
6
+ "generatedAt": "2025-12-23T11:05:44.048Z",
7
7
  "source": "Zod schemas",
8
8
  "components": {
9
9
  "base-button": {
@@ -287,7 +287,7 @@
287
287
  "title": "Base-button Component Props",
288
288
  "description": "Props schema for the base-button component in Kookie UI",
289
289
  "version": "1.0.0",
290
- "generatedAt": "2025-12-08T07:51:01.509Z",
290
+ "generatedAt": "2025-12-23T11:05:44.037Z",
291
291
  "source": "Zod schema"
292
292
  },
293
293
  "button": {
@@ -822,7 +822,7 @@
822
822
  "title": "Button Component Props",
823
823
  "description": "Props schema for the button component in Kookie UI",
824
824
  "version": "1.0.0",
825
- "generatedAt": "2025-12-08T07:51:01.514Z",
825
+ "generatedAt": "2025-12-23T11:05:44.044Z",
826
826
  "source": "Zod schema"
827
827
  },
828
828
  "icon-button": {
@@ -1140,7 +1140,7 @@
1140
1140
  "title": "Icon-button Component Props",
1141
1141
  "description": "Props schema for the icon-button component in Kookie UI",
1142
1142
  "version": "1.0.0",
1143
- "generatedAt": "2025-12-08T07:51:01.515Z",
1143
+ "generatedAt": "2025-12-23T11:05:44.045Z",
1144
1144
  "source": "Zod schema"
1145
1145
  },
1146
1146
  "toggle-button": {
@@ -1683,7 +1683,7 @@
1683
1683
  "title": "Toggle-button Component Props",
1684
1684
  "description": "Props schema for the toggle-button component in Kookie UI",
1685
1685
  "version": "1.0.0",
1686
- "generatedAt": "2025-12-08T07:51:01.517Z",
1686
+ "generatedAt": "2025-12-23T11:05:44.047Z",
1687
1687
  "source": "Zod schema"
1688
1688
  },
1689
1689
  "toggle-icon-button": {
@@ -2009,7 +2009,7 @@
2009
2009
  "title": "Toggle-icon-button Component Props",
2010
2010
  "description": "Props schema for the toggle-icon-button component in Kookie UI",
2011
2011
  "version": "1.0.0",
2012
- "generatedAt": "2025-12-08T07:51:01.518Z",
2012
+ "generatedAt": "2025-12-23T11:05:44.048Z",
2013
2013
  "source": "Zod schema"
2014
2014
  }
2015
2015
  }
@@ -538,6 +538,6 @@
538
538
  "title": "Toggle-button Component Props",
539
539
  "description": "Props schema for the toggle-button component in Kookie UI",
540
540
  "version": "1.0.0",
541
- "generatedAt": "2025-12-08T07:51:01.517Z",
541
+ "generatedAt": "2025-12-23T11:05:44.047Z",
542
542
  "source": "Zod schema"
543
543
  }
@@ -321,6 +321,6 @@
321
321
  "title": "Toggle-icon-button Component Props",
322
322
  "description": "Props schema for the toggle-icon-button component in Kookie UI",
323
323
  "version": "1.0.0",
324
- "generatedAt": "2025-12-08T07:51:01.518Z",
324
+ "generatedAt": "2025-12-23T11:05:44.048Z",
325
325
  "source": "Zod schema"
326
326
  }