@xaui/native 0.2.8 → 0.9.1-alpha.0

package/dist/color-picker/index.js

@@ -1,457 +0,0 @@
-import {
-  InputTrigger
-} from "../chunk-A45TVXU5.js";
-import {
-  BottomSheet
-} from "../chunk-4JFWQ5XT.js";
-import "../chunk-SHBDANQN.js";
-import {
-  useXUITheme
-} from "../chunk-RBSA4NH4.js";
-
-// src/components/color-picker/color-picker.tsx
-import React, { useEffect, useState } from "react";
-import { Pressable, ScrollView, Text, View } from "react-native";
-import { withOpacity } from "@xaui/core";
-
-// src/components/color-picker/color-picker.palette.ts
-var defaultColorGroups = [
-  {
-    name: "Red",
-    colors: [
-      "#fef2f2",
-      "#fecaca",
-      "#f87171",
-      "#ef4444",
-      "#dc2626",
-      "#b91c1c",
-      "#991b1b",
-      "#7f1d1d"
-    ]
-  },
-  {
-    name: "Orange",
-    colors: [
-      "#fff7ed",
-      "#fed7aa",
-      "#fb923c",
-      "#f97316",
-      "#ea580c",
-      "#c2410c",
-      "#9a3412",
-      "#7c2d12"
-    ]
-  },
-  {
-    name: "Amber",
-    colors: [
-      "#fffbeb",
-      "#fde68a",
-      "#fbbf24",
-      "#f59e0b",
-      "#d97706",
-      "#b45309",
-      "#92400e",
-      "#78350f"
-    ]
-  },
-  {
-    name: "Yellow",
-    colors: [
-      "#fefce8",
-      "#fef08a",
-      "#facc15",
-      "#eab308",
-      "#ca8a04",
-      "#a16207",
-      "#854d0e",
-      "#713f12"
-    ]
-  },
-  {
-    name: "Lime",
-    colors: [
-      "#f7fee7",
-      "#d9f99d",
-      "#86efac",
-      "#4ade80",
-      "#22c55e",
-      "#16a34a",
-      "#15803d",
-      "#14532d"
-    ]
-  },
-  {
-    name: "Green",
-    colors: [
-      "#f0fdf4",
-      "#bbf7d0",
-      "#4ade80",
-      "#22c55e",
-      "#16a34a",
-      "#15803d",
-      "#166534",
-      "#14532d"
-    ]
-  },
-  {
-    name: "Teal",
-    colors: [
-      "#f0fdfa",
-      "#99f6e4",
-      "#2dd4bf",
-      "#14b8a6",
-      "#0d9488",
-      "#0f766e",
-      "#115e59",
-      "#134e4a"
-    ]
-  },
-  {
-    name: "Cyan",
-    colors: [
-      "#ecfeff",
-      "#a5f3fc",
-      "#22d3ee",
-      "#06b6d4",
-      "#0891b2",
-      "#0e7490",
-      "#155e75",
-      "#164e63"
-    ]
-  },
-  {
-    name: "Blue",
-    colors: [
-      "#eff6ff",
-      "#bfdbfe",
-      "#60a5fa",
-      "#3b82f6",
-      "#2563eb",
-      "#1d4ed8",
-      "#1e40af",
-      "#1e3a8a"
-    ]
-  },
-  {
-    name: "Indigo",
-    colors: [
-      "#eef2ff",
-      "#c7d2fe",
-      "#818cf8",
-      "#6366f1",
-      "#4f46e5",
-      "#4338ca",
-      "#3730a3",
-      "#312e81"
-    ]
-  },
-  {
-    name: "Violet",
-    colors: [
-      "#f5f3ff",
-      "#ddd6fe",
-      "#a78bfa",
-      "#8b5cf6",
-      "#7c3aed",
-      "#6d28d9",
-      "#5b21b6",
-      "#4c1d95"
-    ]
-  },
-  {
-    name: "Purple",
-    colors: [
-      "#faf5ff",
-      "#e9d5ff",
-      "#c084fc",
-      "#a855f7",
-      "#9333ea",
-      "#7e22ce",
-      "#6b21a8",
-      "#581c87"
-    ]
-  },
-  {
-    name: "Pink",
-    colors: [
-      "#fdf2f8",
-      "#fbcfe8",
-      "#f472b6",
-      "#ec4899",
-      "#db2777",
-      "#be185d",
-      "#9d174d",
-      "#831843"
-    ]
-  },
-  {
-    name: "Rose",
-    colors: [
-      "#fff1f2",
-      "#fecdd3",
-      "#fb7185",
-      "#f43f5e",
-      "#e11d48",
-      "#be123c",
-      "#9f1239",
-      "#881337"
-    ]
-  },
-  {
-    name: "Neutral",
-    colors: [
-      "#fafafa",
-      "#f5f5f5",
-      "#e5e5e5",
-      "#d4d4d4",
-      "#a3a3a3",
-      "#737373",
-      "#525252",
-      "#404040",
-      "#262626",
-      "#171717",
-      "#0a0a0a"
-    ]
-  }
-];
-
-// src/components/color-picker/color-picker.style.ts
-import { StyleSheet } from "react-native";
-var styles = StyleSheet.create({
-  sheetContent: {
-    flex: 1,
-    paddingBottom: 24
-  },
-  header: {
-    paddingHorizontal: 20,
-    paddingTop: 4,
-    paddingBottom: 16,
-    flexDirection: "row",
-    alignItems: "center",
-    justifyContent: "space-between"
-  },
-  sheetTitle: {
-    fontSize: 16,
-    fontWeight: "600"
-  },
-  selectedPreview: {
-    flexDirection: "row",
-    alignItems: "center",
-    gap: 8
-  },
-  previewSwatch: {
-    width: 28,
-    height: 28,
-    borderRadius: 14,
-    borderWidth: 2
-  },
-  hexLabel: {
-    fontSize: 13,
-    fontWeight: "500",
-    letterSpacing: 0.5
-  },
-  groupContainer: {
-    marginBottom: 16,
-    paddingHorizontal: 20
-  },
-  groupName: {
-    fontSize: 13,
-    fontWeight: "500",
-    marginBottom: 8
-  },
-  swatchRow: {
-    flexDirection: "row",
-    flexWrap: "wrap",
-    gap: 8
-  },
-  triggerSwatch: {
-    width: 22,
-    height: 22,
-    borderRadius: 4,
-    borderWidth: 1
-  }
-});
-
-// src/components/color-picker/color-picker.tsx
-var Swatch = ({
-  color,
-  size,
-  isSelected,
-  onSelect,
-  borderColor
-}) => /* @__PURE__ */ React.createElement(
-  Pressable,
-  {
-    onPress: () => onSelect(color),
-    accessibilityRole: "button",
-    accessibilityLabel: color,
-    accessibilityState: { selected: isSelected },
-    style: [
-      {
-        width: size,
-        height: size,
-        borderRadius: 6,
-        backgroundColor: color,
-        borderWidth: isSelected ? 3 : 1,
-        borderColor: isSelected ? borderColor : withOpacity(borderColor, 0.15)
-      }
-    ]
-  }
-);
-var ColorGroupSection = ({
-  group,
-  selectedColor,
-  swatchSize,
-  themeMain,
-  foreground,
-  onSelect
-}) => /* @__PURE__ */ React.createElement(View, { style: styles.groupContainer }, /* @__PURE__ */ React.createElement(Text, { style: [styles.groupName, { color: withOpacity(foreground, 0.6) }] }, group.name), /* @__PURE__ */ React.createElement(View, { style: styles.swatchRow }, group.colors.map((color) => /* @__PURE__ */ React.createElement(
-  Swatch,
-  {
-    key: color,
-    color,
-    size: swatchSize,
-    isSelected: color === selectedColor,
-    onSelect,
-    borderColor: color === selectedColor ? themeMain : foreground
-  }
-))));
-var ColorPicker = ({
-  value,
-  placeholder = "Pick a color...",
-  label,
-  labelPlacement = "outside",
-  description,
-  errorMessage,
-  colorGroups = defaultColorGroups,
-  sheetTitle = "Pick a color",
-  themeColor = "primary",
-  variant = "colored",
-  size = "md",
-  radius = "md",
-  isOpened,
-  isDisabled = false,
-  isInvalid = false,
-  fullWidth = true,
-  sheetStyle,
-  swatchSize = 28,
-  onColorChange,
-  onOpenChange,
-  onClose
-}) => {
-  const [isOpen, setIsOpen] = useState(isOpened ?? false);
-  const theme = useXUITheme();
-  const sheetBackground = theme.mode === "dark" ? theme.colors.background : "#ffffff";
-  useEffect(() => {
-    if (isOpened !== void 0) {
-      setIsOpen(isOpened);
-    }
-  }, [isOpened]);
-  const handleOpen = () => {
-    if (isDisabled) return;
-    setIsOpen(true);
-    onOpenChange?.(true);
-  };
-  const handleClose = () => {
-    setIsOpen(false);
-    onOpenChange?.(false);
-    onClose?.();
-  };
-  const handleSelect = (color) => {
-    onColorChange?.(color);
-    handleClose();
-  };
-  const triggerColor = value;
-  const foreground = theme.colors.foreground;
-  const themeMain = theme.colors[themeColor]?.main ?? foreground;
-  const triggerEndContent = /* @__PURE__ */ React.createElement(
-    View,
-    {
-      style: [
-        styles.triggerSwatch,
-        {
-          backgroundColor: triggerColor ?? "transparent",
-          borderColor: triggerColor ? withOpacity(foreground, 0.2) : withOpacity(foreground, 0.15),
-          borderStyle: triggerColor ? "solid" : "dashed"
-        }
-      ]
-    }
-  );
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
-    InputTrigger,
-    {
-      value: value ? "" : void 0,
-      placeholder,
-      label,
-      labelPlacement,
-      description,
-      errorMessage,
-      themeColor,
-      variant,
-      size,
-      radius,
-      isDisabled,
-      isInvalid,
-      fullWidth,
-      startContent: triggerEndContent,
-      endContent: value ? /* @__PURE__ */ React.createElement(
-        Text,
-        {
-          style: [
-            {
-              fontSize: 13,
-              fontWeight: "500",
-              letterSpacing: 0.5,
-              color: withOpacity(foreground, 0.6)
-            }
-          ]
-        },
-        value.toUpperCase()
-      ) : void 0,
-      onPress: handleOpen
-    }
-  ), /* @__PURE__ */ React.createElement(
-    BottomSheet,
-    {
-      isOpen,
-      snapPoints: [0.75],
-      themeColor,
-      onClose: handleClose,
-      style: { backgroundColor: sheetBackground, ...sheetStyle }
-    },
-    /* @__PURE__ */ React.createElement(View, { style: styles.sheetContent }, /* @__PURE__ */ React.createElement(View, { style: styles.header }, /* @__PURE__ */ React.createElement(Text, { style: [styles.sheetTitle, { color: foreground }] }, sheetTitle), value && /* @__PURE__ */ React.createElement(View, { style: styles.selectedPreview }, /* @__PURE__ */ React.createElement(
-      View,
-      {
-        style: [
-          styles.previewSwatch,
-          {
-            backgroundColor: value,
-            borderColor: withOpacity(foreground, 0.2)
-          }
-        ]
-      }
-    ), /* @__PURE__ */ React.createElement(
-      Text,
-      {
-        style: [styles.hexLabel, { color: withOpacity(foreground, 0.7) }]
-      },
-      value.toUpperCase()
-    ))), /* @__PURE__ */ React.createElement(ScrollView, { showsVerticalScrollIndicator: false }, colorGroups.map((group) => /* @__PURE__ */ React.createElement(
-      ColorGroupSection,
-      {
-        key: group.name,
-        group,
-        selectedColor: value,
-        swatchSize,
-        themeMain,
-        foreground,
-        onSelect: handleSelect
-      }
-    ))))
-  ));
-};
-export {
-  ColorPicker,
-  defaultColorGroups
-};

