@cdx-ui/components 0.3.7 → 0.3.8

package/lib/module/components/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["ColorSwatch","HStack","VStack"],"sourceRoot":"../../../src","sources":["components/index.ts"],"mappings":";;AAAA,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,OAAO;AACrB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,aAAa;AAC3B,cAAc,cAAc;AAC5B,cAAc,eAAe;AAC7B,cAAc,eAAe;AAC7B,SAASA,WAAW,QAA6D,eAAe;AAChG,cAAc,qBAAqB;AACnC,cAAc,iBAAiB;AAC/B,cAAc,aAAa;AAC3B,cAAc,YAAY;AAC1B,cAAc,iBAAiB;AAC/B,cAAc,iBAAiB;AAC/B,cAAc,cAAc;AAC5B,cAAc,mBAAmB;AACjC,cAAc,eAAe;AAC7B,cAAc,iBAAiB;AAC/B,cAAc,gBAAgB;AAC9B,cAAc,kBAAkB;AAChC,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,oBAAoB;AAClC,cAAc,SAAS;AACvB,cAAc,WAAW;AACzB,cAAc,gBAAgB;AAC9B,cAAc,uBAAuB;AACrC,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,mBAAmB;AACjC,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,aAAa;AAC3B,cAAc,QAAQ;AACtB,cAAc,eAAe;AAC7B,cAAc,kBAAkB;AAChC,cAAc,YAAY;AAC1B,cAAc,YAAY;AAC1B,cAAc,aAAa;AAC3B,cAAc,YAAY;AAC1B,cAAc,qBAAqB;AACnC,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,gBAAgB;AAC9B,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,mBAAmB;AAMjC,cAAc,UAAU;AACxB,cAAc,eAAe;AAC7B,cAAc,QAAQ;AACtB,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,gBAAgB;AAC9B,cAAc,SAAS;AACvB,cAAc,WAAW;AACzB,SAASC,MAAM,EAAEC,MAAM,QAAQ,SAAS;AACxC,cAAc,WAAW;AACzB,cAAc,QAAQ;AACtB,cAAc,QAAQ;AACtB,cAAc,eAAe;AAC7B,cAAc,cAAc;AAC5B,cAAc,qBAAqB","ignoreList":[]}
+{"version":3,"names":["ColorSwatch","HStack","VStack"],"sourceRoot":"../../../src","sources":["components/index.ts"],"mappings":";;AAAA,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,OAAO;AACrB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,aAAa;AAC3B,cAAc,cAAc;AAC5B,cAAc,eAAe;AAC7B,cAAc,eAAe;AAC7B,SAASA,WAAW,QAA6D,eAAe;AAChG,cAAc,qBAAqB;AACnC,cAAc,iBAAiB;AAC/B,cAAc,aAAa;AAC3B,cAAc,YAAY;AAC1B,cAAc,iBAAiB;AAC/B,cAAc,iBAAiB;AAC/B,cAAc,cAAc;AAC5B,cAAc,mBAAmB;AACjC,cAAc,eAAe;AAC7B,cAAc,iBAAiB;AAC/B,cAAc,gBAAgB;AAC9B,cAAc,kBAAkB;AAChC,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,oBAAoB;AAClC,cAAc,SAAS;AACvB,cAAc,WAAW;AACzB,cAAc,gBAAgB;AAC9B,cAAc,uBAAuB;AACrC,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,mBAAmB;AACjC,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,aAAa;AAC3B,cAAc,QAAQ;AACtB,cAAc,eAAe;AAC7B,cAAc,kBAAkB;AAChC,cAAc,YAAY;AAC1B,cAAc,YAAY;AAC1B,cAAc,aAAa;AAC3B,cAAc,YAAY;AAC1B,cAAc,qBAAqB;AACnC,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,gBAAgB;AAC9B,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,mBAAmB;AAMjC,cAAc,UAAU;AACxB,cAAc,eAAe;AAC7B,cAAc,QAAQ;AACtB,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,gBAAgB;AAC9B,cAAc,SAAS;AACvB,cAAc,WAAW;AACzB,SAASC,MAAM,EAAEC,MAAM,QAAQ,SAAS;AACxC,cAAc,WAAW;AACzB,cAAc,QAAQ;AACtB,cAAc,QAAQ;AACtB,cAAc,eAAe;AAC7B,cAAc,gBAAgB;AAC9B,cAAc,cAAc;AAC5B,cAAc,qBAAqB","ignoreList":[]}

