@thx/controls 14.2.0 → 15.1.1

package/dist/inputs/CreditCardInput/CreditCardInput.d.ts

@@ -1,7 +1,16 @@
 /// <reference types="react" />
-import { CreditCardCardNameEnum } from '@thx/yup-types';
-import { MaskedInputProps } from '../MaskedInput';
-export interface CreditCardInputType {
-    cardType?: (cardType: CreditCardCardNameEnum | undefined) => void;
+import type { LocalDate } from '@js-joda/core';
+import 'react-credit-cards/es/styles-compiled.css';
+import { InputProps } from 'semantic-ui-react';
+import './styles.css';
+export interface CreditCardData {
+    number?: string;
+    name?: string;
+    cvc?: string;
+    expiry?: LocalDate;
 }
-export declare function CreditCardInput({ cardType, ...rest }: CreditCardInputType & Omit<MaskedInputProps, 'mask'>): JSX.Element;
+export declare type CreditCardInputProps = {
+    value?: CreditCardData;
+    onChange?: (data: CreditCardData) => void;
+} & Pick<InputProps, 'disabled' | 'onBlur'>;
+export declare function CreditCardInput(props: CreditCardInputProps): JSX.Element;

package/dist/inputs/CreditCardInput/CreditCardNumberInput.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { InputProps } from 'semantic-ui-react';
+interface CreditCardNumberInputProps {
+    onChange?: (value: string | undefined) => void;
+    value?: string;
+}
+export declare function CreditCardNumberInput(props: CreditCardNumberInputProps & Omit<InputProps, 'onChange'>): JSX.Element;
+export {};

package/dist/inputs/CreditCardInput/index.d.ts

@@ -1,2 +1,2 @@
 export { CreditCardInput } from './CreditCardInput';
-export type { CreditCardInputType } from './CreditCardInput';
+export type { CreditCardInputProps } from './CreditCardInput';

package/dist/inputs/MaskedInput/MaskedInput.d.ts

@@ -1,15 +1,8 @@
 /// <reference types="react" />
-import Inputmask from 'inputmask';
 import { InputProps } from 'semantic-ui-react';
-/**
- * See source code for detailed prop types or {@link https://github.com/RobinHerbots/jquery.inputmask|here} for more info.
- * @typedef {Object} inputmaskPropTypes
- */
-export interface MaskedInputProps {
+import { UseMaskedInputProps } from './useMaskedInput';
+export declare type MaskedInputProps = {
     name?: string;
-    value?: string;
-    onChange?: (value?: string) => void;
     onBlur?: (event: any) => void;
-    mask?: Inputmask.Options;
-}
-export declare function MaskedInput(props: MaskedInputProps & Omit<InputProps, 'onChange'>): JSX.Element;
+} & UseMaskedInputProps & Omit<InputProps, 'onChange'>;
+export declare function MaskedInput(props: MaskedInputProps): JSX.Element;

package/dist/inputs/MaskedInput/index.d.ts

@@ -1,2 +1,3 @@
 export { MaskedInput } from './MaskedInput';
+export { useMaskedInput } from './useMaskedInput';
 export type { MaskedInputProps } from './MaskedInput';

package/dist/inputs/MaskedInput/useMaskedInput.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import Inputmask from 'inputmask';
+export interface UseMaskedInputProps {
+    value?: string;
+    onChange?: (value?: string) => void;
+    mask?: Inputmask.Options;
+    onSet?: (value?: string) => void;
+}
+export declare function useMaskedInput(props: UseMaskedInputProps): import("react").MutableRefObject<HTMLInputElement | null>;

package/dist/inputs/PhoneInput/PhoneInput.d.ts

@@ -2,5 +2,6 @@
 import { MaskedInputProps } from '../MaskedInput';
 export interface PhoneInputProps {
     extension?: boolean;
+    onChange?: (value?: string) => void;
 }
-export declare function PhoneInput(props: PhoneInputProps & Omit<MaskedInputProps, 'mask'>): JSX.Element;
+export declare function PhoneInput(props: PhoneInputProps & Omit<MaskedInputProps, 'mask' | 'onChange'>): JSX.Element;

package/dist/inputs/Scriptel/withScriptel.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { ScriptelProps } from './Scriptel';
 /**
  * A HoC that provides a connection to a Scriptel Omniscript device.

package/dist/inputs/SinInput/SinInput.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
-import { MaskedInputProps } from '../MaskedInput';
-export interface SinInputProps {
-    hasSin: boolean;
+import type { MaskedInputProps } from '../MaskedInput';
+export interface SinInputProps extends Omit<MaskedInputProps, 'mask'> {
+    value?: string;
+    onChange(value?: string): void;
 }
-export declare function SinInput(props: SinInputProps & Omit<MaskedInputProps, 'mask' | 'name'>): JSX.Element;
+export declare function SinInput(props: SinInputProps): JSX.Element;

package/dist/inputs/TableInput/DropdownCell.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { DropdownProps } from 'semantic-ui-react';
 import type { TableCellProps } from './TableInput';
 export declare function DropdownCell<D extends Record<string, unknown>>(dropdownProps: DropdownProps): (props: TableCellProps<D>) => JSX.Element;

package/dist/inputs/TableInput/HoverCell.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { CellProps, Renderer } from 'react-table';
 interface HoverCellOptions<D extends Record<string, unknown>> {
     Action: Renderer<CellProps<D>>;

package/dist/inputs/TableInput/MoneyCell.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type Money from 'js-money';
 import type { CellProps } from 'react-table';
 interface MoneyCellOptions<D extends Record<string, unknown>> {

package/dist/inputs/TableInput/MoneyEditCell.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type Money from 'js-money';
 import type { TableCellProps } from './TableInput';
 import type { AddRowOnTabIf } from './addRowOnTab';

package/dist/inputs/TableInput/MoneySumFooter.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { IdType, TableInstance } from 'react-table';
 interface MoneySumFooterOptions<A extends Record<string, unknown>> {
     id: IdType<A>;

package/dist/inputs/TableInput/StringEditCell.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { InputProps } from 'semantic-ui-react';
 import type { TableCellProps } from './TableInput';
 import type { AddRowOnTabIf } from './addRowOnTab';

package/dist/money/MoneyCurrencyInput/MoneyCurrencyInput.d.ts

@@ -2,7 +2,7 @@
 import { InputProps } from 'semantic-ui-react';
 import type { MoneyInputProps } from '../MoneyInput';
 export interface MoneyCurrencyInputProps extends MoneyInputProps {
-    currencyOptions?: {
+    currencies?: {
         key: string;
         value: string;
         text: string;

package/dist/money/MoneyInput/MoneyInput.d.ts

@@ -1,12 +1,11 @@
 /// <reference types="react" />
-import type { Currencies, IMoneyObject } from '@thx/money';
-import type Money from 'js-money';
+import Money, { Currency, MoneyObject } from 'js-money';
 import { InputProps } from 'semantic-ui-react';
 export interface MoneyInputProps {
     name?: string;
     onChange?: (value: Money) => void;
-    value?: Money | IMoneyObject;
-    defaultCurrency?: Currencies.Currency;
+    value?: Money | MoneyObject;
+    defaultCurrency?: Currency;
     onBlur?: (ev: any) => void;
     prefix?: string;
     showPrefix?: boolean;

package/dist/money/useMoneyInput.d.ts

@@ -1,14 +1,13 @@
-import { Currencies, IMoneyObject } from '@thx/money';
 import Money from 'js-money';
+import { MutableRefObject } from 'react';
 interface UseMoneyInputProps {
-    onChange?: (value: Money) => void;
-    value?: Money | IMoneyObject;
-    defaultCurrency?: Currencies.Currency;
+    value?: Money;
+    onChange?: (value?: Money) => void;
+    onSet?: (value?: Money) => void;
     prefix?: string;
     showPrefix?: boolean;
     wholeNumber?: boolean;
 }
-export declare function useMoneyInput(props: UseMoneyInputProps): {
-    inputElement: import("react").MutableRefObject<HTMLInputElement | null>;
-};
+declare type SetValueFn = (value?: Money) => void;
+export declare function useMoneyInput(props: UseMoneyInputProps): [MutableRefObject<HTMLInputElement | null>, SetValueFn];
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thx/controls",
-  "version": "14.2.0",
+  "version": "15.1.1",
   "description": "A collection of components designed with SemanticUI.",
   "bugs": {
     "url": "https://github.com/thr-consulting/thr-addons/issues"
@@ -19,10 +19,11 @@
   ],
   "scripts": {
     "build": "thx build",
+    "build-storybook": "build-storybook",
     "build:dev": "thx build:dev",
     "build:prod": "thx build:prod",
     "clean": "thx clean",
-    "deps": "thx -p *.stories.tsx -i style-loader,css-loader deps",
+    "deps": "thx -p *.stories.tsx,*.story.tsx -i style-loader,css-loader deps",
     "lint": "thx lint",
     "lint:fix": "thx lint:fix",
     "sort": "thx sort",
@@ -36,11 +37,12 @@
   },
   "dependencies": {
     "@js-joda/core": "^4.0.0",
-    "@thx/date": "^14.2.0",
-    "@thx/money": "^14.2.0",
-    "@thx/yup-types": "^14.2.0",
+    "@thx/date": "^15.1.1",
+    "@thx/money": "^15.1.1",
+    "@thx/yup-types": "^15.1.1",
     "@types/inputmask": "^5.0.1",
     "@types/react-datepicker": "^4.1.7",
+    "credit-card-type": "^9.1.0",
     "debug": "^4.1.1",
     "eventemitter3": "^4.0.0",
     "flat": "^5.0.0",
@@ -48,8 +50,11 @@
     "inputmask": "^5.0.6",
     "js-money": "^0.6.3",
     "lodash": "^4.17.15",
+    "luhn": "^2.4.1",
+    "react-credit-cards": "^0.8.3",
     "react-datepicker": "^4.2.1",
     "react-table": "^7.6.3",
+    "social-insurance-number": "^0.2.2",
     "use-deep-compare-effect": "1.4.0"
   },
   "devDependencies": {
@@ -68,5 +73,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "f2263570d349ddf1e2556f81515a178002374b9f"
+  "gitHead": "71c2dabf3b35fc12e48244dfc8a84bfa5a5bf3f7"
 }