@remember-web/primitive 0.3.6 → 0.4.0

package/dist/src/hooks/useMouseEventAway.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMouseEventAway.cjs.js","sources":["../../../src/hooks/useMouseEventAway.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\ntype MouseEventNames = Extract<\n  keyof DocumentEventMap,\n  `mouse${string}` | `pointer${string}` | `touch${string}` | 'click'\n>;\n\nexport default function useMouseEventAway<\n  T extends HTMLElement,\n  E extends MouseEventNames,\n>(eventName: E, callback: (e: DocumentEventMap[E]) => void) {\n  const ref = useRef<T | null>(null);\n  const callbackRef = useRef(callback);\n  callbackRef.current = callback;\n\n  useEffect(() => {\n    function clickAwayHandler(e: DocumentEventMap[E]) {\n      if (!(e.target instanceof Node)) {\n        return;\n      }\n\n      if (ref.current && !ref.current.contains(e.target)) {\n        callbackRef.current(e);\n      }\n    }\n\n    document.addEventListener(eventName, clickAwayHandler, true);\n\n    return () => {\n      document.removeEventListener(eventName, clickAwayHandler, true);\n    };\n  }, [eventName]);\n\n  return ref;\n}\n"],"names":["useMouseEventAway","eventName","callback","ref","useRef","callbackRef","current","useEffect","clickAwayHandler","e","target","Node","contains","document","addEventListener","removeEventListener"],"mappings":";;;;AAOe,SAASA,iBAAiBA,CAGvCC,SAAY,EAAEC,QAA0C,EAAE;AAC1D,EAAA,IAAMC,GAAG,GAAGC,YAAM,CAAW,IAAI,CAAC,CAAA;AAClC,EAAA,IAAMC,WAAW,GAAGD,YAAM,CAACF,QAAQ,CAAC,CAAA;EACpCG,WAAW,CAACC,OAAO,GAAGJ,QAAQ,CAAA;AAE9BK,EAAAA,eAAS,CAAC,YAAM;IACd,SAASC,gBAAgBA,CAACC,CAAsB,EAAE;AAChD,MAAA,IAAI,EAAEA,CAAC,CAACC,MAAM,YAAYC,IAAI,CAAC,EAAE;AAC/B,QAAA,OAAA;AACF,OAAA;AAEA,MAAA,IAAIR,GAAG,CAACG,OAAO,IAAI,CAACH,GAAG,CAACG,OAAO,CAACM,QAAQ,CAACH,CAAC,CAACC,MAAM,CAAC,EAAE;AAClDL,QAAAA,WAAW,CAACC,OAAO,CAACG,CAAC,CAAC,CAAA;AACxB,OAAA;AACF,KAAA;IAEAI,QAAQ,CAACC,gBAAgB,CAACb,SAAS,EAAEO,gBAAgB,EAAE,IAAI,CAAC,CAAA;AAE5D,IAAA,OAAO,YAAM;MACXK,QAAQ,CAACE,mBAAmB,CAACd,SAAS,EAAEO,gBAAgB,EAAE,IAAI,CAAC,CAAA;KAChE,CAAA;AACH,GAAC,EAAE,CAACP,SAAS,CAAC,CAAC,CAAA;AAEf,EAAA,OAAOE,GAAG,CAAA;AACZ;;;;"}
+{"version":3,"file":"useMouseEventAway.cjs.js","sources":["../../../src/hooks/useMouseEventAway.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\ntype MouseEventNames = Extract<\n  keyof DocumentEventMap,\n  `mouse${string}` | `pointer${string}` | `touch${string}` | 'click'\n>;\n\nexport default function useMouseEventAway<\n  T extends HTMLElement,\n  E extends MouseEventNames,\n>(eventName: E, callback: (e: DocumentEventMap[E]) => void) {\n  const ref = useRef<T | null>(null);\n  const callbackRef = useRef(callback);\n  callbackRef.current = callback;\n\n  useEffect(() => {\n    function clickAwayHandler(e: DocumentEventMap[E]) {\n      if (!(e.target instanceof Node)) {\n        return;\n      }\n\n      if (ref.current && !ref.current.contains(e.target)) {\n        callbackRef.current(e);\n      }\n    }\n\n    document.addEventListener(eventName, clickAwayHandler, true);\n\n    return () => {\n      document.removeEventListener(eventName, clickAwayHandler, true);\n    };\n  }, [eventName]);\n\n  return ref;\n}\n"],"names":["useMouseEventAway","eventName","callback","ref","useRef","callbackRef","current","useEffect","clickAwayHandler","e","target","Node","contains","document","addEventListener","removeEventListener"],"mappings":";;;;AAOe,SAASA,iBAAiBA,CAGvCC,SAAY,EAAEC,QAA0C,EAAE;AAC1D,EAAA,IAAMC,GAAG,GAAGC,YAAM,CAAW,IAAI,CAAC;AAClC,EAAA,IAAMC,WAAW,GAAGD,YAAM,CAACF,QAAQ,CAAC;EACpCG,WAAW,CAACC,OAAO,GAAGJ,QAAQ;AAE9BK,EAAAA,eAAS,CAAC,YAAM;IACd,SAASC,gBAAgBA,CAACC,CAAsB,EAAE;AAChD,MAAA,IAAI,EAAEA,CAAC,CAACC,MAAM,YAAYC,IAAI,CAAC,EAAE;AAC/B,QAAA;AACF;AAEA,MAAA,IAAIR,GAAG,CAACG,OAAO,IAAI,CAACH,GAAG,CAACG,OAAO,CAACM,QAAQ,CAACH,CAAC,CAACC,MAAM,CAAC,EAAE;AAClDL,QAAAA,WAAW,CAACC,OAAO,CAACG,CAAC,CAAC;AACxB;AACF;IAEAI,QAAQ,CAACC,gBAAgB,CAACb,SAAS,EAAEO,gBAAgB,EAAE,IAAI,CAAC;AAE5D,IAAA,OAAO,YAAM;MACXK,QAAQ,CAACE,mBAAmB,CAACd,SAAS,EAAEO,gBAAgB,EAAE,IAAI,CAAC;KAChE;AACH,GAAC,EAAE,CAACP,SAAS,CAAC,CAAC;AAEf,EAAA,OAAOE,GAAG;AACZ;;;;"}

