@hopper-ui/components 0.1.0 → 1.0.0

package/dist/utils/src/useRenderProps.js

@@ -0,0 +1,2 @@
+export { useRenderProps } from '../../chunk-NH3IVMXB.js';
+import '../../chunk-YSQDPG26.js';

package/dist/utils/src/useSlot.d.ts

@@ -0,0 +1,8 @@
+import { RefCallback } from 'react';
+
+/**
+* Taken from https://github.com/adobe/react-spectrum/blob/main/packages/react-aria-components/src/utils.tsx
+*/
+declare function useSlot(): [RefCallback<Element>, boolean];
+
+export { useSlot };

package/dist/utils/src/useSlot.js

@@ -0,0 +1,2 @@
+export { useSlot } from '../../chunk-H5YTU3U7.js';
+import '../../chunk-YSQDPG26.js';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@hopper-ui/components",
   "author": "Workleap",
-  "version": "0.1.0",
+  "version": "1.0.0",
   "description": "The components package.",
   "license": "Apache-2.0",
   "repository": {
@@ -32,43 +32,48 @@
     "README.md"
   ],
   "peerDependencies": {
-    "react": "*",
-    "react-dom": "*",
-    "@hopper-ui/styled-system": "*",
+    "@hopper-ui/styled-system": "^2.0.0",
+    "react": "^18",
+    "react-aria": "^3.32",
     "react-aria-components": "^1.1.0",
-    "react-aria": "^3.32.0"
+    "react-dom": "^18"
   },
   "dependencies": {
-    "clsx": "^2.1.0",
-    "@hopper-ui/icons": "1.5.0"
+    "@react-aria/utils": "^3.24.0",
+    "@react-types/shared": "^3.23.0",
+    "clsx": "^2.1.1",
+    "@hopper-ui/icons": "2.0.0"
   },
   "devDependencies": {
-    "@swc/core": "1.3.106",
-    "@swc/helpers": "0.5.3",
-    "@swc/jest": "0.2.31",
-    "@testing-library/jest-dom": "6.3.0",
-    "@testing-library/react": "14.1.2",
+    "@swc/core": "1.5.3",
+    "@swc/helpers": "0.5.11",
+    "@swc/jest": "0.2.36",
+    "@testing-library/jest-dom": "6.4.5",
+    "@testing-library/react": "15.0.7",
     "@testing-library/user-event": "14.5.2",
-    "@types/jest": "29.5.11",
-    "@types/react": "18.2.48",
-    "@types/react-dom": "18.2.18",
-    "@types/react-test-renderer": "18.0.7",
-    "@workleap/eslint-plugin": "3.0.0",
-    "@workleap/swc-configs": "2.1.2",
-    "@workleap/tsup-configs": "3.0.1",
+    "@types/jest": "29.5.12",
+    "@types/react": "18.3.1",
+    "@types/react-dom": "18.3.0",
+    "@types/react-test-renderer": "18.3.0",
+    "@workleap/eslint-plugin": "3.2.2",
+    "@workleap/swc-configs": "2.2.3",
+    "@workleap/tsup-configs": "3.0.6",
     "@workleap/typescript-configs": "3.0.2",
+    "eslint": "8.57.0",
     "identity-obj-proxy": "3.0.0",
     "jest": "29.7.0",
     "jest-environment-jsdom": "29.7.0",
-    "react": "18.2.0",
-    "react-aria": "3.32.1",
-    "react-aria-components": "1.1.0",
-    "react-dom": "18.2.0",
-    "react-test-renderer": "18.2.0",
+    "jest-fail-on-console": "3.2.0",
+    "jest-fetch-mock": "3.0.3",
+    "react": "18.3.1",
+    "react-aria": "3.33.0",
+    "react-aria-components": "1.2.0",
+    "react-dom": "18.3.1",
+    "react-test-renderer": "18.3.1",
     "ts-jest": "29.1.2",
-    "tsup": "8.0.1",
-    "typescript": "5.3.3",
-    "@hopper-ui/styled-system": "1.0.0"
+    "tsup": "8.0.2",
+    "typescript": "5.4.5",
+    "@hopper-ui/styled-system": "2.0.0"
   },
   "scripts": {
     "dev": "tsup --config ./tsup.dev.ts",

package/dist/chunk-GXUPEV64.js

@@ -1,24 +0,0 @@
-import { useLocalizedStringFormatter } from 'react-aria';
-
-// src/intl/src/useLocalizedString.tsx
-
-// src/intl/intl/en-US.json
-var en_US_default = {
-  "button.pending": "pending"
-};
-
-// src/intl/intl/fr-CA.json
-var fr_CA_default = {
-  "button.pending": "en attente"
-};
-
-// src/intl/src/useLocalizedString.tsx
-var Resources = {
-  "en-US": en_US_default,
-  "fr-CA": fr_CA_default
-};
-function useLocalizedString() {
-  return useLocalizedStringFormatter(Resources, "@hopper-ui/components");
-}
-
-export { useLocalizedString };

package/dist/chunk-WROQHGG5.js

@@ -1,141 +0,0 @@
-import { isTextOnlyChildren } from './chunk-7QUHQYCR.js';
-import { useLocalizedString } from './chunk-GXUPEV64.js';
-import { _Spinner } from './chunk-QIOYM2XJ.js';
-import { composeClassnameRenderProps } from './chunk-SEU4CGZD.js';
-import { _Text } from './chunk-WRWNRVTG.js';
-import { TextContext } from './chunk-OE5BLFZI.js';
-import { ButtonContext } from './chunk-WMTWFKKP.js';
-import { SlotProvider } from './chunk-M36KANKC.js';
-import { IconListContext } from './chunk-DHVVYSLB.js';
-import { cssModule } from './chunk-6BEVZRUL.js';
-import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
-import { forwardRef } from 'react';
-import { useContextProps, composeRenderProps, Button as Button$1 } from 'react-aria-components';
-import { useId } from 'react-aria';
-import { IconContext } from '@hopper-ui/icons';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-
-// src/buttons/src/Button.module.css
-var Button_default = {};
-var GlobalButtonCssSelector = "hop-Button";
-var DefaultButtonSlot = "button";
-var Button = (props, ref) => {
-  [props, ref] = useContextProps({ ...props, slot: props.slot || DefaultButtonSlot }, ref, ButtonContext);
-  const { stylingProps, ...ownProps } = useStyledSystem(props);
-  const stringFormatter = useLocalizedString();
-  const {
-    className,
-    children: childrenProp,
-    size: sizeProp = "md",
-    fluid: fluidProp,
-    variant = "primary",
-    onClick,
-    onPress: onPressProp,
-    isDisabled,
-    isLoading,
-    style: styleProp,
-    ...otherProps
-  } = ownProps;
-  if (onPressProp && onClick) {
-    console.warn("[Hopper] The onClick prop is an alias for onPress and should not be used in conjunction with it. Use one or the other.");
-  }
-  const onPress = onPressProp != null ? onPressProp : onClick;
-  const isInteractionDisabled = isDisabled || isLoading;
-  const size = useResponsiveValue(sizeProp);
-  const fluid = useResponsiveValue(fluidProp);
-  const classNames = composeClassnameRenderProps(
-    className,
-    GlobalButtonCssSelector,
-    cssModule(
-      Button_default,
-      "hop-button",
-      variant,
-      size,
-      fluid && "fluid",
-      isLoading && "loading"
-    ),
-    stylingProps.className
-  );
-  const children = composeRenderProps(childrenProp, (prev) => {
-    if (isTextOnlyChildren(prev)) {
-      return /* @__PURE__ */ jsx(_Text, { children: prev });
-    }
-    return prev;
-  });
-  const style = composeRenderProps(styleProp, (prev) => {
-    return {
-      ...stylingProps.style,
-      ...prev
-    };
-  });
-  const spinnerId = useId();
-  const hasAriaLabel = !!props["aria-label"] || !!props["aria-labelledby"];
-  const isLoadingAriaLiveLabel = `${hasAriaLabel ? props["aria-label"] : ""} ${stringFormatter.format("button.pending")}`.trim();
-  return /* @__PURE__ */ jsx(
-    SlotProvider,
-    {
-      values: [
-        [IconListContext, {
-          slots: {
-            icon: {
-              className: Button_default["hop-button__icon-list"]
-            },
-            "end-icon": {
-              className: Button_default["hop-button__end-icon-list"]
-            }
-          }
-        }],
-        [IconContext, {
-          slots: {
-            icon: {
-              className: Button_default["hop-button__icon"],
-              size: "md"
-            },
-            "end-icon": {
-              className: Button_default["hop-button__end-icon"],
-              size: "md"
-            }
-          }
-        }],
-        [TextContext, {
-          slots: {
-            text: {
-              className: Button_default["hop-button__text"],
-              size
-            }
-          }
-        }]
-      ],
-      children: /* @__PURE__ */ jsx(
-        Button$1,
-        {
-          ref,
-          className: classNames,
-          style,
-          "data-loading": isLoading,
-          onPress,
-          isDisabled: isInteractionDisabled,
-          ...otherProps,
-          children: (buttonProps) => {
-            return /* @__PURE__ */ jsxs(Fragment, { children: [
-              children(buttonProps),
-              isLoading && /* @__PURE__ */ jsx(
-                _Spinner,
-                {
-                  id: spinnerId,
-                  size: "lg",
-                  "aria-label": isLoadingAriaLiveLabel,
-                  className: Button_default["hop-button__Spinner"]
-                }
-              )
-            ] });
-          }
-        }
-      )
-    }
-  );
-};
-var _Button = forwardRef(Button);
-_Button.displayName = "Button";
-
-export { GlobalButtonCssSelector, _Button };

package/dist/chunk-WRWNRVTG.js

@@ -1,47 +0,0 @@
-import { TextContext } from './chunk-OE5BLFZI.js';
-import { cssModule } from './chunk-6BEVZRUL.js';
-import { useStyledSystem, useResponsiveValue } from '@hopper-ui/styled-system';
-import { forwardRef } from 'react';
-import { useContextProps, Text as Text$1 } from 'react-aria-components';
-import clsx from 'clsx';
-import { jsx } from 'react/jsx-runtime';
-
-// src/Text/src/Text.module.css
-var Text_default = {};
-var GlobalTextCssSelector = "hop-Text";
-var DefaultTextSlot = "text";
-function Text(props, ref) {
-  [props, ref] = useContextProps({ ...props, slot: props.slot || DefaultTextSlot }, ref, TextContext);
-  const { stylingProps, ...ownProps } = useStyledSystem(props);
-  const { className, size: sizeProp, children, style, ...otherProps } = ownProps;
-  const size = useResponsiveValue(sizeProp != null ? sizeProp : "md");
-  const classNames = clsx(
-    GlobalTextCssSelector,
-    cssModule(
-      Text_default,
-      "hop-text",
-      size
-    ),
-    stylingProps.className,
-    className
-  );
-  const mergedStyles = {
-    ...stylingProps.style,
-    ...style
-  };
-  return /* @__PURE__ */ jsx(
-    Text$1,
-    {
-      ...otherProps,
-      ref,
-      elementType: "span",
-      className: classNames,
-      style: mergedStyles,
-      children
-    }
-  );
-}
-var _Text = forwardRef(Text);
-_Text.displayName = "Text";
-
-export { GlobalTextCssSelector, _Text };

package/dist/intl/src/index.js

@@ -1 +0,0 @@
-export { useLocalizedString } from '../../chunk-GXUPEV64.js';

package/dist/intl/src/useLocalizedString.d.ts

@@ -1,26 +0,0 @@
-declare const Resources: {
-    "en-US": {
-        "button.pending": string;
-    };
-    "fr-CA": {
-        "button.pending": string;
-    };
-};
-declare function useLocalizedString(): LocalizedStringFormatter;
-/**
- * LocalizedStringFormatter is not exported from react-aria, so we have to define it here.
- * Without this, the build will fail with the following error:
-* packages/components build:
- * src/intl/src/useLocalizedString.tsx(11,17): error TS2742:
- * The inferred type of 'useLocalizedString' cannot be named without a reference to
- * .pnpm/@internationalized+string@3.2.1/node_modules/@internationalized/string'.
- * This is likely not portable. A type annotation is necessary.
- *
- * I  proposed a PR to export LocalizedStringFormatter from react-aria.
- * https://github.com/adobe/react-spectrum/pull/6014
- */
-interface LocalizedStringFormatter {
-    format: (key: keyof typeof Resources[keyof typeof Resources], variables?: Record<string, string | number | boolean>) => string;
-}
-
-export { useLocalizedString };

package/dist/intl/src/useLocalizedString.js

@@ -1 +0,0 @@
-export { useLocalizedString } from '../../chunk-GXUPEV64.js';

package/dist/utils/src/compose-classname-render-props.js

@@ -1 +0,0 @@
-export { composeClassnameRenderProps } from '../../chunk-SEU4CGZD.js';

package/dist/utils/src/css-module.js

@@ -1 +0,0 @@
-export { cssModule } from '../../chunk-6BEVZRUL.js';

package/dist/utils/src/is-text-only-children.js

@@ -1 +0,0 @@
-export { isTextOnlyChildren } from '../../chunk-7QUHQYCR.js';

package/dist/utils/src/size-adapter.js

@@ -1 +0,0 @@
-import '../../chunk-D57ZIX5W.js';