@kitelus/fly-ui 0.1.0

package/dist/index.js

@@ -0,0 +1,453 @@
+// src/lib/cn.ts
+function cn(...parts) {
+  return parts.filter(Boolean).join(" ");
+}
+
+// src/components/kite/kite-animations.module.css
+var kite_animations_default = {};
+
+// src/components/kite/theme.ts
+import {
+  createElement,
+  createContext,
+  useContext
+} from "react";
+var FlyUIThemeContext = createContext(void 0);
+function FlyUIThemeProvider({
+  theme,
+  children
+}) {
+  return createElement(FlyUIThemeContext.Provider, { value: theme }, children);
+}
+function useFlyUITheme() {
+  return useContext(FlyUIThemeContext);
+}
+function mergeKiteTheme(globalTheme, componentTheme) {
+  return { ...globalTheme, ...componentTheme };
+}
+function buildKiteThemeStyle(theme) {
+  if (!theme) {
+    return {};
+  }
+  return {
+    ...theme.primary ? { ["--kite-primary"]: theme.primary } : {},
+    ...theme.foreground ? { ["--kite-foreground"]: theme.foreground } : {},
+    ...theme.muted ? { ["--kite-muted"]: theme.muted } : {},
+    ...theme.overlayBackground ? { ["--kite-overlay-background"]: theme.overlayBackground } : {},
+    ...theme.overlayBlur ? { ["--kite-overlay-blur"]: theme.overlayBlur } : {}
+  };
+}
+
+// src/components/kite/KiteLogo.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var SIZE = {
+  xs: { icon: 16, text: 12, gap: 6, strongWeight: 600 },
+  sm: { icon: 20, text: 14, gap: 8, strongWeight: 600 },
+  md: { icon: 24, text: 16, gap: 10, strongWeight: 600 },
+  lg: { icon: 28, text: 18, gap: 10, strongWeight: 700 },
+  xl: { icon: 40, text: 24, gap: 12, strongWeight: 700 }
+};
+function KiteIcon({ size }) {
+  return /* @__PURE__ */ jsxs(
+    "svg",
+    {
+      width: size,
+      height: size,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ jsx("path", { d: "M12 0 L0 9 L12 24 Z", fill: "var(--kite-primary, #0ea5e9)" }),
+        /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M12 0 L24 9 L12 24 Z",
+            fill: "var(--kite-primary, #0ea5e9)",
+            opacity: "0.48"
+          }
+        )
+      ]
+    }
+  );
+}
+function KiteLogo({
+  size = "md",
+  showText = true,
+  name = "Fly",
+  subBrand = "UI",
+  theme,
+  className,
+  textClassName,
+  style
+}) {
+  const cfg = SIZE[size];
+  const globalTheme = useFlyUITheme();
+  const resolvedTheme = mergeKiteTheme(globalTheme, theme);
+  const themeStyle = buildKiteThemeStyle(resolvedTheme);
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        kite_animations_default["kite-fu-host"],
+        kite_animations_default["kite-fu-logoWrap"],
+        className
+      ),
+      style: { ...themeStyle, ...style, gap: cfg.gap },
+      children: [
+        /* @__PURE__ */ jsx(KiteIcon, { size: cfg.icon }),
+        showText ? /* @__PURE__ */ jsxs(
+          "span",
+          {
+            className: cn(kite_animations_default["kite-fu-logoText"], textClassName),
+            style: {
+              fontSize: `${cfg.text}px`,
+              fontFamily: '"Inter Variable", sans-serif',
+              letterSpacing: "-0.03em",
+              lineHeight: 1
+            },
+            children: [
+              /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: kite_animations_default["kite-fu-logoTextStrong"],
+                  style: { fontWeight: cfg.strongWeight },
+                  children: name
+                }
+              ),
+              /* @__PURE__ */ jsx("span", { className: kite_animations_default["kite-fu-logoTextLight"], children: subBrand })
+            ]
+          }
+        ) : null
+      ]
+    }
+  );
+}
+
+// src/components/kite/KiteLoader.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var SIZES = {
+  sm: 32,
+  md: 48,
+  lg: 64
+};
+function KiteLoader({
+  size = "md",
+  label,
+  showBrand = false,
+  name = "Fly",
+  subBrand = "UI",
+  theme,
+  className,
+  style
+}) {
+  const px = SIZES[size];
+  const svgH = Math.round(px * 1.2);
+  const globalTheme = useFlyUITheme();
+  const resolvedTheme = mergeKiteTheme(globalTheme, theme);
+  const themeStyle = buildKiteThemeStyle(resolvedTheme);
+  return /* @__PURE__ */ jsx2(
+    "div",
+    {
+      className: cn(kite_animations_default["kite-fu-host"], className),
+      role: "status",
+      "aria-label": label ?? "Loading",
+      style: { ...themeStyle, ...style },
+      children: /* @__PURE__ */ jsxs2(
+        "div",
+        {
+          style: {
+            display: "flex",
+            flexDirection: "column",
+            alignItems: "center",
+            gap: 10
+          },
+          children: [
+            /* @__PURE__ */ jsxs2(
+              "svg",
+              {
+                width: px,
+                height: svgH,
+                viewBox: "0 0 24 31",
+                fill: "none",
+                xmlns: "http://www.w3.org/2000/svg",
+                "aria-hidden": "true",
+                overflow: "visible",
+                children: [
+                  /* @__PURE__ */ jsxs2("g", { className: kite_animations_default["kite-fu-skyLayer"], "aria-hidden": "true", children: [
+                    /* @__PURE__ */ jsx2("g", { className: kite_animations_default["kite-fu-cloudSizeSm"], children: /* @__PURE__ */ jsx2("g", { className: kite_animations_default["kite-fu-cloudDriftHigh"], children: /* @__PURE__ */ jsx2(
+                      "path",
+                      {
+                        d: "M15.4 3.8c0-0.8 0.6-1.5 1.5-1.5 0.2-1 1.1-1.8 2.1-1.8 0.7 0 1.4 0.4 1.9 1 0.2-0.1 0.5-0.1 0.7-0.1 1 0 1.9 0.9 1.9 1.9s-0.9 1.9-1.9 1.9h-4.5c-0.9 0-1.7-0.7-1.7-1.6z",
+                        fill: "var(--kite-muted, #64748b)",
+                        opacity: "0.28"
+                      }
+                    ) }) }),
+                    /* @__PURE__ */ jsx2("g", { className: kite_animations_default["kite-fu-cloudSizeLg"], children: /* @__PURE__ */ jsx2("g", { className: kite_animations_default["kite-fu-cloudDriftFar"], children: /* @__PURE__ */ jsx2(
+                      "path",
+                      {
+                        d: "M2.4 5.7c0-1 0.8-1.8 1.8-1.8 0.2-1.2 1.3-2.1 2.5-2.1 1 0 1.8 0.5 2.3 1.3 0.3-0.1 0.5-0.1 0.8-0.1 1.3 0 2.3 1 2.3 2.3s-1 2.3-2.3 2.3H4.4c-1.1 0-2-0.9-2-2z",
+                        fill: "var(--kite-muted, #64748b)",
+                        opacity: "0.32"
+                      }
+                    ) }) })
+                  ] }),
+                  /* @__PURE__ */ jsx2(
+                    "g",
+                    {
+                      className: cn(
+                        kite_animations_default["kite-fu-float"],
+                        kite_animations_default["kite-fu-kiteBreath"]
+                      ),
+                      children: /* @__PURE__ */ jsxs2("g", { transform: "rotate(90 12 12)", children: [
+                        /* @__PURE__ */ jsx2(
+                          "path",
+                          {
+                            d: "M12 0 L0 9 L12 24 Z",
+                            fill: "var(--kite-primary, #0ea5e9)"
+                          }
+                        ),
+                        /* @__PURE__ */ jsx2(
+                          "path",
+                          {
+                            d: "M12 0 L24 9 L12 24 Z",
+                            fill: "var(--kite-primary, #0ea5e9)",
+                            className: kite_animations_default["kite-fu-shadowBreathe"]
+                          }
+                        ),
+                        /* @__PURE__ */ jsx2(
+                          "path",
+                          {
+                            d: "M12 24 Q13 28.5 12 31",
+                            stroke: "var(--kite-muted, #64748b)",
+                            strokeWidth: "1.5",
+                            strokeLinecap: "round",
+                            fill: "none",
+                            className: kite_animations_default["kite-fu-stringSway"]
+                          }
+                        )
+                      ] })
+                    }
+                  )
+                ]
+              }
+            ),
+            showBrand ? /* @__PURE__ */ jsxs2(
+              "span",
+              {
+                className: cn(
+                  kite_animations_default["kite-fu-logoText"],
+                  kite_animations_default["kite-fu-loadingTextPulse"]
+                ),
+                style: {
+                  marginTop: -2,
+                  fontSize: 20,
+                  fontFamily: '"Inter Variable", sans-serif',
+                  letterSpacing: "-0.03em",
+                  lineHeight: 1
+                },
+                children: [
+                  /* @__PURE__ */ jsx2("span", { className: kite_animations_default["kite-fu-logoTextStrong"], children: name }),
+                  /* @__PURE__ */ jsx2("span", { className: kite_animations_default["kite-fu-logoTextLight"], children: subBrand })
+                ]
+              }
+            ) : null,
+            label ? /* @__PURE__ */ jsx2("p", { className: kite_animations_default["kite-fu-label"], children: label }) : null
+          ]
+        }
+      )
+    }
+  );
+}
+
+// src/components/kite/KitePageLoader.tsx
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function KitePageLoader({
+  message,
+  overlay = false,
+  name = "Fly",
+  subBrand = "UI",
+  theme,
+  className,
+  style
+}) {
+  const globalTheme = useFlyUITheme();
+  const resolvedTheme = mergeKiteTheme(globalTheme, theme);
+  const themeStyle = buildKiteThemeStyle(resolvedTheme);
+  return /* @__PURE__ */ jsxs3(
+    "div",
+    {
+      role: "status",
+      "aria-live": "polite",
+      "aria-label": message ?? "Loading",
+      className: cn(
+        kite_animations_default["kite-fu-host"],
+        kite_animations_default["kite-fu-pageWrap"],
+        overlay ? kite_animations_default["kite-fu-pageWrapOverlay"] : kite_animations_default["kite-fu-pageWrapFullscreen"],
+        className
+      ),
+      style: { ...themeStyle, ...style },
+      children: [
+        /* @__PURE__ */ jsxs3(
+          "svg",
+          {
+            width: 56,
+            height: 58,
+            viewBox: "0 0 24 31",
+            fill: "none",
+            xmlns: "http://www.w3.org/2000/svg",
+            "aria-hidden": "true",
+            overflow: "visible",
+            children: [
+              /* @__PURE__ */ jsxs3("g", { className: kite_animations_default["kite-fu-skyLayer"], "aria-hidden": "true", children: [
+                /* @__PURE__ */ jsx3("g", { className: kite_animations_default["kite-fu-cloudSizeSm"], children: /* @__PURE__ */ jsx3("g", { className: kite_animations_default["kite-fu-cloudDriftHigh"], children: /* @__PURE__ */ jsx3(
+                  "path",
+                  {
+                    d: "M14.8 3.3c0-0.8 0.6-1.5 1.5-1.5 0.2-1 1.1-1.8 2.2-1.8 0.8 0 1.4 0.4 1.9 1 0.2-0.1 0.5-0.1 0.8-0.1 1 0 1.8 0.8 1.8 1.8s-0.8 1.8-1.8 1.8h-4.7c-0.9 0-1.7-0.6-1.7-1.2z",
+                    fill: "var(--kite-muted, #64748b)",
+                    opacity: "0.28"
+                  }
+                ) }) }),
+                /* @__PURE__ */ jsx3("g", { className: kite_animations_default["kite-fu-cloudSizeLg"], children: /* @__PURE__ */ jsx3("g", { className: kite_animations_default["kite-fu-cloudDriftFar"], children: /* @__PURE__ */ jsx3(
+                  "path",
+                  {
+                    d: "M1.5 5.5c0-1.1 0.9-2 2-2 0.2-1.4 1.4-2.4 2.9-2.4 1.1 0 2 0.5 2.6 1.4 0.3-0.1 0.6-0.2 1-0.2 1.4 0 2.6 1.1 2.6 2.6s-1.2 2.6-2.6 2.6h-6.3c-1.3 0-2.3-0.9-2.3-2z",
+                    fill: "var(--kite-muted, #64748b)",
+                    opacity: "0.32"
+                  }
+                ) }) })
+              ] }),
+              /* @__PURE__ */ jsx3(
+                "g",
+                {
+                  className: cn(kite_animations_default["kite-fu-float"], kite_animations_default["kite-fu-kiteBreath"]),
+                  children: /* @__PURE__ */ jsxs3("g", { transform: "rotate(90 12 12)", children: [
+                    /* @__PURE__ */ jsx3("path", { d: "M12 0 L0 9 L12 24 Z", fill: "var(--kite-primary, #0ea5e9)" }),
+                    /* @__PURE__ */ jsx3(
+                      "path",
+                      {
+                        d: "M12 0 L24 9 L12 24 Z",
+                        fill: "var(--kite-primary, #0ea5e9)",
+                        className: kite_animations_default["kite-fu-shadowBreathe"]
+                      }
+                    ),
+                    /* @__PURE__ */ jsx3(
+                      "path",
+                      {
+                        d: "M12 24 Q13 28.5 12 31",
+                        stroke: "var(--kite-muted, #64748b)",
+                        strokeWidth: "1.5",
+                        strokeLinecap: "round",
+                        fill: "none",
+                        className: kite_animations_default["kite-fu-stringSway"]
+                      }
+                    )
+                  ] })
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs3(
+          "span",
+          {
+            className: cn(
+              kite_animations_default["kite-fu-logoText"],
+              kite_animations_default["kite-fu-loadingTextPulse"]
+            ),
+            style: {
+              marginTop: -2,
+              fontSize: 20,
+              fontFamily: '"Inter Variable", sans-serif',
+              letterSpacing: "-0.03em",
+              lineHeight: 1
+            },
+            children: [
+              /* @__PURE__ */ jsx3("span", { className: kite_animations_default["kite-fu-logoTextStrong"], children: name }),
+              /* @__PURE__ */ jsx3("span", { className: kite_animations_default["kite-fu-logoTextLight"], children: subBrand })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs3(
+          "div",
+          {
+            className: cn(
+              kite_animations_default["kite-fu-loadingDots"],
+              kite_animations_default["kite-fu-loadingDotsBelowBrand"]
+            ),
+            "aria-hidden": "true",
+            children: [
+              /* @__PURE__ */ jsx3("span", { className: kite_animations_default["kite-fu-loadingDot"] }),
+              /* @__PURE__ */ jsx3(
+                "span",
+                {
+                  className: cn(
+                    kite_animations_default["kite-fu-loadingDot"],
+                    kite_animations_default["kite-fu-loadingDot1"]
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsx3(
+                "span",
+                {
+                  className: cn(
+                    kite_animations_default["kite-fu-loadingDot"],
+                    kite_animations_default["kite-fu-loadingDot2"]
+                  )
+                }
+              )
+            ]
+          }
+        ),
+        message ? /* @__PURE__ */ jsx3("p", { className: kite_animations_default["kite-fu-label"], children: message }) : null
+      ]
+    }
+  );
+}
+
+// src/components/loading/Loading.tsx
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+function Loading({ className, label, theme, style }) {
+  const globalTheme = useFlyUITheme();
+  const resolvedTheme = mergeKiteTheme(globalTheme, theme);
+  const themeStyle = buildKiteThemeStyle(resolvedTheme);
+  return /* @__PURE__ */ jsx4(
+    "div",
+    {
+      className: cn(kite_animations_default["kite-fu-host"], className),
+      role: "status",
+      "aria-label": label ?? "Loading",
+      style: { ...themeStyle, ...style },
+      children: /* @__PURE__ */ jsxs4("div", { className: kite_animations_default["kite-fu-loadingDots"], children: [
+        /* @__PURE__ */ jsx4("span", { className: kite_animations_default["kite-fu-loadingDot"] }),
+        /* @__PURE__ */ jsx4(
+          "span",
+          {
+            className: cn(
+              kite_animations_default["kite-fu-loadingDot"],
+              kite_animations_default["kite-fu-loadingDot1"]
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx4(
+          "span",
+          {
+            className: cn(
+              kite_animations_default["kite-fu-loadingDot"],
+              kite_animations_default["kite-fu-loadingDot2"]
+            )
+          }
+        )
+      ] })
+    }
+  );
+}
+export {
+  FlyUIThemeProvider,
+  KiteLoader,
+  KiteLogo,
+  KitePageLoader,
+  Loading,
+  useFlyUITheme
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/lib/cn.ts","../src/components/kite/kite-animations.module.css","../src/components/kite/theme.ts","../src/components/kite/KiteLogo.tsx","../src/components/kite/KiteLoader.tsx","../src/components/kite/KitePageLoader.tsx","../src/components/loading/Loading.tsx"],"sourcesContent":["export function cn(...parts: Array<string | false | null | undefined>): string {\r\n  return parts.filter(Boolean).join(\" \");\r\n}\r\n",".kite-fu-host {\r\n  --kite-primary: #0ea5e9;\r\n  --kite-foreground: #0f172a;\r\n  --kite-muted: #64748b;\r\n  --kite-overlay-background: rgba(255, 255, 255, 0.82);\r\n  --kite-overlay-blur: 2px;\r\n  color: var(--kite-foreground);\r\n  font-family: \"Inter Variable\", Inter, sans-serif;\r\n  line-height: 1;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.kite-fu-host *,\r\n.kite-fu-host *::before,\r\n.kite-fu-host *::after {\r\n  box-sizing: inherit;\r\n}\r\n\r\n.kite-fu-skyLayer {\r\n  opacity: 0.86;\r\n}\r\n\r\n.kite-fu-cloudSizeXs,\r\n.kite-fu-cloudSizeSm,\r\n.kite-fu-cloudSizeMd,\r\n.kite-fu-cloudSizeLg {\r\n  transform-box: fill-box;\r\n  transform-origin: center;\r\n}\r\n\r\n.kite-fu-cloudSizeXs {\r\n  transform: scale(0.78);\r\n}\r\n.kite-fu-cloudSizeSm {\r\n  transform: scale(0.92);\r\n}\r\n.kite-fu-cloudSizeMd {\r\n  transform: scale(1.04);\r\n}\r\n.kite-fu-cloudSizeLg {\r\n  transform: scale(1.18);\r\n}\r\n\r\n.kite-fu-cloudDelayB {\r\n  animation-delay: -1.9s;\r\n}\r\n.kite-fu-cloudDelayC {\r\n  animation-delay: -3s;\r\n}\r\n\r\n.kite-fu-cloudDriftFar {\r\n  animation: cloud-pass-far 4.6s cubic-bezier(0.4, 0.06, 0.6, 0.94) infinite;\r\n  will-change: transform, opacity;\r\n}\r\n\r\n.kite-fu-cloudDriftNear {\r\n  animation: cloud-pass-near 3.5s cubic-bezier(0.34, 0.08, 0.58, 0.96) infinite;\r\n  animation-delay: -1.6s;\r\n  will-change: transform, opacity;\r\n}\r\n\r\n.kite-fu-cloudDriftHigh {\r\n  animation: cloud-pass-high 3.2s cubic-bezier(0.36, 0.07, 0.58, 0.95) infinite;\r\n  animation-delay: -2.4s;\r\n  will-change: transform, opacity;\r\n}\r\n\r\n.kite-fu-cloudDriftAlt {\r\n  animation: cloud-pass-alt 4.1s cubic-bezier(0.38, 0.06, 0.62, 0.95) infinite;\r\n  animation-delay: -0.9s;\r\n  will-change: transform, opacity;\r\n}\r\n\r\n@keyframes cloud-pass-far {\r\n  0% {\r\n    transform: translate3d(22px, 0.4px, 0) scale(0.96);\r\n    opacity: 0;\r\n  }\r\n  18% {\r\n    transform: translate3d(12px, -0.3px, 0) scale(0.98);\r\n    opacity: 0.5;\r\n  }\r\n  52% {\r\n    transform: translate3d(-4px, 0.2px, 0) scale(1);\r\n    opacity: 0.58;\r\n  }\r\n  82% {\r\n    transform: translate3d(-18px, -0.5px, 0) scale(0.98);\r\n    opacity: 0.48;\r\n  }\r\n  100% {\r\n    transform: translate3d(-30px, 0.4px, 0) scale(0.95);\r\n    opacity: 0;\r\n  }\r\n}\r\n\r\n@keyframes cloud-pass-near {\r\n  0% {\r\n    transform: translate3d(24px, -0.7px, 0) scale(1.02);\r\n    opacity: 0;\r\n  }\r\n  16% {\r\n    transform: translate3d(14px, 0px, 0) scale(1.04);\r\n    opacity: 0.62;\r\n  }\r\n  48% {\r\n    transform: translate3d(-4px, 0.6px, 0) scale(1.06);\r\n    opacity: 0.72;\r\n  }\r\n  78% {\r\n    transform: translate3d(-18px, -0.1px, 0) scale(1.03);\r\n    opacity: 0.64;\r\n  }\r\n  100% {\r\n    transform: translate3d(-32px, -0.8px, 0) scale(1.01);\r\n    opacity: 0;\r\n  }\r\n}\r\n\r\n@keyframes cloud-pass-high {\r\n  0% {\r\n    transform: translate3d(26px, -1.2px, 0) scale(0.9);\r\n    opacity: 0;\r\n  }\r\n  20% {\r\n    transform: translate3d(15px, -1.6px, 0) scale(0.95);\r\n    opacity: 0.52;\r\n  }\r\n  55% {\r\n    transform: translate3d(-5px, -1px, 0) scale(0.98);\r\n    opacity: 0.58;\r\n  }\r\n  84% {\r\n    transform: translate3d(-21px, -1.4px, 0) scale(0.94);\r\n    opacity: 0.46;\r\n  }\r\n  100% {\r\n    transform: translate3d(-34px, -1.1px, 0) scale(0.9);\r\n    opacity: 0;\r\n  }\r\n}\r\n\r\n@keyframes cloud-pass-alt {\r\n  0% {\r\n    transform: translate3d(24px, 1px, 0) scale(1.08);\r\n    opacity: 0;\r\n  }\r\n  15% {\r\n    transform: translate3d(15px, 0.2px, 0) scale(1.1);\r\n    opacity: 0.62;\r\n  }\r\n  49% {\r\n    transform: translate3d(-4px, 0.9px, 0) scale(1.12);\r\n    opacity: 0.7;\r\n  }\r\n  79% {\r\n    transform: translate3d(-20px, 0.4px, 0) scale(1.08);\r\n    opacity: 0.56;\r\n  }\r\n  100% {\r\n    transform: translate3d(-34px, 1.1px, 0) scale(1.05);\r\n    opacity: 0;\r\n  }\r\n}\r\n\r\n.kite-fu-float {\r\n  animation: kite-float 1.9s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite;\r\n  transform-box: fill-box;\r\n  transform-origin: center;\r\n}\r\n\r\n@keyframes kite-float {\r\n  0% {\r\n    transform: translate(-11px, 0px) rotate(-5deg);\r\n  }\r\n  16% {\r\n    transform: translate(-6px, -1px) rotate(-2deg);\r\n  }\r\n  32% {\r\n    transform: translate(0px, -2px) rotate(1deg);\r\n  }\r\n  48% {\r\n    transform: translate(7px, -1px) rotate(4deg);\r\n  }\r\n  64% {\r\n    transform: translate(11px, 0px) rotate(6deg);\r\n  }\r\n  80% {\r\n    transform: translate(4px, 1px) rotate(3deg);\r\n  }\r\n  92% {\r\n    transform: translate(-5px, 1px) rotate(-2deg);\r\n  }\r\n  100% {\r\n    transform: translate(-11px, 0px) rotate(-5deg);\r\n  }\r\n}\r\n\r\n.kite-fu-shadowBreathe {\r\n  animation: kite-shadow-breathe 1.9s ease-in-out infinite;\r\n  opacity: 0.48;\r\n}\r\n\r\n@keyframes kite-shadow-breathe {\r\n  0% {\r\n    opacity: 0.48;\r\n  }\r\n  30% {\r\n    opacity: 0.66;\r\n  }\r\n  50% {\r\n    opacity: 0.82;\r\n  }\r\n  72% {\r\n    opacity: 0.64;\r\n  }\r\n  100% {\r\n    opacity: 0.48;\r\n  }\r\n}\r\n\r\n.kite-fu-stringSway {\r\n  animation: kite-string-sway 1.9s ease-in-out infinite;\r\n  transform-box: fill-box;\r\n  transform-origin: top center;\r\n  opacity: 0.35;\r\n}\r\n\r\n@keyframes kite-string-sway {\r\n  0% {\r\n    transform: rotate(6deg);\r\n  }\r\n  16% {\r\n    transform: rotate(3deg);\r\n  }\r\n  32% {\r\n    transform: rotate(-2deg);\r\n  }\r\n  48% {\r\n    transform: rotate(-6deg);\r\n  }\r\n  64% {\r\n    transform: rotate(-7deg);\r\n  }\r\n  80% {\r\n    transform: rotate(-1deg);\r\n  }\r\n  92% {\r\n    transform: rotate(4deg);\r\n  }\r\n  100% {\r\n    transform: rotate(6deg);\r\n  }\r\n}\r\n\r\n.kite-fu-kiteBreath {\r\n  animation: kite-breath 1.6s ease-in-out infinite;\r\n}\r\n\r\n@keyframes kite-breath {\r\n  0%,\r\n  100% {\r\n    opacity: 1;\r\n  }\r\n  50% {\r\n    opacity: 0.45;\r\n  }\r\n}\r\n\r\n.kite-fu-dot {\r\n  animation: kite-dot 1.2s ease-in-out infinite;\r\n}\r\n\r\n.kite-fu-dot1 {\r\n  animation-delay: 0.15s;\r\n}\r\n.kite-fu-dot2 {\r\n  animation-delay: 0.3s;\r\n}\r\n\r\n@keyframes kite-dot {\r\n  0%,\r\n  60%,\r\n  100% {\r\n    transform: translateY(0);\r\n    opacity: 0.3;\r\n  }\r\n  30% {\r\n    transform: translateY(-5px);\r\n    opacity: 1;\r\n  }\r\n}\r\n\r\n@keyframes kite-label-pulse {\r\n  0%,\r\n  100% {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n  50% {\r\n    opacity: 0.42;\r\n    transform: translateY(0.5px);\r\n  }\r\n}\r\n\r\n.kite-fu-loadingDots {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 6px;\r\n}\r\n\r\n.kite-fu-loadingDotsBelowBrand {\r\n  margin-top: 14px;\r\n}\r\n\r\n.kite-fu-loadingDot {\r\n  width: 6px;\r\n  height: 6px;\r\n  border-radius: 9999px;\r\n  background: var(--kite-primary);\r\n  animation: kite-dot 1.2s ease-in-out infinite;\r\n}\r\n\r\n.kite-fu-loadingDot1 {\r\n  animation-delay: 0.15s;\r\n}\r\n.kite-fu-loadingDot2 {\r\n  animation-delay: 0.3s;\r\n}\r\n\r\n.kite-fu-logoWrap {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n}\r\n\r\n.kite-fu-logoText {\r\n  margin: 0;\r\n  color: var(--kite-foreground);\r\n  letter-spacing: -0.03em;\r\n  line-height: 1;\r\n}\r\n\r\n.kite-fu-logoTextStrong {\r\n  font-weight: 600;\r\n}\r\n\r\n.kite-fu-logoTextLight {\r\n  font-weight: 300;\r\n}\r\n\r\n.kite-fu-pageWrap {\r\n  font-family: \"Inter Variable\", Inter, sans-serif;\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-weight: 400;\r\n}\r\n\r\n.kite-fu-pageWrapFullscreen {\r\n  min-height: 100vh;\r\n}\r\n\r\n.kite-fu-pageWrapOverlay {\r\n  position: fixed;\r\n  inset: 0;\r\n  z-index: 50;\r\n  background: var(--kite-overlay-background);\r\n  backdrop-filter: blur(var(--kite-overlay-blur));\r\n}\r\n\r\n.kite-fu-label {\r\n  margin: 10px 0 0;\r\n  font-size: 14px;\r\n  font-family: \"Inter Variable\", Inter, sans-serif;\r\n  font-weight: 400;\r\n  line-height: 1.4;\r\n  color: var(--kite-muted);\r\n  animation: kite-label-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\r\n}\r\n\r\n.kite-fu-loadingTextPulse {\r\n  animation: kite-label-pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\r\n}\r\n","import {\r\n  createElement,\r\n  createContext,\r\n  type CSSProperties,\r\n  type ReactNode,\r\n  useContext,\r\n} from \"react\";\r\n\r\nexport interface KiteTheme {\r\n  primary?: string;\r\n  foreground?: string;\r\n  muted?: string;\r\n  overlayBackground?: string;\r\n  overlayBlur?: string;\r\n}\r\n\r\ninterface FlyUIThemeProviderProps {\r\n  theme?: KiteTheme;\r\n  children: ReactNode;\r\n}\r\n\r\nconst FlyUIThemeContext = createContext<KiteTheme | undefined>(undefined);\r\n\r\nexport function FlyUIThemeProvider({\r\n  theme,\r\n  children,\r\n}: FlyUIThemeProviderProps) {\r\n  return createElement(FlyUIThemeContext.Provider, { value: theme }, children);\r\n}\r\n\r\nexport function useFlyUITheme() {\r\n  return useContext(FlyUIThemeContext);\r\n}\r\n\r\nexport function mergeKiteTheme(\r\n  globalTheme?: KiteTheme,\r\n  componentTheme?: KiteTheme,\r\n) {\r\n  return { ...globalTheme, ...componentTheme };\r\n}\r\n\r\nexport function buildKiteThemeStyle(theme?: KiteTheme): CSSProperties {\r\n  if (!theme) {\r\n    return {};\r\n  }\r\n\r\n  return {\r\n    ...(theme.primary ? { [\"--kite-primary\" as string]: theme.primary } : {}),\r\n    ...(theme.foreground\r\n      ? { [\"--kite-foreground\" as string]: theme.foreground }\r\n      : {}),\r\n    ...(theme.muted ? { [\"--kite-muted\" as string]: theme.muted } : {}),\r\n    ...(theme.overlayBackground\r\n      ? { [\"--kite-overlay-background\" as string]: theme.overlayBackground }\r\n      : {}),\r\n    ...(theme.overlayBlur\r\n      ? { [\"--kite-overlay-blur\" as string]: theme.overlayBlur }\r\n      : {}),\r\n  } as CSSProperties;\r\n}\r\n","import type { CSSProperties } from \"react\";\r\n\r\nimport { cn } from \"../../lib/cn\";\r\n\r\nimport styles from \"./kite-animations.module.css\";\r\nimport {\r\n  buildKiteThemeStyle,\r\n  mergeKiteTheme,\r\n  type KiteTheme,\r\n  useFlyUITheme,\r\n} from \"./theme\";\r\n\r\nconst SIZE = {\r\n  xs: { icon: 16, text: 12, gap: 6, strongWeight: 600 },\r\n  sm: { icon: 20, text: 14, gap: 8, strongWeight: 600 },\r\n  md: { icon: 24, text: 16, gap: 10, strongWeight: 600 },\r\n  lg: { icon: 28, text: 18, gap: 10, strongWeight: 700 },\r\n  xl: { icon: 40, text: 24, gap: 12, strongWeight: 700 },\r\n} as const;\r\n\r\ntype SizeKey = keyof typeof SIZE;\r\n\r\nexport interface KiteLogoProps {\r\n  size?: SizeKey;\r\n  showText?: boolean;\r\n  name?: string;\r\n  subBrand?: string;\r\n  theme?: KiteTheme;\r\n  className?: string;\r\n  textClassName?: string;\r\n  style?: CSSProperties;\r\n}\r\n\r\nfunction KiteIcon({ size }: { size: number }) {\r\n  return (\r\n    <svg\r\n      width={size}\r\n      height={size}\r\n      viewBox=\"0 0 24 24\"\r\n      fill=\"none\"\r\n      xmlns=\"http://www.w3.org/2000/svg\"\r\n      aria-hidden=\"true\"\r\n    >\r\n      <path d=\"M12 0 L0 9 L12 24 Z\" fill=\"var(--kite-primary, #0ea5e9)\" />\r\n      <path\r\n        d=\"M12 0 L24 9 L12 24 Z\"\r\n        fill=\"var(--kite-primary, #0ea5e9)\"\r\n        opacity=\"0.48\"\r\n      />\r\n    </svg>\r\n  );\r\n}\r\n\r\nexport function KiteLogo({\r\n  size = \"md\",\r\n  showText = true,\r\n  name = \"Fly\",\r\n  subBrand = \"UI\",\r\n  theme,\r\n  className,\r\n  textClassName,\r\n  style,\r\n}: KiteLogoProps) {\r\n  const cfg = SIZE[size];\r\n  const globalTheme = useFlyUITheme();\r\n  const resolvedTheme = mergeKiteTheme(globalTheme, theme);\r\n  const themeStyle = buildKiteThemeStyle(resolvedTheme);\r\n\r\n  return (\r\n    <div\r\n      className={cn(\r\n        styles[\"kite-fu-host\"],\r\n        styles[\"kite-fu-logoWrap\"],\r\n        className,\r\n      )}\r\n      style={{ ...themeStyle, ...style, gap: cfg.gap }}\r\n    >\r\n      <KiteIcon size={cfg.icon} />\r\n      {showText ? (\r\n        <span\r\n          className={cn(styles[\"kite-fu-logoText\"], textClassName)}\r\n          style={{\r\n            fontSize: `${cfg.text}px`,\r\n            fontFamily: '\"Inter Variable\", sans-serif',\r\n            letterSpacing: \"-0.03em\",\r\n            lineHeight: 1,\r\n          }}\r\n        >\r\n          <span\r\n            className={styles[\"kite-fu-logoTextStrong\"]}\r\n            style={{ fontWeight: cfg.strongWeight }}\r\n          >\r\n            {name}\r\n          </span>\r\n          <span className={styles[\"kite-fu-logoTextLight\"]}>{subBrand}</span>\r\n        </span>\r\n      ) : null}\r\n    </div>\r\n  );\r\n}\r\n","import type { CSSProperties } from \"react\";\r\n\r\nimport { cn } from \"../../lib/cn\";\r\n\r\nimport styles from \"./kite-animations.module.css\";\r\nimport {\r\n  buildKiteThemeStyle,\r\n  mergeKiteTheme,\r\n  type KiteTheme,\r\n  useFlyUITheme,\r\n} from \"./theme\";\r\n\r\nconst SIZES = {\r\n  sm: 32,\r\n  md: 48,\r\n  lg: 64,\r\n} as const;\r\n\r\ntype LoaderSize = keyof typeof SIZES;\r\n\r\nexport interface KiteLoaderProps {\r\n  size?: LoaderSize;\r\n  label?: string;\r\n  showBrand?: boolean;\r\n  name?: string;\r\n  subBrand?: string;\r\n  theme?: KiteTheme;\r\n  className?: string;\r\n  style?: CSSProperties;\r\n}\r\n\r\nexport function KiteLoader({\r\n  size = \"md\",\r\n  label,\r\n  showBrand = false,\r\n  name = \"Fly\",\r\n  subBrand = \"UI\",\r\n  theme,\r\n  className,\r\n  style,\r\n}: KiteLoaderProps) {\r\n  const px = SIZES[size];\r\n  const svgH = Math.round(px * 1.2);\r\n  const globalTheme = useFlyUITheme();\r\n  const resolvedTheme = mergeKiteTheme(globalTheme, theme);\r\n  const themeStyle = buildKiteThemeStyle(resolvedTheme);\r\n\r\n  return (\r\n    <div\r\n      className={cn(styles[\"kite-fu-host\"], className)}\r\n      role=\"status\"\r\n      aria-label={label ?? \"Loading\"}\r\n      style={{ ...themeStyle, ...style }}\r\n    >\r\n      <div\r\n        style={{\r\n          display: \"flex\",\r\n          flexDirection: \"column\",\r\n          alignItems: \"center\",\r\n          gap: 10,\r\n        }}\r\n      >\r\n        <svg\r\n          width={px}\r\n          height={svgH}\r\n          viewBox=\"0 0 24 31\"\r\n          fill=\"none\"\r\n          xmlns=\"http://www.w3.org/2000/svg\"\r\n          aria-hidden=\"true\"\r\n          overflow=\"visible\"\r\n        >\r\n          <g className={styles[\"kite-fu-skyLayer\"]} aria-hidden=\"true\">\r\n            <g className={styles[\"kite-fu-cloudSizeSm\"]}>\r\n              <g className={styles[\"kite-fu-cloudDriftHigh\"]}>\r\n                <path\r\n                  d=\"M15.4 3.8c0-0.8 0.6-1.5 1.5-1.5 0.2-1 1.1-1.8 2.1-1.8 0.7 0 1.4 0.4 1.9 1 0.2-0.1 0.5-0.1 0.7-0.1 1 0 1.9 0.9 1.9 1.9s-0.9 1.9-1.9 1.9h-4.5c-0.9 0-1.7-0.7-1.7-1.6z\"\r\n                  fill=\"var(--kite-muted, #64748b)\"\r\n                  opacity=\"0.28\"\r\n                />\r\n              </g>\r\n            </g>\r\n            <g className={styles[\"kite-fu-cloudSizeLg\"]}>\r\n              <g className={styles[\"kite-fu-cloudDriftFar\"]}>\r\n                <path\r\n                  d=\"M2.4 5.7c0-1 0.8-1.8 1.8-1.8 0.2-1.2 1.3-2.1 2.5-2.1 1 0 1.8 0.5 2.3 1.3 0.3-0.1 0.5-0.1 0.8-0.1 1.3 0 2.3 1 2.3 2.3s-1 2.3-2.3 2.3H4.4c-1.1 0-2-0.9-2-2z\"\r\n                  fill=\"var(--kite-muted, #64748b)\"\r\n                  opacity=\"0.32\"\r\n                />\r\n              </g>\r\n            </g>\r\n          </g>\r\n          <g\r\n            className={cn(\r\n              styles[\"kite-fu-float\"],\r\n              styles[\"kite-fu-kiteBreath\"],\r\n            )}\r\n          >\r\n            <g transform=\"rotate(90 12 12)\">\r\n              <path\r\n                d=\"M12 0 L0 9 L12 24 Z\"\r\n                fill=\"var(--kite-primary, #0ea5e9)\"\r\n              />\r\n              <path\r\n                d=\"M12 0 L24 9 L12 24 Z\"\r\n                fill=\"var(--kite-primary, #0ea5e9)\"\r\n                className={styles[\"kite-fu-shadowBreathe\"]}\r\n              />\r\n              <path\r\n                d=\"M12 24 Q13 28.5 12 31\"\r\n                stroke=\"var(--kite-muted, #64748b)\"\r\n                strokeWidth=\"1.5\"\r\n                strokeLinecap=\"round\"\r\n                fill=\"none\"\r\n                className={styles[\"kite-fu-stringSway\"]}\r\n              />\r\n            </g>\r\n          </g>\r\n        </svg>\r\n        {showBrand ? (\r\n          <span\r\n            className={cn(\r\n              styles[\"kite-fu-logoText\"],\r\n              styles[\"kite-fu-loadingTextPulse\"],\r\n            )}\r\n            style={{\r\n              marginTop: -2,\r\n              fontSize: 20,\r\n              fontFamily: '\"Inter Variable\", sans-serif',\r\n              letterSpacing: \"-0.03em\",\r\n              lineHeight: 1,\r\n            }}\r\n          >\r\n            <span className={styles[\"kite-fu-logoTextStrong\"]}>{name}</span>\r\n            <span className={styles[\"kite-fu-logoTextLight\"]}>{subBrand}</span>\r\n          </span>\r\n        ) : null}\r\n        {label ? <p className={styles[\"kite-fu-label\"]}>{label}</p> : null}\r\n      </div>\r\n    </div>\r\n  );\r\n}\r\n","import type { CSSProperties } from \"react\";\r\n\r\nimport { cn } from \"../../lib/cn\";\r\n\r\nimport styles from \"./kite-animations.module.css\";\r\nimport {\r\n  buildKiteThemeStyle,\r\n  mergeKiteTheme,\r\n  type KiteTheme,\r\n  useFlyUITheme,\r\n} from \"./theme\";\r\n\r\nexport interface KitePageLoaderProps {\r\n  message?: string;\r\n  overlay?: boolean;\r\n  name?: string;\r\n  subBrand?: string;\r\n  theme?: KiteTheme;\r\n  className?: string;\r\n  style?: CSSProperties;\r\n}\r\n\r\nexport function KitePageLoader({\r\n  message,\r\n  overlay = false,\r\n  name = \"Fly\",\r\n  subBrand = \"UI\",\r\n  theme,\r\n  className,\r\n  style,\r\n}: KitePageLoaderProps) {\r\n  const globalTheme = useFlyUITheme();\r\n  const resolvedTheme = mergeKiteTheme(globalTheme, theme);\r\n  const themeStyle = buildKiteThemeStyle(resolvedTheme);\r\n\r\n  return (\r\n    <div\r\n      role=\"status\"\r\n      aria-live=\"polite\"\r\n      aria-label={message ?? \"Loading\"}\r\n      className={cn(\r\n        styles[\"kite-fu-host\"],\r\n        styles[\"kite-fu-pageWrap\"],\r\n        overlay\r\n          ? styles[\"kite-fu-pageWrapOverlay\"]\r\n          : styles[\"kite-fu-pageWrapFullscreen\"],\r\n        className,\r\n      )}\r\n      style={{ ...themeStyle, ...style }}\r\n    >\r\n      <svg\r\n        width={56}\r\n        height={58}\r\n        viewBox=\"0 0 24 31\"\r\n        fill=\"none\"\r\n        xmlns=\"http://www.w3.org/2000/svg\"\r\n        aria-hidden=\"true\"\r\n        overflow=\"visible\"\r\n      >\r\n        <g className={styles[\"kite-fu-skyLayer\"]} aria-hidden=\"true\">\r\n          <g className={styles[\"kite-fu-cloudSizeSm\"]}>\r\n            <g className={styles[\"kite-fu-cloudDriftHigh\"]}>\r\n              <path\r\n                d=\"M14.8 3.3c0-0.8 0.6-1.5 1.5-1.5 0.2-1 1.1-1.8 2.2-1.8 0.8 0 1.4 0.4 1.9 1 0.2-0.1 0.5-0.1 0.8-0.1 1 0 1.8 0.8 1.8 1.8s-0.8 1.8-1.8 1.8h-4.7c-0.9 0-1.7-0.6-1.7-1.2z\"\r\n                fill=\"var(--kite-muted, #64748b)\"\r\n                opacity=\"0.28\"\r\n              />\r\n            </g>\r\n          </g>\r\n          <g className={styles[\"kite-fu-cloudSizeLg\"]}>\r\n            <g className={styles[\"kite-fu-cloudDriftFar\"]}>\r\n              <path\r\n                d=\"M1.5 5.5c0-1.1 0.9-2 2-2 0.2-1.4 1.4-2.4 2.9-2.4 1.1 0 2 0.5 2.6 1.4 0.3-0.1 0.6-0.2 1-0.2 1.4 0 2.6 1.1 2.6 2.6s-1.2 2.6-2.6 2.6h-6.3c-1.3 0-2.3-0.9-2.3-2z\"\r\n                fill=\"var(--kite-muted, #64748b)\"\r\n                opacity=\"0.32\"\r\n              />\r\n            </g>\r\n          </g>\r\n        </g>\r\n        <g\r\n          className={cn(styles[\"kite-fu-float\"], styles[\"kite-fu-kiteBreath\"])}\r\n        >\r\n          <g transform=\"rotate(90 12 12)\">\r\n            <path d=\"M12 0 L0 9 L12 24 Z\" fill=\"var(--kite-primary, #0ea5e9)\" />\r\n            <path\r\n              d=\"M12 0 L24 9 L12 24 Z\"\r\n              fill=\"var(--kite-primary, #0ea5e9)\"\r\n              className={styles[\"kite-fu-shadowBreathe\"]}\r\n            />\r\n            <path\r\n              d=\"M12 24 Q13 28.5 12 31\"\r\n              stroke=\"var(--kite-muted, #64748b)\"\r\n              strokeWidth=\"1.5\"\r\n              strokeLinecap=\"round\"\r\n              fill=\"none\"\r\n              className={styles[\"kite-fu-stringSway\"]}\r\n            />\r\n          </g>\r\n        </g>\r\n      </svg>\r\n\r\n      <span\r\n        className={cn(\r\n          styles[\"kite-fu-logoText\"],\r\n          styles[\"kite-fu-loadingTextPulse\"],\r\n        )}\r\n        style={{\r\n          marginTop: -2,\r\n          fontSize: 20,\r\n          fontFamily: '\"Inter Variable\", sans-serif',\r\n          letterSpacing: \"-0.03em\",\r\n          lineHeight: 1,\r\n        }}\r\n      >\r\n        <span className={styles[\"kite-fu-logoTextStrong\"]}>{name}</span>\r\n        <span className={styles[\"kite-fu-logoTextLight\"]}>{subBrand}</span>\r\n      </span>\r\n\r\n      <div\r\n        className={cn(\r\n          styles[\"kite-fu-loadingDots\"],\r\n          styles[\"kite-fu-loadingDotsBelowBrand\"],\r\n        )}\r\n        aria-hidden=\"true\"\r\n      >\r\n        <span className={styles[\"kite-fu-loadingDot\"]} />\r\n        <span\r\n          className={cn(\r\n            styles[\"kite-fu-loadingDot\"],\r\n            styles[\"kite-fu-loadingDot1\"],\r\n          )}\r\n        />\r\n        <span\r\n          className={cn(\r\n            styles[\"kite-fu-loadingDot\"],\r\n            styles[\"kite-fu-loadingDot2\"],\r\n          )}\r\n        />\r\n      </div>\r\n\r\n      {message ? <p className={styles[\"kite-fu-label\"]}>{message}</p> : null}\r\n    </div>\r\n  );\r\n}\r\n","import type { CSSProperties } from \"react\";\r\n\r\nimport { cn } from \"../../lib/cn\";\r\n\r\nimport styles from \"../kite/kite-animations.module.css\";\r\nimport {\r\n  buildKiteThemeStyle,\r\n  mergeKiteTheme,\r\n  type KiteTheme,\r\n  useFlyUITheme,\r\n} from \"../kite/theme\";\r\n\r\nexport interface LoadingProps {\r\n  className?: string;\r\n  label?: string;\r\n  theme?: KiteTheme;\r\n  style?: CSSProperties;\r\n}\r\n\r\nexport function Loading({ className, label, theme, style }: LoadingProps) {\r\n  const globalTheme = useFlyUITheme();\r\n  const resolvedTheme = mergeKiteTheme(globalTheme, theme);\r\n  const themeStyle = buildKiteThemeStyle(resolvedTheme);\r\n\r\n  return (\r\n    <div\r\n      className={cn(styles[\"kite-fu-host\"], className)}\r\n      role=\"status\"\r\n      aria-label={label ?? \"Loading\"}\r\n      style={{ ...themeStyle, ...style }}\r\n    >\r\n      <div className={styles[\"kite-fu-loadingDots\"]}>\r\n        <span className={styles[\"kite-fu-loadingDot\"]} />\r\n        <span\r\n          className={cn(\r\n            styles[\"kite-fu-loadingDot\"],\r\n            styles[\"kite-fu-loadingDot1\"],\r\n          )}\r\n        />\r\n        <span\r\n          className={cn(\r\n            styles[\"kite-fu-loadingDot\"],\r\n            styles[\"kite-fu-loadingDot2\"],\r\n          )}\r\n        />\r\n      </div>\r\n    </div>\r\n  );\r\n}\r\n"],"mappings":"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","names":["jsx","jsxs","jsx","jsxs","jsx","jsxs"]}

package/package.json

@@ -0,0 +1,74 @@
+{
+  "name": "@kitelus/fly-ui",
+  "private": false,
+  "version": "0.1.0",
+  "description": "Fly UI - isolated React component library with modern Storybook docs",
+  "license": "MIT",
+  "type": "module",
+  "homepage": "https://kitelus.github.io/fly-ui/",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "npm run build:lib",
+    "build:lib": "tsup",
+    "lint": "eslint .",
+    "preview": "vite preview",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build -o storybook-static",
+    "test-storybook": "vitest run",
+    "prepublishOnly": "npm run build:lib"
+  },
+  "peerDependencies": {
+    "react": ">=18",
+    "react-dom": ">=18"
+  },
+  "dependencies": {
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4"
+  },
+  "devDependencies": {
+    "@chromatic-com/storybook": "^5.1.1",
+    "@eslint/js": "^9.39.4",
+    "@storybook/addon-a11y": "^10.3.4",
+    "@storybook/addon-docs": "^10.3.4",
+    "@storybook/addon-themes": "^10.3.4",
+    "@storybook/addon-vitest": "^10.3.4",
+    "@storybook/react-vite": "^10.3.4",
+    "@types/node": "^24.12.0",
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^6.0.1",
+    "@vitest/browser-playwright": "^4.1.2",
+    "@vitest/coverage-v8": "^4.1.2",
+    "eslint": "^9.39.4",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "eslint-plugin-react-refresh": "^0.5.2",
+    "eslint-plugin-storybook": "^10.3.4",
+    "globals": "^17.4.0",
+    "playwright": "^1.59.1",
+    "storybook": "^10.3.4",
+    "tsup": "^8.5.1",
+    "typescript": "~5.9.3",
+    "typescript-eslint": "^8.57.0",
+    "vite": "^8.0.1",
+    "vitest": "^4.1.2"
+  }
+}