package/dist/src/hooks/useMouseEventAway.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMouseEventAway.esm.js","sources":["../../../src/hooks/useMouseEventAway.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\ntype MouseEventNames = Extract<\n  keyof DocumentEventMap,\n  `mouse${string}` | `pointer${string}` | `touch${string}` | 'click'\n>;\n\nexport default function useMouseEventAway<\n  T extends HTMLElement,\n  E extends MouseEventNames,\n>(eventName: E, callback: (e: DocumentEventMap[E]) => void) {\n  const ref = useRef<T | null>(null);\n  const callbackRef = useRef(callback);\n  callbackRef.current = callback;\n\n  useEffect(() => {\n    function clickAwayHandler(e: DocumentEventMap[E]) {\n      if (!(e.target instanceof Node)) {\n        return;\n      }\n\n      if (ref.current && !ref.current.contains(e.target)) {\n        callbackRef.current(e);\n      }\n    }\n\n    document.addEventListener(eventName, clickAwayHandler, true);\n\n    return () => {\n      document.removeEventListener(eventName, clickAwayHandler, true);\n    };\n  }, [eventName]);\n\n  return ref;\n}\n"],"names":["useMouseEventAway","eventName","callback","ref","useRef","callbackRef","current","useEffect","clickAwayHandler","e","target","Node","contains","document","addEventListener","removeEventListener"],"mappings":";;AAOe,SAASA,iBAAiBA,CAGvCC,SAAY,EAAEC,QAA0C,EAAE;AAC1D,EAAA,IAAMC,GAAG,GAAGC,MAAM,CAAW,IAAI,CAAC,CAAA;AAClC,EAAA,IAAMC,WAAW,GAAGD,MAAM,CAACF,QAAQ,CAAC,CAAA;EACpCG,WAAW,CAACC,OAAO,GAAGJ,QAAQ,CAAA;AAE9BK,EAAAA,SAAS,CAAC,YAAM;IACd,SAASC,gBAAgBA,CAACC,CAAsB,EAAE;AAChD,MAAA,IAAI,EAAEA,CAAC,CAACC,MAAM,YAAYC,IAAI,CAAC,EAAE;AAC/B,QAAA,OAAA;AACF,OAAA;AAEA,MAAA,IAAIR,GAAG,CAACG,OAAO,IAAI,CAACH,GAAG,CAACG,OAAO,CAACM,QAAQ,CAACH,CAAC,CAACC,MAAM,CAAC,EAAE;AAClDL,QAAAA,WAAW,CAACC,OAAO,CAACG,CAAC,CAAC,CAAA;AACxB,OAAA;AACF,KAAA;IAEAI,QAAQ,CAACC,gBAAgB,CAACb,SAAS,EAAEO,gBAAgB,EAAE,IAAI,CAAC,CAAA;AAE5D,IAAA,OAAO,YAAM;MACXK,QAAQ,CAACE,mBAAmB,CAACd,SAAS,EAAEO,gBAAgB,EAAE,IAAI,CAAC,CAAA;KAChE,CAAA;AACH,GAAC,EAAE,CAACP,SAAS,CAAC,CAAC,CAAA;AAEf,EAAA,OAAOE,GAAG,CAAA;AACZ;;;;"}
+{"version":3,"file":"useMouseEventAway.esm.js","sources":["../../../src/hooks/useMouseEventAway.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\ntype MouseEventNames = Extract<\n  keyof DocumentEventMap,\n  `mouse${string}` | `pointer${string}` | `touch${string}` | 'click'\n>;\n\nexport default function useMouseEventAway<\n  T extends HTMLElement,\n  E extends MouseEventNames,\n>(eventName: E, callback: (e: DocumentEventMap[E]) => void) {\n  const ref = useRef<T | null>(null);\n  const callbackRef = useRef(callback);\n  callbackRef.current = callback;\n\n  useEffect(() => {\n    function clickAwayHandler(e: DocumentEventMap[E]) {\n      if (!(e.target instanceof Node)) {\n        return;\n      }\n\n      if (ref.current && !ref.current.contains(e.target)) {\n        callbackRef.current(e);\n      }\n    }\n\n    document.addEventListener(eventName, clickAwayHandler, true);\n\n    return () => {\n      document.removeEventListener(eventName, clickAwayHandler, true);\n    };\n  }, [eventName]);\n\n  return ref;\n}\n"],"names":["useMouseEventAway","eventName","callback","ref","useRef","callbackRef","current","useEffect","clickAwayHandler","e","target","Node","contains","document","addEventListener","removeEventListener"],"mappings":";;AAOe,SAASA,iBAAiBA,CAGvCC,SAAY,EAAEC,QAA0C,EAAE;AAC1D,EAAA,IAAMC,GAAG,GAAGC,MAAM,CAAW,IAAI,CAAC;AAClC,EAAA,IAAMC,WAAW,GAAGD,MAAM,CAACF,QAAQ,CAAC;EACpCG,WAAW,CAACC,OAAO,GAAGJ,QAAQ;AAE9BK,EAAAA,SAAS,CAAC,YAAM;IACd,SAASC,gBAAgBA,CAACC,CAAsB,EAAE;AAChD,MAAA,IAAI,EAAEA,CAAC,CAACC,MAAM,YAAYC,IAAI,CAAC,EAAE;AAC/B,QAAA;AACF;AAEA,MAAA,IAAIR,GAAG,CAACG,OAAO,IAAI,CAACH,GAAG,CAACG,OAAO,CAACM,QAAQ,CAACH,CAAC,CAACC,MAAM,CAAC,EAAE;AAClDL,QAAAA,WAAW,CAACC,OAAO,CAACG,CAAC,CAAC;AACxB;AACF;IAEAI,QAAQ,CAACC,gBAAgB,CAACb,SAAS,EAAEO,gBAAgB,EAAE,IAAI,CAAC;AAE5D,IAAA,OAAO,YAAM;MACXK,QAAQ,CAACE,mBAAmB,CAACd,SAAS,EAAEO,gBAAgB,EAAE,IAAI,CAAC;KAChE;AACH,GAAC,EAAE,CAACP,SAAS,CAAC,CAAC;AAEf,EAAA,OAAOE,GAAG;AACZ;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remember-web/primitive",
-  "version": "0.3.6",
+  "version": "0.4.0",
   "description": "Remember Web Primitive Components",
   "homepage": "https://dramancompany.github.io/remember-web-packages/",
   "author": "Remember",
@@ -41,7 +41,7 @@
     "@radix-ui/react-separator": "^1.0.3",
     "@radix-ui/react-switch": "^1.0.3",
     "@radix-ui/react-tooltip": "^1.0.7",
-    "@remember-web/icon": "^0.3.0",
+    "@remember-web/icon": "^0.3.5",
     "@remember-web/mixin": "^0.2.6",
     "@remember-web/shared": "^0.1.1"
   },