package/lib/typescript/components/CountryFlag/index.d.ts

@@ -2,11 +2,16 @@ import { type FlagCode } from '@cdx-ui/icons/flags';
 import { type IconProps } from '../Icon';
 export type { FlagCode };
 export interface CountryFlagProps extends Omit<IconProps, 'as' | 'filled' | 'color'> {
-    /** ISO 3166-1 alpha-2 country code. */
+    /**
+     * Code from the country-flag-icons 3x2 set. Includes officially assigned
+     * ISO 3166-1 alpha-2 codes, the unofficial codes that package ships for
+     * libphonenumber-js, and its subdivision codes. Subdivision codes keep
+     * their hyphen (`GB-ENG`).
+     */
     code: FlagCode;
 }
 /**
- * Renders the country flag for an ISO 3166-1 alpha-2 code.
+ * Renders the flag for a country-flag-icons code, including unofficial libphonenumber-js codes.
  *
  * The flag is drawn through `Icon`, so `className` sizing and `asChild` icon slots
  * apply. Flag artwork keeps its own colors. The flag is decorative unless
@@ -22,7 +27,7 @@ export interface CountryFlagProps extends Omit<IconProps, 'as' | 'filled' | 'col
  * <CountryFlag code="US" className="size-6" accessibilityLabel="United States" />
  * ```
  *
- * @param {FlagCode} code - ISO 3166-1 alpha-2 country code.
+ * @param {FlagCode} code - Code from the country-flag-icons 3x2 set. Subdivision codes keep their hyphen (`GB-ENG`).
  * @param {string} className - Utility classes for size and placement, merged after the default `size-5` box.
  * @param {string} accessibilityLabel - When set, the flag is announced as an image with this name.
  * @param {object} style - Style overrides passed through to the icon.

package/lib/typescript/components/CountryFlag/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/CountryFlag/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAS,KAAK,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAG3D,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,SAAS,CAAC;AAE/C,YAAY,EAAE,QAAQ,EAAE,CAAC;AAEzB,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,SAAS,EAAE,IAAI,GAAG,QAAQ,GAAG,OAAO,CAAC;IAClF,uCAAuC;IACvC,IAAI,EAAE,QAAQ,CAAC;CAChB;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,WAAW,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,kDAe1E;yBAfe,WAAW"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/CountryFlag/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAS,KAAK,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAG3D,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,SAAS,CAAC;AAE/C,YAAY,EAAE,QAAQ,EAAE,CAAC;AAEzB,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,SAAS,EAAE,IAAI,GAAG,QAAQ,GAAG,OAAO,CAAC;IAClF;;;;;OAKG;IACH,IAAI,EAAE,QAAQ,CAAC;CAChB;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,WAAW,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,kDAe1E;yBAfe,WAAW"}

package/lib/typescript/components/CurrencyFlag/index.d.ts

@@ -0,0 +1,47 @@
+import { type FlagCode } from '@cdx-ui/icons/flags';
+import { type IconProps } from '../Icon';
+export interface CurrencyFlagProps extends Omit<IconProps, 'as' | 'filled' | 'color'> {
+    /** ISO 4217 alphabetic currency code, such as `USD` or `EUR`. */
+    code: string;
+}
+/**
+ * Returns the flag code for the country or union that issues an ISO 4217 currency.
+ *
+ * National codes start with the issuer's ISO 3166-1 alpha-2 code (`DKK` → `DK`), so a
+ * currency shared by several countries resolves to its issuer. `EUR` resolves to `EU`.
+ * `X` codes (`XOF`, `XCD`, `XAU`) have no single issuer and resolve to `undefined`, as
+ * do malformed codes.
+ */
+export declare function currencyFlagCode(code: string): FlagCode | undefined;
+/**
+ * Renders the flag of the country or union that issues an ISO 4217 currency.
+ *
+ * The flag shows the issuer, not the user's country: `DKK` renders Denmark's flag for
+ * accounts in Greenland too. Use `CountryFlag` with a country code when the flag should
+ * show where the user is. Codes with no single issuer, such as `XOF` and `XCD`, render
+ * nothing and log a warning in development.
+ *
+ * The flag is drawn through `Icon`, so `className` sizing and `asChild` icon slots
+ * apply. Flag artwork keeps its own colors. The flag is decorative unless
+ * `accessibilityLabel` is set.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * import { CurrencyFlag } from '@cdx-ui/components';
+ *
+ * <CurrencyFlag code="USD" />
+ * <CurrencyFlag code="EUR" className="size-6" accessibilityLabel="Euro" />
+ * ```
+ *
+ * @param {string} code - ISO 4217 alphabetic currency code.
+ * @param {string} className - Utility classes for size and placement, merged after the default `size-5` box.
+ * @param {string} accessibilityLabel - When set, the flag is announced as an image with this name.
+ * @param {object} style - Style overrides passed through to the icon.
+ * @param {string} data-testid - Test identifier forwarded to the rendered icon.
+ */
+export declare function CurrencyFlag({ code, className, ...props }: CurrencyFlagProps): import("react/jsx-runtime").JSX.Element | null;
+export declare namespace CurrencyFlag {
+    var displayName: string;
+}
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/components/CurrencyFlag/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/CurrencyFlag/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAS,KAAK,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAG3D,OAAO,EAAQ,KAAK,SAAS,EAAE,MAAM,SAAS,CAAC;AAE/C,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,SAAS,EAAE,IAAI,GAAG,QAAQ,GAAG,OAAO,CAAC;IACnF,iEAAiE;IACjE,IAAI,EAAE,MAAM,CAAC;CACd;AAED;;;;;;;GAOG;AACH,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,MAAM,GAAG,QAAQ,GAAG,SAAS,CAOnE;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,YAAY,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,iBAAiB,kDAc5E;yBAde,YAAY"}

