@class101/cdn-ui-system 0.0.7 → 0.0.11

package/index.js

@@ -1,99 +1,130 @@
-// tools/builders/framer-esm/build/react-shim.js
-import * as React from "react";
-
-// libs/shared/ui-system/src/index.ts
-import {UiSystemProvider} from "./contexts/UiSystemProvider.js";
-import {defaultTheme, signatureTheme} from "./core/index.js";
-import {useResponsiveValue} from "./hooks/useResponsiveValue/index.js";
-import {Accordion} from "./lib/Accordion/index.js";
-import {Action} from "./lib/Action/index.js";
-import {Alert} from "./lib/Alert/index.js";
-import {FadeAnimation} from "./lib/Animation/FadeAnimation/index.js";
-import {SlideAnimation} from "./lib/Animation/SlideAnimation/index.js";
-import {Transition} from "./lib/Animation/Transition/index.js";
-import {Avatar} from "./lib/Avatar/index.js";
-import {Backdrop} from "./lib/Backdrop/index.js";
-import {Background} from "./lib/Background/index.js";
-import {BreadCrumb} from "./lib/BreadCrumb/index.js";
-import {ButtonIcon} from "./lib/Button/ButtonIcon/index.js";
-import {ContainedButton} from "./lib/Button/ContainedButton/index.js";
-import {TextButton} from "./lib/Button/TextButton/index.js";
-import {ConditionalWrapper} from "./lib/ConditionalWrapper/index.js";
-import {Slide} from "./lib/deprecated/Slide/index.js";
-import {Swiper} from "./lib/deprecated/Swiper/index.js";
-import {Divider} from "./lib/Divider/index.js";
-import {Elevation} from "./lib/Elevation/index.js";
-import {CheckBoxField} from "./lib/Form/CheckBoxField/index.js";
-import {Description} from "./lib/Form/Description/index.js";
-import {HiddenInput} from "./lib/Form/HiddenInput/index.js";
-import {Input} from "./lib/Form/Input/index.js";
-import {Label} from "./lib/Form/Label/index.js";
-import {Range} from "./lib/Form/Range/index.js";
-import {Select} from "./lib/Form/Select/index.js";
-import {SelectField} from "./lib/Form/SelectField/index.js";
-import {TextArea} from "./lib/Form/TextArea/index.js";
-import {TextField} from "./lib/Form/TextField/index.js";
-import {TextLabel} from "./lib/Form/TextLabel/index.js";
-import {Frame} from "./lib/Frame/index.js";
-import {GlobalStyle} from "./lib/GlobalStyle/index.js";
-import {GridList} from "./lib/GridList/index.js";
-import {Highlight} from "./lib/Highlight/index.js";
-import {HtmlContentStyle} from "./lib/HtmlContentStyle/index.js";
-import {Icon} from "./lib/Icon/index.js";
-import {Center} from "./lib/Layout/Center/index.js";
-import {HStack} from "./lib/Layout/HStack/index.js";
-import {Position} from "./lib/Layout/Position/index.js";
-import {ResponsiveStack} from "./lib/Layout/ResponsiveStack/index.js";
-import {VStack} from "./lib/Layout/VStack/index.js";
-import {ZStack} from "./lib/Layout/ZStack/index.js";
-import {Link} from "./lib/Link/index.js";
-import {Image} from "./lib/Media/Image/index.js";
-import {SeekBar} from "./lib/Media/SeekBar/index.js";
-import {Video} from "./lib/Media/Video/index.js";
-import {VideoCaption} from "./lib/Media/VideoCaption/index.js";
-import {VideoOverlay} from "./lib/Media/VideoOverlay/index.js";
-import {VolumeBar} from "./lib/Media/VolumeBar/index.js";
-import {Menu} from "./lib/Menu/Menu/index.js";
-import {MenuIcon} from "./lib/Menu/MenuIcon/index.js";
-import {MenuItem} from "./lib/Menu/MenuItem/index.js";
-import {MenuText} from "./lib/Menu/MenuText/index.js";
-import {MenuTextButton} from "./lib/Menu/MenuTextButton/index.js";
-import {MenuTextButtonItem} from "./lib/Menu/MenuTextButtonItem/index.js";
-import {MenuTextItem} from "./lib/Menu/MenuTextItem/index.js";
-import {ModalBottomSheet, useModalBottomSheet} from "./lib/ModalBottomSheet/index.js";
-import {NewLine} from "./lib/NewLine/index.js";
-import {Opacity} from "./lib/Opacity/index.js";
-import {Overlay} from "./lib/Overlay/index.js";
-import {Pagination} from "./lib/Pagination/index.js";
-import {Portal} from "./lib/Portal/index.js";
-import {Profile} from "./lib/Profile/index.js";
-import {ProfileLabel} from "./lib/ProfileLabel/index.js";
-import {ProgressBar} from "./lib/Progress/ProgressBar/index.js";
-import {ProgressStep} from "./lib/Progress/ProgressStep/index.js";
-import {Rank} from "./lib/Rank/index.js";
-import {Ratio} from "./lib/Ratio/index.js";
-import {Section} from "./lib/Section/index.js";
-import {SectionHeader} from "./lib/SectionHeader/index.js";
-import {Skeleton} from "./lib/Skeleton/index.js";
-import {SlideList} from "./lib/SlideList/index.js";
-import {Slider, useSlider} from "./lib/Slider/index.js";
-import {SliderSection} from "./lib/SliderSection/index.js";
-import {Spinner} from "./lib/Spinner/index.js";
-import {ScrollTabPanel} from "./lib/Tab/ScrollTabPanel/index.js";
-import {ScrollTabs} from "./lib/Tab/ScrollTabs/index.js";
-import {ViewPagerTabPanel} from "./lib/Tab/ViewPagerTabPanel/index.js";
-import {ViewPagerTabs} from "./lib/Tab/ViewPagerTabs/index.js";
-import {Chip} from "./lib/Tag/Chip/index.js";
-import {IconBadge} from "./lib/Tag/IconBadge/index.js";
-import {StateTag} from "./lib/Tag/StateTag/index.js";
-import {Tag} from "./lib/Tag/Tag/index.js";
-import {Body} from "./lib/Typography/Body/index.js";
-import {Caption} from "./lib/Typography/Caption/index.js";
-import {Paragraph} from "./lib/Typography/Paragraph/index.js";
-import {Title} from "./lib/Typography/Title/index.js";
-import {Underline} from "./lib/Underline/index.js";
-import {ViewPager} from "./lib/ViewPager/index.js";
-import {ViewPagerItem} from "./lib/ViewPagerItem/index.js";
+import {
+  Accordion,
+  Action,
+  Alert,
+  Avatar,
+  Backdrop,
+  Background,
+  BackgroundImage,
+  Body,
+  BreadCrumb,
+  BulletPagination,
+  Callout,
+  CardNumberField,
+  Center,
+  CheckBoxField,
+  Chip,
+  ConditionalWrapper,
+  ContainedButton,
+  ContentArea,
+  Description,
+  Divider,
+  Dot,
+  Drawer,
+  Elevation,
+  FadeAnimation,
+  FilterChip,
+  GhostButton,
+  GlobalStyle,
+  GridList,
+  HStack,
+  HiddenInput,
+  Highlight,
+  HtmlContentStyle,
+  Icon,
+  IconBadge,
+  Image,
+  ImageThumbnail,
+  Input,
+  InputChip,
+  Label,
+  LinearGradient,
+  Link,
+  Linkify,
+  List,
+  Menu,
+  MenuIcon,
+  MenuItem,
+  MenuText,
+  MenuTextButton,
+  MenuTextButtonItem,
+  MenuTextItem,
+  ModalBottomSheet,
+  NewLine,
+  Opacity,
+  Overlay,
+  Pagination,
+  Paper,
+  Paragraph,
+  PopoverBottomSheet,
+  Portal,
+  Position,
+  Profile,
+  ProfileLabel,
+  ProgressBar,
+  ProgressStep,
+  Radio,
+  RadioField,
+  RadioGroupField,
+  Range,
+  Rank,
+  Ratio,
+  ResponsiveStack,
+  SafeAreaContent,
+  Scroll,
+  ScrollTabPanel,
+  ScrollTabs,
+  ScrollTarget,
+  SearchInput,
+  Section,
+  SectionHeader,
+  SeekBar,
+  Select,
+  SelectField,
+  Skeleton,
+  Slide,
+  SlideAnimation,
+  SlideList,
+  Slider,
+  SliderSection,
+  Space,
+  Spinner,
+  StateTag,
+  Svg,
+  Swiper,
+  Tab,
+  Table,
+  Tag,
+  TextArea,
+  TextAreaField,
+  TextButton,
+  TextField,
+  TextInput,
+  TextLabel,
+  Title,
+  Tooltip,
+  Transition,
+  UiSystemProvider,
+  Underline,
+  VStack,
+  Video,
+  VideoCaption,
+  VideoOverlay,
+  ViewPager,
+  ViewPagerItem,
+  ViewPagerTabPanel,
+  ViewPagerTabs,
+  VirtualizedList,
+  VolumeBar,
+  ZStack,
+  defaultTheme,
+  signatureTheme,
+  useIsMobile,
+  useModalBottomSheet,
+  useResponsiveValue,
+  useSliderState
+} from "./chunk-SU3NURQK.js";
+import "./chunk-VIIHQGZ3.js";
 export {
   Accordion,
   Action,
@@ -101,20 +132,26 @@ export {
   Avatar,
   Backdrop,
   Background,
+  BackgroundImage,
   Body,
   BreadCrumb,
-  ButtonIcon,
-  Caption,
+  BulletPagination,
+  Callout,
+  CardNumberField,
   Center,
   CheckBoxField,
   Chip,
   ConditionalWrapper,
   ContainedButton,
+  ContentArea,
   Description,
   Divider,
+  Dot,
+  Drawer,
   Elevation,
   FadeAnimation,
-  Frame,
+  FilterChip,
+  GhostButton,
   GlobalStyle,
   GridList,
   HStack,
@@ -124,9 +161,14 @@ export {
   Icon,
   IconBadge,
   Image,
+  ImageThumbnail,
   Input,
+  InputChip,
   Label,
+  LinearGradient,
   Link,
+  Linkify,
+  List,
   Menu,
   MenuIcon,
   MenuItem,
@@ -139,19 +181,28 @@ export {
   Opacity,
   Overlay,
   Pagination,
+  Paper,
   Paragraph,
+  PopoverBottomSheet,
   Portal,
   Position,
   Profile,
   ProfileLabel,
   ProgressBar,
   ProgressStep,
+  Radio,
+  RadioField,
+  RadioGroupField,
   Range,
   Rank,
   Ratio,
   ResponsiveStack,
+  SafeAreaContent,
+  Scroll,
   ScrollTabPanel,
   ScrollTabs,
+  ScrollTarget,
+  SearchInput,
   Section,
   SectionHeader,
   SeekBar,
@@ -163,15 +214,22 @@ export {
   SlideList,
   Slider,
   SliderSection,
+  Space,
   Spinner,
   StateTag,
+  Svg,
   Swiper,
+  Tab,
+  Table,
   Tag,
   TextArea,
+  TextAreaField,
   TextButton,
   TextField,
+  TextInput,
   TextLabel,
   Title,
+  Tooltip,
   Transition,
   UiSystemProvider,
   Underline,
@@ -183,11 +241,13 @@ export {
   ViewPagerItem,
   ViewPagerTabPanel,
   ViewPagerTabs,
+  VirtualizedList,
   VolumeBar,
   ZStack,
   defaultTheme,
   signatureTheme,
+  useIsMobile,
   useModalBottomSheet,
   useResponsiveValue,
-  useSlider
+  useSliderState
 };

package/lib/Accordion/Accordion.js

@@ -1,33 +1,43 @@
-// tools/builders/framer-esm/build/react-shim.js
-import * as React from "react";
+import {
+  React,
+  __objRest,
+  __spreadValues,
+  init_react_shim
+} from "../../chunk-VIIHQGZ3.js";
 
 // libs/shared/ui-system/src/lib/Accordion/Accordion.tsx
-import {useCallback, useState} from "react";
-import {Action} from "../Action/index.js";
-import {Icon} from "../Icon/index.js";
-import {HStack} from "../Layout/HStack/index.js";
-import {VStack} from "../Layout/VStack/index.js";
-import {Body} from "../Typography/Body/index.js";
-var Accordion = ({title, content, defaultOpened, ...props}) => {
+init_react_shim();
+import { useCallback, useState } from "react";
+import { Box } from "../../private/Box/index.js";
+import { Action } from "../Action/index.js";
+import { Icon } from "../Icon/index.js";
+import { HStack } from "../Layout/HStack/index.js";
+import { VStack } from "../Layout/VStack/index.js";
+import { Body } from "../Typography/Body/index.js";
+var Accordion = (_a) => {
+  var _b = _a, { title, content, defaultOpened } = _b, props = __objRest(_b, ["title", "content", "defaultOpened"]);
   const [isOpened, setIsOpened] = useState(defaultOpened);
   const handleClick = useCallback(() => setIsOpened((prev) => !prev), []);
-  return /* @__PURE__ */ React.createElement(VStack, {
-    ...props
+  return /* @__PURE__ */ React.createElement(VStack, __spreadValues({}, props), /* @__PURE__ */ React.createElement(Action, {
+    onClick: handleClick
   }, /* @__PURE__ */ React.createElement(HStack, {
+    as: "button",
     py: [10, 10, 20],
-    spacing: "between"
+    spacing: "between",
+    alignment: "center"
   }, /* @__PURE__ */ React.createElement(Body, {
-    level: 1,
-    weight: "bold"
-  }, title), /* @__PURE__ */ React.createElement(Action, {
-    onClick: handleClick
+    level: [2, 2, 1],
+    weight: "bold",
+    textAlign: "left"
+  }, title), /* @__PURE__ */ React.createElement(Box, {
+    ml: 16
   }, isOpened ? /* @__PURE__ */ React.createElement(Icon.Fill.ChevronUp, {
     size: 16,
     fill: "gray.600"
   }) : /* @__PURE__ */ React.createElement(Icon.Fill.ChevronDown, {
     size: 16,
     fill: "gray.600"
-  }))), isOpened && (typeof content === "string" ? /* @__PURE__ */ React.createElement(VStack, {
+  })))), isOpened && (typeof content === "string" ? /* @__PURE__ */ React.createElement(VStack, {
     py: 8
   }, /* @__PURE__ */ React.createElement(Body, {
     level: 2

package/lib/Accordion/index.js

@@ -1,8 +1,10 @@
-// tools/builders/framer-esm/build/react-shim.js
-import * as React from "react";
+import {
+  init_react_shim
+} from "../../chunk-VIIHQGZ3.js";
 
 // libs/shared/ui-system/src/lib/Accordion/index.ts
-import {Accordion} from "./Accordion.js";
+init_react_shim();
+import { Accordion } from "./Accordion.js";
 export {
   Accordion
 };

package/lib/Action/Action.js

@@ -1,15 +1,19 @@
-// tools/builders/framer-esm/build/react-shim.js
-import * as React from "react";
-
-// libs/shared/utils-type/src/lib/isDefined/isDefined.ts
-function isDefined(value) {
-  return value !== void 0;
-}
+import {
+  isDefined
+} from "../../chunk-MBYCGPJ2.js";
+import {
+  React,
+  __objRest,
+  __spreadValues,
+  init_react_shim
+} from "../../chunk-VIIHQGZ3.js";
 
 // libs/shared/ui-system/src/lib/Action/Action.tsx
-import {useMemo} from "react";
-import {ForwardStyle} from "../../private/ForwardStyle/index.js";
-var Action = ({cursor, ...restProps}) => {
+init_react_shim();
+import { useMemo } from "react";
+import { ForwardStyle } from "../../private/ForwardStyle/index.js";
+var Action = (_a) => {
+  var _b = _a, { cursor } = _b, restProps = __objRest(_b, ["cursor"]);
   const cursorProp = useMemo(() => {
     if (isDefined(cursor)) {
       return cursor;
@@ -19,7 +23,7 @@ var Action = ({cursor, ...restProps}) => {
     }
     return "default";
   }, [cursor, restProps.disabled, restProps.onClick]);
-  const nextProps = {...restProps};
+  const nextProps = __spreadValues({}, restProps);
   for (const key of Object.keys(nextProps)) {
     const value = nextProps[key];
     if (key.startsWith("on") && typeof value === "string") {
@@ -38,10 +42,9 @@ var Action = ({cursor, ...restProps}) => {
       };
     }
   }
-  return /* @__PURE__ */ React.createElement(ForwardStyle, {
-    cursor: cursorProp,
-    ...nextProps
-  });
+  return /* @__PURE__ */ React.createElement(ForwardStyle, __spreadValues({
+    cursor: cursorProp
+  }, nextProps));
 };
 Action.forwardStyle = true;
 export {

package/lib/Action/index.js

@@ -1,8 +1,10 @@
-// tools/builders/framer-esm/build/react-shim.js
-import * as React from "react";
+import {
+  init_react_shim
+} from "../../chunk-VIIHQGZ3.js";
 
 // libs/shared/ui-system/src/lib/Action/index.ts
-import {Action} from "./Action.js";
+init_react_shim();
+import { Action } from "./Action.js";
 export {
   Action
 };

package/lib/Alert/Alert.js

@@ -1,13 +1,16 @@
-// tools/builders/framer-esm/build/react-shim.js
-import * as React from "react";
+import {
+  React,
+  init_react_shim
+} from "../../chunk-VIIHQGZ3.js";
 
 // libs/shared/ui-system/src/lib/Alert/Alert.tsx
-import {HStack} from "../Layout/HStack/index.js";
-import {Frame} from "../Frame/index.js";
-import {Icon} from "../Icon/index.js";
-import {Body} from "../Typography/Body/index.js";
-import {TextButton} from "../Button/TextButton/index.js";
-import {propVariant, system} from "../../core/index.js";
+init_react_shim();
+import { propVariant, system } from "../../core/index.js";
+import { TextButton } from "../Button/TextButton/index.js";
+import { Icon } from "../Icon/index.js";
+import { HStack } from "../Layout/HStack/index.js";
+import { Paper } from "../Paper/index.js";
+import { Body } from "../Typography/Body/index.js";
 var Alert = system()(propVariant({
   prop: "kind",
   variants: {
@@ -32,7 +35,7 @@ var Alert = system()(propVariant({
       textColor: "black"
     }
   }
-}))(({message, closeText, onCloseClick, textColor, IconComponent, iconColor}) => /* @__PURE__ */ React.createElement(Frame, {
+}))(({ message, closeText, onCloseClick, textColor, IconComponent, iconColor }) => /* @__PURE__ */ React.createElement(Paper, {
   kind: "background",
   borderRadiusLevel: 1,
   elevationLevel: 2,
@@ -45,10 +48,12 @@ var Alert = system()(propVariant({
 }, /* @__PURE__ */ React.createElement(HStack, {
   alignment: "center",
   spacing: 6
-}, IconComponent && /* @__PURE__ */ React.createElement(IconComponent, {
+}, IconComponent && /* @__PURE__ */ React.createElement(HStack, {
+  flex: "none"
+}, /* @__PURE__ */ React.createElement(IconComponent, {
   size: 14,
   fill: iconColor
-}), /* @__PURE__ */ React.createElement(Body, {
+})), /* @__PURE__ */ React.createElement(Body, {
   level: 2,
   color: textColor
 }, message)), closeText && /* @__PURE__ */ React.createElement(TextButton, {

package/lib/Alert/index.js

@@ -1,8 +1,10 @@
-// tools/builders/framer-esm/build/react-shim.js
-import * as React from "react";
+import {
+  init_react_shim
+} from "../../chunk-VIIHQGZ3.js";
 
 // libs/shared/ui-system/src/lib/Alert/index.ts
-import {Alert} from "./Alert.js";
+init_react_shim();
+import { Alert } from "./Alert.js";
 export {
   Alert
 };

package/lib/Animation/Animator/Animator.js

@@ -1,26 +1,39 @@
-// tools/builders/framer-esm/build/react-shim.js
-import * as React from "react";
-
-// libs/shared/utils-type/src/lib/isDefined/isDefined.ts
-function isDefined(value) {
-  return value !== void 0;
-}
+import {
+  isDefined
+} from "../../../chunk-MBYCGPJ2.js";
+import {
+  React,
+  __objRest,
+  __spreadValues,
+  init_react_shim
+} from "../../../chunk-VIIHQGZ3.js";
 
 // libs/shared/ui-system/src/lib/Animation/Animator/Animator.tsx
-import {useMemo} from "react";
-import {ForwardStyle} from "../../../private/ForwardStyle/index.js";
-var Animator = ({
-  animate = true,
-  name,
-  delay,
-  duration,
-  iterationCount,
-  timingFunction,
-  fillMode,
-  playState,
-  direction,
-  ...restProps
-}) => {
+init_react_shim();
+import { useMemo } from "react";
+import { ForwardStyle } from "../../../private/ForwardStyle/index.js";
+var Animator = (_a) => {
+  var _b = _a, {
+    animate = true,
+    name,
+    delay,
+    duration,
+    iterationCount,
+    timingFunction,
+    fillMode,
+    playState,
+    direction
+  } = _b, restProps = __objRest(_b, [
+    "animate",
+    "name",
+    "delay",
+    "duration",
+    "iterationCount",
+    "timingFunction",
+    "fillMode",
+    "playState",
+    "direction"
+  ]);
   const animationName = useMemo(() => {
     if (!isDefined(animate)) {
       return void 0;
@@ -28,7 +41,7 @@ var Animator = ({
     const responsiveAnimate = Array.isArray(animate) ? animate : [animate];
     return responsiveAnimate.map((eachAnimate) => eachAnimate ? name : "none");
   }, [animate, name]);
-  return /* @__PURE__ */ React.createElement(ForwardStyle, {
+  return /* @__PURE__ */ React.createElement(ForwardStyle, __spreadValues({
     animationName,
     animationDelay: delay,
     animationDuration: duration,
@@ -36,9 +49,8 @@ var Animator = ({
     animationTimingFunction: timingFunction,
     animationFillMode: fillMode,
     animationPlayState: playState,
-    animationDirection: direction,
-    ...restProps
-  });
+    animationDirection: direction
+  }, restProps));
 };
 Animator.forwardStyle = true;
 export {

package/lib/Animation/Animator/index.js

@@ -1,8 +1,10 @@
-// tools/builders/framer-esm/build/react-shim.js
-import * as React from "react";
+import {
+  init_react_shim
+} from "../../../chunk-VIIHQGZ3.js";
 
 // libs/shared/ui-system/src/lib/Animation/Animator/index.ts
-import {Animator} from "./Animator.js";
+init_react_shim();
+import { Animator } from "./Animator.js";
 export {
   Animator
 };