@@ -53,15 +53,13 @@
     "@babel/preset-react": "^7.24.1",
     "@babel/preset-typescript": "^7.24.1",
     "@rollup/plugin-babel": "^6.0.4",
-    "@rollup/plugin-commonjs": "^25.0.7",
-    "@rollup/plugin-node-resolve": "^15.2.3",
-    "@storybook/client-api": "^7.6.17",
-    "@storybook/react": "^7.6.17",
+    "@rollup/plugin-commonjs": "^28.0.6",
+    "@rollup/plugin-node-resolve": "^16.0.1",
     "@types/react": "^18.2.77",
     "@types/react-dom": "^18.2.25",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "rollup": "^4.14.1",
+    "rollup": "^4.44.1",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-plugin-preserve-directives": "^0.4.0",
     "rollup-plugin-typescript2": "^0.36.0",

package/src/Avatars/Avatar/Avatar.stories.tsx

@@ -1,5 +1,5 @@
 import { bg200, contents999, roleBlue } from '@remember-web/mixin';
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 
 import { avatarSize } from '@/Avatars/Avatar/styles';
 

package/src/Badge/Badge.stories.tsx

@@ -1,4 +1,4 @@
-import type { StoryObj } from '@storybook/react';
+import type { StoryObj } from '@storybook/react-vite';
 import styled from 'styled-components';
 
 import { Badge } from '@/Badge/Badge';