package/lib/typescript/components/CurrencyInput/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/CurrencyInput/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAQ,KAAK,SAAS,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AACzF,OAAO,EAIL,KAAK,gBAAgB,EACtB,MAAM,oBAAoB,CAAC;AAE5B,OAAO,EACL,KAAK,yBAAyB,EAI/B,MAAM,UAAU,CAAC;AAqBlB,MAAM,WAAW,kBACf,SACE,gBAAgB,EAChB,yBAAyB,EACzB,IAAI,CACF,cAAc,EACd,oBAAoB,GAAG,mBAAmB,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,GAAG,eAAe,CAC/F;IACH,wGAAwG;IACxG,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uGAAuG;IACvG,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;CAC5B;AAED,eAAO,MAAM,aAAa,0GA+JzB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/CurrencyInput/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAQ,KAAK,SAAS,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AACzF,OAAO,EAIL,KAAK,gBAAgB,EACtB,MAAM,oBAAoB,CAAC;AAE5B,OAAO,EACL,KAAK,yBAAyB,EAI/B,MAAM,UAAU,CAAC;AAqBlB,MAAM,WAAW,kBACf,SACE,gBAAgB,EAChB,yBAAyB,EACzB,IAAI,CACF,cAAc,EACd,oBAAoB,GAAG,mBAAmB,GAAG,QAAQ,GAAG,SAAS,GAAG,QAAQ,GAAG,eAAe,CAC/F;IACH,wGAAwG;IACxG,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uGAAuG;IACvG,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;CAC5B;AAED,eAAO,MAAM,aAAa,0GAgKzB,CAAC"}

package/lib/typescript/components/CurrencyInput/styles.d.ts

@@ -11,9 +11,14 @@ export interface CurrencyInputVariantProps {
      * @default 'default'
      */
     size?: 'default' | 'small';
+    /**
+     * Horizontal alignment of the amount. Defaults to `center` on `ghost`. On `outline`, the amount
+     * stays at the start of the field until `align` is set.
+     */
+    align?: 'center' | 'end';
 }
 export declare const currencyInputRootVariants: ({ variant, size, }?: CurrencyInputVariantProps) => string;