package/dist/core/index.cjs

@@ -1,24 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
-
-
-
-var _chunk56RPWZD2cjs = require('../chunk-56RPWZD2.cjs');
-
-
-
-
-
-
-
-var _chunk7UFBLUMVcjs = require('../chunk-7UFBLUMV.cjs');
-
-
-
-
-
-
-
-
-
-
-exports.Portal = _chunk7UFBLUMVcjs.Portal; exports.PortalHost = _chunk7UFBLUMVcjs.PortalHost; exports.XUIProvider = _chunk7UFBLUMVcjs.XUIProvider; exports.defaultDarkTheme = _chunk56RPWZD2cjs.defaultDarkTheme; exports.defaultTheme = _chunk56RPWZD2cjs.defaultTheme; exports.palette = _chunk56RPWZD2cjs.colors; exports.useColorMode = _chunk7UFBLUMVcjs.useColorMode; exports.useXUIColors = _chunk7UFBLUMVcjs.useXUIColors; exports.useXUITheme = _chunk7UFBLUMVcjs.useXUITheme;

package/dist/core/index.d.cts

@@ -1,28 +0,0 @@
-import React, { ReactNode } from 'react';
-import { XUITheme } from '@xaui/core/theme';
-export { PartialXUITheme as XUITheme, defaultDarkTheme, defaultTheme } from '@xaui/core/theme';
-export { colors as palette } from '@xaui/core/palette';
-
-type DeepPartial<T> = {
-    [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];
-};
-interface XUIProviderProps {
-    children: ReactNode;
-    theme?: DeepPartial<XUITheme>;
-}
-declare function XUIProvider({ children, theme }: XUIProviderProps): React.JSX.Element;
-
-type ColorMode = 'light' | 'dark';
-declare function useColorMode(): ColorMode;
-declare function useXUITheme(): XUITheme;
-declare function useXUIColors(): XUITheme['colors'];
-
-declare const Portal: React.FC<{
-    children: ReactNode;
-}>;
-
-declare const PortalHost: React.FC<{
-    children: ReactNode;
-}>;
-
-export { Portal, PortalHost, XUIProvider, useColorMode, useXUIColors, useXUITheme };