package/src/Buttons/Button/Button.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 import { createElement } from 'react';
 
 import {

package/src/Buttons/Button/const.ts

@@ -6,28 +6,32 @@ import type { ButtonSize, ButtonVariant } from './types';
 
 export const BUTTON_SIZES = {
   small: {
-    typography: 'Caption1',
+    typography: 'UIBody3',
     height: '32px',
     minWidth: '68px',
-    padding: '0 16px',
+    padding: '0 12px',
+    radius: '6px',
   },
   medium: {
-    typography: 'UIBody3',
-    height: '36px',
+    typography: 'UIBody2',
+    height: '38px',
     minWidth: '78px',
-    padding: '0 20px',
+    padding: '0 12px',
+    radius: '6px',
   },
   large: {
     typography: 'UIBody2',
     height: '44px',
     minWidth: '108px',
-    padding: '0 20px',
+    padding: '0 16px',
+    radius: '6px',
   },
   xLarge: {
-    typography: 'UIBody2',
+    typography: 'UIBody1',
     height: '52px',
     minWidth: '116px',
     padding: '0 24px',
+    radius: '8px',
   },
 } as const satisfies Record<ButtonSize, unknown>;
 

package/src/Buttons/Button/styles.ts

@@ -41,7 +41,7 @@ export const StyledButton = styled.button<ButtonStyleProps>(
       min-width: ${BUTTON_SIZES[$size].minWidth};
       height: ${BUTTON_SIZES[$size].height};
       padding: ${BUTTON_SIZES[$size].padding};
-      border-radius: 4px;
+      border-radius: ${BUTTON_SIZES[$size].radius};
 
       color: ${
         (props.$variant.startsWith('outline') ? $color : null) ??

package/src/Chips/Chip/Chip.stories.tsx

@@ -3,7 +3,7 @@ import {
   iconNames,
   isIconName,
 } from '@/stories/util';
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 import { Fragment, createElement } from 'react';
 
 import { Typography } from '@/Common';

package/src/Common/Divider/Divider.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 
 import {Flex} from '../Flex';
 import { Divider } from './index';

package/src/Common/Skeleton/Skeleton.stories.tsx

@@ -1,6 +1,6 @@
 import { Skeleton } from '@/Common/Skeleton';
 import { divider } from '@remember-web/mixin';
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 
 
 

package/src/Common/Spinner/Spinner.stories.tsx

@@ -1,5 +1,5 @@
 import { divider } from '@remember-web/mixin';
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 
 import { Spinner } from './index';
 

package/src/Common/Typography/Typography.stories.tsx

@@ -1,6 +1,6 @@
 import type { TypographyStyle } from '@remember-web/mixin';
 import { TYPOGRAPHY_STYLES } from '@remember-web/mixin';
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 import { renderToStaticMarkup } from 'react-dom/server';
 
 import {

package/src/Control/Checkbox.stories.tsx

@@ -1,5 +1,5 @@
-import { useArgs } from '@storybook/client-api';
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { useArgs } from 'storybook/preview-api';
 
 import { Checkbox } from './Checkbox';
 

package/src/Control/Radio.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 
 import { useState } from 'react';
 import { Radio } from './Radio';

package/src/Control/Switch/Switch.stories.tsx

@@ -1,5 +1,5 @@
-import { useArgs } from '@storybook/client-api';
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { useArgs } from 'storybook/preview-api';
 
 import { Switch } from '.';
 

package/src/Control/Toggle.stories.tsx

@@ -1,5 +1,5 @@
-import { useArgs } from '@storybook/client-api';
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { useArgs } from 'storybook/preview-api';
 
 import { Toggle } from './Toggle';
 

package/src/Floating/DropdownMenu/DropdownMenu.stories.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable react-hooks/rules-of-hooks */
 /* eslint-disable no-console */
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 import { useRef, useState } from 'react';
 
 import { Flex } from '@/Common';

package/src/Floating/Popover/Popover.stories.tsx

@@ -1,5 +1,5 @@
 /* eslint-disable no-console */
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 
 import { Flex } from '@/Common';
 import Popover from '@/Floating/Popover/index';

package/src/Floating/Tooltip/Tooltip.stories.tsx

@@ -1,5 +1,5 @@
 import { IconAlarm } from '@remember-web/icon';
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 
 import { Button } from '@/Buttons';
 import { Flex } from '@/Common';

package/src/Inputs/Select/Select.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 import { useState } from 'react';
 
 import type { DesignedSelectProps, NativeSelectProps } from './types';

package/src/Inputs/TextInput/TextInput.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 import { createElement } from 'react';
 
 import {

package/src/Labels/Label/Label.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 
 import { Flex } from '@/Common';
 import { Select, TextInput } from '@/Inputs';

package/src/Logos/RememberLogo/RememberLogo.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 
 import { RememberLogo } from './index';
 

package/src/Logos/RememberMobileLogo/RememberMobileLogo.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 
 import { RememberMobileLogo } from '.';
 

package/src/Logos/RememberServiceLogo/RememberServiceLogo.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 
 import { RememberServiceLogo } from '.';
 

package/src/Logos/RememberSquareLogo/RememberSquareLogo.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 
 import { RememberSquareLogo } from '.';
 

package/src/Modals/Dialog/Dialog.stories.tsx

@@ -1,5 +1,5 @@
 /* eslint-disable no-console */
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 
 import { Button } from '@/Buttons';
 import { Flex } from '@/Common';

package/src/Paginations/CompactPagination/CompactPagination.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 import { useState } from 'react';
 
 import { CompactPagination } from '.';

package/src/Paginations/Pagination/Pagination.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react-vite';
 import { useState } from 'react';
 
 import { Pagination } from '.';