-export declare const currencyInputFieldVariants: ({ variant, size, }?: CurrencyInputVariantProps) => string;
+export declare const currencyInputFieldVariants: ({ variant, size, align, }?: CurrencyInputVariantProps) => string;
 export declare const currencyInputPrefixVariants: (props?: ({
     size?: "small" | "default" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;

package/lib/typescript/components/CurrencyInput/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/CurrencyInput/styles.ts"],"names":[],"mappings":"AAIA,MAAM,WAAW,yBAAyB;IACxC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;CAC5B;AA6CD,eAAO,MAAM,yBAAyB,GAAI,qBAGvC,yBAA8B,KAAG,MAGU,CAAC;AAE/C,eAAO,MAAM,0BAA0B,GAAI,qBAGxC,yBAA8B,KAAG,MAC8D,CAAC;AAGnG,eAAO,MAAM,2BAA2B;;8EAavC,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/components/CurrencyInput/styles.ts"],"names":[],"mappings":"AAKA,MAAM,WAAW,yBAAyB;IACxC;;;;;OAKG;IACH,OAAO,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAC9B;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC3B;;;OAGG;IACH,KAAK,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAC;CAC1B;AAwDD,eAAO,MAAM,yBAAyB,GAAI,qBAGvC,yBAA8B,KAAG,MAGU,CAAC;AAE/C,eAAO,MAAM,0BAA0B,GAAI,4BAIxC,yBAA8B,KAAG,MASnC,CAAC;AAGF,eAAO,MAAM,2BAA2B;;8EAavC,CAAC"}

package/lib/typescript/components/index.d.ts

@@ -73,6 +73,7 @@ export * from './Heading';
 export * from './Text';
 export * from './Icon';
 export * from './CountryFlag';
+export * from './CurrencyFlag';
 export * from './IconButton';
 export * from './QuickActionButton';
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,OAAO,CAAC;AACtB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,KAAK,uBAAuB,EAAE,MAAM,eAAe,CAAC;AACjG,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,mBAAmB,CAAC;AAClC,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,kBAAkB,CAAC;AACjC,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,oBAAoB,CAAC;AACnC,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,uBAAuB,CAAC;AACtC,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,mBAAmB,CAAC;AAClC,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,qBAAqB,CAAC;AACpC,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,mBAAmB,CAAC;AAClC,YAAY,EACV,qBAAqB,EACrB,oBAAoB,EACpB,6BAA6B,GAC9B,MAAM,yBAAyB,CAAC;AACjC,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AACzC,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,OAAO,CAAC;AACtB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,KAAK,uBAAuB,EAAE,MAAM,eAAe,CAAC;AACjG,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,mBAAmB,CAAC;AAClC,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,kBAAkB,CAAC;AACjC,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,QAAQ,CAAC;AACvB,cAAc,oBAAoB,CAAC;AACnC,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,uBAAuB,CAAC;AACtC,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,mBAAmB,CAAC;AAClC,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,YAAY,CAAC;AAC3B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC;AAC3B,cAAc,qBAAqB,CAAC;AACpC,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,WAAW,CAAC;AAC1B,cAAc,mBAAmB,CAAC;AAClC,YAAY,EACV,qBAAqB,EACrB,oBAAoB,EACpB,6BAA6B,GAC9B,MAAM,yBAAyB,CAAC;AACjC,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AACzC,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,QAAQ,CAAC;AACvB,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cdx-ui/components",
-  "version": "0.3.7",
+  "version": "0.3.8",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -106,10 +106,10 @@
     "@marceloterreiro/flash-calendar": "2.0.0",
     "react-native-reanimated-carousel": "5.0.0-beta.5",
     "uniwind": "1.10.0",
-    "@cdx-ui/formatters": "0.3.7",
-    "@cdx-ui/icons": "0.3.7",
-    "@cdx-ui/utils": "0.3.7",
-    "@cdx-ui/primitives": "0.3.7"
+    "@cdx-ui/formatters": "0.3.8",
+    "@cdx-ui/icons": "0.3.8",
+    "@cdx-ui/primitives": "0.3.8",
+    "@cdx-ui/utils": "0.3.8"
   },
   "devDependencies": {
     "@dnd-kit/core": "6.3.1",

package/src/components/CountryFlag/index.tsx

@@ -6,12 +6,17 @@ import { Icon, type IconProps } from '../Icon';
 export type { FlagCode };
 
 export interface CountryFlagProps extends Omit<IconProps, 'as' | 'filled' | 'color'> {
-  /** ISO 3166-1 alpha-2 country code. */
+  /**
+   * Code from the country-flag-icons 3x2 set. Includes officially assigned
+   * ISO 3166-1 alpha-2 codes, the unofficial codes that package ships for
+   * libphonenumber-js, and its subdivision codes. Subdivision codes keep
+   * their hyphen (`GB-ENG`).
+   */
   code: FlagCode;
 }
 
 /**
- * Renders the country flag for an ISO 3166-1 alpha-2 code.
+ * Renders the flag for a country-flag-icons code, including unofficial libphonenumber-js codes.
  *
  * The flag is drawn through `Icon`, so `className` sizing and `asChild` icon slots
  * apply. Flag artwork keeps its own colors. The flag is decorative unless
@@ -27,7 +32,7 @@ export interface CountryFlagProps extends Omit<IconProps, 'as' | 'filled' | 'col
  * <CountryFlag code="US" className="size-6" accessibilityLabel="United States" />
  * ```
  *
- * @param {FlagCode} code - ISO 3166-1 alpha-2 country code.
+ * @param {FlagCode} code - Code from the country-flag-icons 3x2 set. Subdivision codes keep their hyphen (`GB-ENG`).
  * @param {string} className - Utility classes for size and placement, merged after the default `size-5` box.
  * @param {string} accessibilityLabel - When set, the flag is announced as an image with this name.
  * @param {object} style - Style overrides passed through to the icon.

package/src/components/CurrencyFlag/index.tsx

@@ -0,0 +1,71 @@
+import { flags, type FlagCode } from '@cdx-ui/icons/flags';
+import { dataAttributes, mergeDataAttributes } from '@cdx-ui/primitives';
+import { cn } from '@cdx-ui/utils';
+import { Icon, type IconProps } from '../Icon';
+
+export interface CurrencyFlagProps extends Omit<IconProps, 'as' | 'filled' | 'color'> {
+  /** ISO 4217 alphabetic currency code, such as `USD` or `EUR`. */
+  code: string;
+}
+
+/**
+ * Returns the flag code for the country or union that issues an ISO 4217 currency.
+ *
+ * National codes start with the issuer's ISO 3166-1 alpha-2 code (`DKK` → `DK`), so a
+ * currency shared by several countries resolves to its issuer. `EUR` resolves to `EU`.
+ * `X` codes (`XOF`, `XCD`, `XAU`) have no single issuer and resolve to `undefined`, as
+ * do malformed codes.
+ */
+export function currencyFlagCode(code: string): FlagCode | undefined {
+  if (!/^[A-Z]{3}$/.test(code)) return undefined;
+  if (code === 'EUR') return 'EU';
+  // `X` prefixes would otherwise hit user-assigned flags (`XAF` → `XA`, `XCD` → `XC`).
+  if (code.startsWith('X')) return undefined;
+  const region = code.slice(0, 2);
+  return Object.prototype.hasOwnProperty.call(flags, region) ? (region as FlagCode) : undefined;
+}
+
+/**
+ * Renders the flag of the country or union that issues an ISO 4217 currency.
+ *
+ * The flag shows the issuer, not the user's country: `DKK` renders Denmark's flag for
+ * accounts in Greenland too. Use `CountryFlag` with a country code when the flag should
+ * show where the user is. Codes with no single issuer, such as `XOF` and `XCD`, render
+ * nothing and log a warning in development.
+ *
+ * The flag is drawn through `Icon`, so `className` sizing and `asChild` icon slots
+ * apply. Flag artwork keeps its own colors. The flag is decorative unless
+ * `accessibilityLabel` is set.
+ *
+ * @component
+ * @example
+ * ```tsx
+ * import { CurrencyFlag } from '@cdx-ui/components';
+ *
+ * <CurrencyFlag code="USD" />
+ * <CurrencyFlag code="EUR" className="size-6" accessibilityLabel="Euro" />
+ * ```
+ *
+ * @param {string} code - ISO 4217 alphabetic currency code.
+ * @param {string} className - Utility classes for size and placement, merged after the default `size-5` box.
+ * @param {string} accessibilityLabel - When set, the flag is announced as an image with this name.
+ * @param {object} style - Style overrides passed through to the icon.
+ * @param {string} data-testid - Test identifier forwarded to the rendered icon.
+ */
+export function CurrencyFlag({ code, className, ...props }: CurrencyFlagProps) {
+  const flagCode = currencyFlagCode(code);
+  if (!flagCode) {
+    if (__DEV__) console.warn(`CurrencyFlag: no flag for currency "${code}"`);
+    return null;
+  }
+  return (
+    <Icon
+      as={flags[flagCode]}
+      className={cn('size-5', className)}
+      {...props}
+      {...mergeDataAttributes(props, dataAttributes({ slot: 'currency-flag' }))}
+    />
+  );
+}
+
+CurrencyFlag.displayName = 'CurrencyFlag';

package/src/components/CurrencyInput/index.tsx

@@ -62,6 +62,7 @@ export const CurrencyInput = forwardRef<TextInput, CurrencyInputProps>(
       currencySymbol = '$',
       variant = 'ghost',
       size = 'default',
+      align,
       isDisabled,
       isInvalid,
       isReadOnly,
@@ -206,7 +207,7 @@ export const CurrencyInput = forwardRef<TextInput, CurrencyInputProps>(
           onFocus={handleFocus}
           onBlur={handleBlur}
           className={cn(
-            currencyInputFieldVariants({ variant, size }),
+            currencyInputFieldVariants({ variant, size, align }),
             isEmpty ? 'text-content-tertiary' : 'text-content-primary',
           )}
         />

package/src/components/CurrencyInput/styles.ts

@@ -1,3 +1,4 @@
+import { Platform } from 'react-native';
 import { cn, cva } from '@cdx-ui/utils';
 import { DISABLED_CURSOR } from '../../styles/constants';
 import { inputFieldVariants, inputRootVariants } from '../Input/styles';
@@ -15,6 +16,11 @@ export interface CurrencyInputVariantProps {
    * @default 'default'
    */
   size?: 'default' | 'small';
+  /**
+   * Horizontal alignment of the amount. Defaults to `center` on `ghost`. On `outline`, the amount
+   * stays at the start of the field until `align` is set.
+   */
+  align?: 'center' | 'end';
 }
 
 const currencyInputGhostRootVariants = cva(
@@ -37,9 +43,20 @@ const currencyInputGhostRootVariants = cva(
   },
 );
 
+// TextInput only accepts textAlign left, center, and right. `text-end` is valid CSS, so web
+// uses it, but native ignores it and the amount stays at the start in LTR. Direction
+// variants compile to left/right, matching Table's native text alignment.
+const currencyInputAlignClass = {
+  center: 'text-center',
+  end: Platform.select({
+    web: 'text-end',
+    default: 'ltr:text-right rtl:text-left',
+  }),
+} as const;
+
 const currencyInputGhostFieldVariants = cva(
   [
-    'w-full bg-transparent p-0 text-center',
+    'w-full bg-transparent p-0',
     'placeholder:text-content-tertiary',
     'web:outline-none',
     'data-[invalid=true]:text-content-danger',
@@ -71,8 +88,17 @@ export const currencyInputRootVariants = ({
 export const currencyInputFieldVariants = ({
   variant = 'ghost',
   size = 'default',
-}: CurrencyInputVariantProps = {}): string =>
-  variant === 'outline' ? inputFieldVariants({ size }) : currencyInputGhostFieldVariants({ size });
+  align,
+}: CurrencyInputVariantProps = {}): string => {
+  const resolvedAlign = align ?? (variant === 'outline' ? undefined : 'center');
+
+  return cn(
+    variant === 'outline'
+      ? inputFieldVariants({ size })
+      : currencyInputGhostFieldVariants({ size }),
+    resolvedAlign ? currencyInputAlignClass[resolvedAlign] : undefined,
+  );
+};
 
 // Figma keeps the symbol at body-md on every viewport; only the amount grows to 16px on web <600px.
 export const currencyInputPrefixVariants = cva(

package/src/components/index.ts

@@ -77,5 +77,6 @@ export * from './Heading';
 export * from './Text';
 export * from './Icon';
 export * from './CountryFlag';
+export * from './CurrencyFlag';
 export * from './IconButton';
 export * from './QuickActionButton';