package/dist/core/index.d.ts

@@ -1,28 +0,0 @@
-import React, { ReactNode } from 'react';
-import { XUITheme } from '@xaui/core/theme';
-export { PartialXUITheme as XUITheme, defaultDarkTheme, defaultTheme } from '@xaui/core/theme';
-export { colors as palette } from '@xaui/core/palette';
-
-type DeepPartial<T> = {
-    [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];
-};
-interface XUIProviderProps {
-    children: ReactNode;
-    theme?: DeepPartial<XUITheme>;
-}
-declare function XUIProvider({ children, theme }: XUIProviderProps): React.JSX.Element;
-
-type ColorMode = 'light' | 'dark';
-declare function useColorMode(): ColorMode;
-declare function useXUITheme(): XUITheme;
-declare function useXUIColors(): XUITheme['colors'];
-
-declare const Portal: React.FC<{
-    children: ReactNode;
-}>;
-
-declare const PortalHost: React.FC<{
-    children: ReactNode;
-}>;
-
-export { Portal, PortalHost, XUIProvider, useColorMode, useXUIColors, useXUITheme };

package/dist/core/index.js

@@ -1,24 +0,0 @@
-import {
-  colors,
-  defaultDarkTheme,
-  defaultTheme
-} from "../chunk-SHBDANQN.js";
-import {
-  Portal,
-  PortalHost,
-  XUIProvider,
-  useColorMode,
-  useXUIColors,
-  useXUITheme
-} from "../chunk-RBSA4NH4.js";
-export {
-  Portal,
-  PortalHost,
-  XUIProvider,
-  defaultDarkTheme,
-  defaultTheme,
-  colors as palette,
-  useColorMode,
-  useXUIColors,
-  useXUITheme
-};