@teja-app/ui 0.0.7 → 0.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/components/Select/Select.d.ts.map +1 -1
  2. package/dist/hooks/useFeatureFlags.d.ts +69 -0
  3. package/dist/hooks/useFeatureFlags.d.ts.map +1 -0
  4. package/dist/index.cjs +6 -9
  5. package/dist/index.cjs.map +1 -1
  6. package/dist/index.js +6 -9
  7. package/dist/index.js.map +1 -1
  8. package/package.json +2 -2
package/dist/components/Select/Select.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,MAAM,CAAC,EACrB,OAAO,EACP,KAAK,EACL,QAAQ,EACR,WAAyB,EACzB,KAAK,EACL,KAAK,EACL,UAAU,EACV,QAAgB,EAChB,QAAgB,EAChB,SAAiB,EACjB,SAAS,EACT,SAAiB,EACjB,WAA0B,EAC1B,SAAoB,EACpB,MAAM,GACP,EAAE,WAAW,2CAgJb;yBAhKe,MAAM"}
1
+ {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAElD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,MAAM,CAAC,EACrB,OAAO,EACP,KAAK,EACL,QAAQ,EACR,WAAyB,EACzB,KAAK,EACL,KAAK,EACL,UAAU,EACV,QAAgB,EAChB,QAAgB,EAChB,SAAiB,EACjB,SAAS,EACT,SAAiB,EACjB,WAA0B,EAC1B,SAAoB,EACpB,MAAM,GACP,EAAE,WAAW,2CA6Ib;yBA7Je,MAAM"}
package/dist/hooks/useFeatureFlags.d.ts ADDED
@@ -0,0 +1,69 @@
1
+ import { type ReactNode } from "react";
2
+ /**
3
+ * Feature Flag Hook for React applications
4
+ *
5
+ * Provides feature flag support for trunk-based development.
6
+ * Flags can be loaded from:
7
+ * 1. Backend API endpoint (recommended for user-specific rollouts)
8
+ * 2. Fallback flags passed as props
9
+ *
10
+ * Usage:
11
+ * // In App.tsx
12
+ * <FeatureFlagProvider apiUrl="/api/feature-flags" userId={user?.id}>
13
+ * <App />
14
+ * </FeatureFlagProvider>
15
+ *
16
+ * // In components
17
+ * const { isEnabled, isLoading } = useFeatureFlags();
18
+ * if (isEnabled('new-calendar-ui')) {
19
+ * return <NewCalendar />;
20
+ * }
21
+ */
22
+ export interface FeatureFlag {
23
+ enabled: boolean;
24
+ rolloutPercentage?: number;
25
+ }
26
+ export interface FeatureFlags {
27
+ [key: string]: FeatureFlag;
28
+ }
29
+ interface FeatureFlagContextValue {
30
+ flags: FeatureFlags;
31
+ isLoading: boolean;
32
+ error: Error | null;
33
+ isEnabled: (flagName: string) => boolean;
34
+ reload: () => Promise<void>;
35
+ }
36
+ interface FeatureFlagProviderProps {
37
+ children: ReactNode;
38
+ /** API endpoint to fetch flags (e.g., '/api/feature-flags') */
39
+ apiUrl?: string;
40
+ /** User ID for percentage-based rollouts */
41
+ userId?: string;
42
+ /** Fallback flags when API is unavailable */
43
+ fallbackFlags?: FeatureFlags;
44
+ /** Skip API fetch entirely, use only fallback flags */
45
+ skipApi?: boolean;
46
+ }
47
+ export declare function FeatureFlagProvider({ children, apiUrl, userId, fallbackFlags, skipApi, }: FeatureFlagProviderProps): import("react/jsx-runtime").JSX.Element;
48
+ /**
49
+ * Hook to access feature flags
50
+ *
51
+ * @example
52
+ * const { isEnabled } = useFeatureFlags();
53
+ * if (isEnabled('new-feature')) {
54
+ * return <NewFeature />;
55
+ * }
56
+ */
57
+ export declare function useFeatureFlags(): FeatureFlagContextValue;
58
+ /**
59
+ * Convenience hook to check a single feature flag
60
+ *
61
+ * @example
62
+ * const isNewUIEnabled = useFeatureFlag('new-ui');
63
+ * if (isNewUIEnabled) {
64
+ * return <NewUI />;
65
+ * }
66
+ */
67
+ export declare function useFeatureFlag(flagName: string): boolean;
68
+ export {};
69
+ //# sourceMappingURL=useFeatureFlags.d.ts.map
package/dist/hooks/useFeatureFlags.d.ts.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useFeatureFlags.d.ts","sourceRoot":"","sources":["../../src/hooks/useFeatureFlags.tsx"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,MAAM,WAAW,WAAW;IAC1B,OAAO,EAAE,OAAO,CAAC;IACjB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED,MAAM,WAAW,YAAY;IAC3B,CAAC,GAAG,EAAE,MAAM,GAAG,WAAW,CAAC;CAC5B;AAED,UAAU,uBAAuB;IAC/B,KAAK,EAAE,YAAY,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;IACpB,SAAS,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC;IACzC,MAAM,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CAC7B;AAID,UAAU,wBAAwB;IAChC,QAAQ,EAAE,SAAS,CAAC;IACpB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,4CAA4C;IAC5C,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,6CAA6C;IAC7C,aAAa,CAAC,EAAE,YAAY,CAAC;IAC7B,uDAAuD;IACvD,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAeD,wBAAgB,mBAAmB,CAAC,EAClC,QAAQ,EACR,MAAM,EACN,MAAM,EACN,aAAa,EACb,OAAe,GAChB,EAAE,wBAAwB,2CAgF1B;AAED;;;;;;;;GAQG;AACH,wBAAgB,eAAe,IAAI,uBAAuB,CAgBzD;AAED;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAGxD"}
package/dist/index.cjs CHANGED
@@ -7347,11 +7347,8 @@ function Select({
7347
7347
  children: /* @__PURE__ */ jsxRuntime.jsx(
7348
7348
  Bt,
7349
7349
  {
7350
- portal: true,
7351
- className: utils_index.cn(
7352
- "absolute z-dropdown max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-sm shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:bg-primary-800 dark:ring-primary-700",
7353
- placement === "top" ? "bottom-full mb-1" : "top-full mt-1"
7354
- ),
7350
+ anchor: placement === "top" ? "top start" : "bottom start",
7351
+ className: "z-dropdown max-h-60 w-[var(--button-width)] overflow-auto rounded-md bg-white py-1 text-sm shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:bg-primary-800 dark:ring-primary-700 [--anchor-gap:4px]",
7355
7352
  "data-testid": testId ? `${testId}-options` : void 0,
7356
7353
  children: options.map((option, index2) => /* @__PURE__ */ jsxRuntime.jsx(
7357
7354
  It,
@@ -8307,8 +8304,8 @@ function Combobox({
8307
8304
  children: /* @__PURE__ */ jsxRuntime.jsx(
8308
8305
  Uo,
8309
8306
  {
8310
- portal: true,
8311
- className: "absolute z-dropdown mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-sm shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:bg-primary-800 dark:ring-primary-700",
8307
+ anchor: "bottom start",
8308
+ className: "z-dropdown max-h-60 w-[var(--input-width)] overflow-auto rounded-md bg-white py-1 text-sm shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:bg-primary-800 dark:ring-primary-700 [--anchor-gap:4px]",
8312
8309
  "data-testid": testId ? `${testId}-options` : void 0,
8313
8310
  children: isLoading ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-center gap-2 px-4 py-2.5 text-primary-500 dark:text-primary-400", children: [
8314
8311
  /* @__PURE__ */ jsxRuntime.jsx(Spinner, { size: "sm", color: "primary" }),
@@ -9516,9 +9513,9 @@ function MultiSelect({
9516
9513
  children: /* @__PURE__ */ jsxRuntime.jsx(
9517
9514
  Bt,
9518
9515
  {
9519
- portal: true,
9516
+ anchor: "bottom start",
9520
9517
  static: true,
9521
- className: "absolute z-dropdown mt-1 max-h-60 w-full overflow-auto rounded-md bg-white py-1 text-sm shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:bg-primary-800 dark:ring-primary-700",
9518
+ className: "z-dropdown max-h-60 w-[var(--button-width)] overflow-auto rounded-md bg-white py-1 text-sm shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none dark:bg-primary-800 dark:ring-primary-700 [--anchor-gap:4px]",
9522
9519
  "data-testid": testId ? `${testId}-options` : void 0,
9523
9520
  children: isLoading ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-center gap-2 px-4 py-2.5 text-primary-500 dark:text-primary-400", children: [
9524
9521
  /* @__PURE__ */ jsxRuntime.jsx(Spinner, { size: "sm", color: "primary" }),