loon-bulma-react 2024.1.7 → 2024.1.9
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.
- package/dist/index.cjs +205 -203
- package/dist/index.d.cts +100 -24
- package/dist/index.d.ts +100 -24
- package/dist/index.js +31 -31
- package/package.json +28 -28
package/dist/index.d.ts
CHANGED
|
@@ -1664,7 +1664,7 @@ type TabBarItemProps = {
|
|
|
1664
1664
|
* </TabBar>
|
|
1665
1665
|
*/
|
|
1666
1666
|
declare const TabBar: {
|
|
1667
|
-
({ id, activeTab: currentActiveTab, initialTab, size, alignment, fullwidth, children, onTabChange, }: TabBarProps): JSX.Element;
|
|
1667
|
+
({ id, activeTab: currentActiveTab, initialTab, size: sizeProp, alignment, fullwidth, children, onTabChange, }: TabBarProps): JSX.Element;
|
|
1668
1668
|
/** Een item in deen <TabBar> component
|
|
1669
1669
|
* @param props
|
|
1670
1670
|
* @returns tab item component
|
|
@@ -1713,7 +1713,7 @@ type TagsProps = {
|
|
|
1713
1713
|
* <Tag>Hello</Tag>
|
|
1714
1714
|
* <Tag color='d'>Danger</Tag>
|
|
1715
1715
|
*/
|
|
1716
|
-
declare function Tag({ children, color, size, light, dark, title, onDismiss }: TagProps): JSX.Element;
|
|
1716
|
+
declare function Tag({ children, color, size: sizeProp, light, dark, title, onDismiss }: TagProps): JSX.Element;
|
|
1717
1717
|
/**
|
|
1718
1718
|
* Maak een tag-container aan. De tags kunnen aan elkaar geplakt worden of niet.
|
|
1719
1719
|
* De grootte van de tags kan ook ingesteld worden
|
|
@@ -1725,7 +1725,7 @@ declare function Tag({ children, color, size, light, dark, title, onDismiss }: T
|
|
|
1725
1725
|
* <Tag color="i">Tag 2</Tag>
|
|
1726
1726
|
* </Tags>
|
|
1727
1727
|
*/
|
|
1728
|
-
declare function Tags({ children: nodes, merged, size, alignment, className: extraClasses, styles, itemRef, id, }: TagsProps): JSX.Element;
|
|
1728
|
+
declare function Tags({ children: nodes, merged, size: sizeProp, alignment, className: extraClasses, styles, itemRef, id, }: TagsProps): JSX.Element;
|
|
1729
1729
|
|
|
1730
1730
|
type TimeLineProps = {
|
|
1731
1731
|
id?: string;
|
|
@@ -1962,7 +1962,8 @@ type OnOffToggleItemProps = ToggleItemProps & {
|
|
|
1962
1962
|
};
|
|
1963
1963
|
/**
|
|
1964
1964
|
* Een groep van bij-elkaar-horende buttons waar er maar 1 van actief kan zijn.
|
|
1965
|
-
* Om elk toggle-item APART te kunnen togglen, gebruik je de ItemToggleBar Component
|
|
1965
|
+
* Om elk toggle-item APART te kunnen togglen, gebruik je de ItemToggleBar Component.
|
|
1966
|
+
* De Togglebar gebruikt de default size voor Buttons
|
|
1966
1967
|
* @param props
|
|
1967
1968
|
* @returns een Toggle bar
|
|
1968
1969
|
* @example
|
|
@@ -1981,7 +1982,7 @@ type OnOffToggleItemProps = ToggleItemProps & {
|
|
|
1981
1982
|
* </ToggleBar>
|
|
1982
1983
|
*/
|
|
1983
1984
|
declare const ToggleBar: {
|
|
1984
|
-
({ size, rounded, alignment, value, initialValue, children: nodes, className: classes, onToggle, }: ToggleBarProps): JSX.Element;
|
|
1985
|
+
({ size: sizeProp, rounded, alignment, value, initialValue, children: nodes, className: classes, onToggle, }: ToggleBarProps): JSX.Element;
|
|
1985
1986
|
/**
|
|
1986
1987
|
* Item binnen de ToggleBar. Een van de ToggleItems in een ToggleBar kan maar actief zijn.
|
|
1987
1988
|
* @param props
|
|
@@ -2083,7 +2084,7 @@ type ButtonProps = {
|
|
|
2083
2084
|
* | type | `button, reset, submit` | `button` | type 'button' voor de button |
|
|
2084
2085
|
*/
|
|
2085
2086
|
declare const Button: {
|
|
2086
|
-
({ color, size, loading, disabled, fullwidth, type, isStatic, helpTag, onClick, onFocus, children: nodes, value, ...props }: ButtonProps): JSX.Element;
|
|
2087
|
+
({ color: colorProp, size: sizeProp, loading, disabled, fullwidth, type, isStatic, helpTag, onClick, onFocus, children: nodes, value, ...props }: ButtonProps): JSX.Element;
|
|
2087
2088
|
/**
|
|
2088
2089
|
* Een Static Button
|
|
2089
2090
|
* Een static button is niet interactief, maar wordt bijvoorbeeld gebruikt als scheiding voor add-ons
|
|
@@ -2665,7 +2666,7 @@ declare class JSDateTime {
|
|
|
2665
2666
|
*
|
|
2666
2667
|
*/
|
|
2667
2668
|
toFormat(format: string): string;
|
|
2668
|
-
/** formating for JSON, return the ISO-string */
|
|
2669
|
+
/** formating for JSON, return the ISO-string. Wordt door `JSON.stringify` */
|
|
2669
2670
|
private toJSON;
|
|
2670
2671
|
/** deserialize een JSDateTime, doet hetzelfde als JSDateTime.fromISO.
|
|
2671
2672
|
* @param jsonStr een string met een ISO-datum
|
|
@@ -3547,7 +3548,7 @@ type InputPropsType<T = InputValueType> = {
|
|
|
3547
3548
|
* | type | `string` | type voor deze input (default = `text`)|
|
|
3548
3549
|
* | value | `string` | value voor deze input (default = `undefined`)|
|
|
3549
3550
|
*/
|
|
3550
|
-
declare function BaseInput<T extends InputValueType = string>({ alignment, autoComplete, optionListId, autofocus, disabled, errorMessage, infoMessage, form, helpTag, id, inputRef: ref, keyboardType, max, min, name, pattern, placeholder, readonly, required, size, spellCheck, step, title, type, value, className: extraClasses, styles, onBlur, onChange, onFocus, onKeyDown, onKeyUp, onValueChanged, }: StrictOmit<InputPropsType<T>, 'optionList'> & StrictOmit<InputStylingPropsType, 'labelHidden' | 'direction' | 'icon'>): JSX.Element;
|
|
3551
|
+
declare function BaseInput<T extends InputValueType = string>({ alignment: alignmentProp, autoComplete, optionListId, autofocus, disabled, errorMessage, infoMessage, form, helpTag, id, inputRef: ref, keyboardType, max, min, name, pattern, placeholder, readonly, required, size: sizeProp, spellCheck, step, title, type, value, className: extraClasses, styles, onBlur, onChange, onFocus, onKeyDown, onKeyUp, onValueChanged, }: StrictOmit<InputPropsType<T>, 'optionList'> & StrictOmit<InputStylingPropsType, 'labelHidden' | 'direction' | 'icon'>): JSX.Element;
|
|
3551
3552
|
/**
|
|
3552
3553
|
* Input component. Deze component heeft dezelfde properties als de gewone `<input ... />`-tag en de `<BaseInput<T> ... />-tag`.
|
|
3553
3554
|
* Het verschil met de `BaseInput`-tag is dat deze compionent **wel** direction, label, of icon heeft.
|
|
@@ -3589,7 +3590,7 @@ declare function BaseInput<T extends InputValueType = string>({ alignment, autoC
|
|
|
3589
3590
|
* | type | `string` | type voor deze input (default = `text`)|
|
|
3590
3591
|
* | value | `string` | value voor deze input (default = `undefined`)|
|
|
3591
3592
|
*/
|
|
3592
|
-
declare function Input<T extends InputValueType = string>({ direction, errorMessage, showRequiredOnLabel, icon, id, label, labelHidden, name, required, loading, size, value, infoData, helpTag, optionList, onBlur, onFocus, ...props }: StrictOmit<InputPropsType<T>, 'optionListId'> & InputStylingPropsType): JSX.Element;
|
|
3593
|
+
declare function Input<T extends InputValueType = string>({ direction: directionProp, errorMessage, showRequiredOnLabel, icon, id, label, labelHidden, name, required, loading, size: sizeProp, value, infoData, helpTag, optionList, onBlur, onFocus, ...props }: StrictOmit<InputPropsType<T>, 'optionListId'> & InputStylingPropsType): JSX.Element;
|
|
3593
3594
|
/** Een wrapper voor een input component, om te zorgen dat ze allemaal op dezelfde manier horizontaal of verticaal aligned worden. */
|
|
3594
3595
|
declare function InputContainer({ children, controlClassName, direction, showRequiredOnLabel, inputId, label, labelHidden, required, size, loading, infoData, setHovered, }: {
|
|
3595
3596
|
label: string;
|
|
@@ -3631,7 +3632,7 @@ type CheckBoxInputProps = StrictOmit<InputPropsType<boolean>, 'value' | 'type' |
|
|
|
3631
3632
|
* const [x, setX] = React.useState(false);
|
|
3632
3633
|
* <CheckBox name="test" label="test" value={x} onValueChanged={setX} direction='v'/>
|
|
3633
3634
|
*/
|
|
3634
|
-
declare function CheckBox({ id, label, name, size, direction, required, showRequiredOnLabel, value, errorMessage, labelHidden, helpTag, infoData, onValueChanged, onBlur, onFocus, ...props }: CheckBoxInputProps): JSX.Element;
|
|
3635
|
+
declare function CheckBox({ id, label, name, size: sizeProp, direction: directionProp, required, showRequiredOnLabel, value, errorMessage, labelHidden, helpTag, infoData, onValueChanged, onBlur, onFocus, ...props }: CheckBoxInputProps): JSX.Element;
|
|
3635
3636
|
/**
|
|
3636
3637
|
* Een checkbox input die nog helemaal zelf aan te passen is, dus zonder container eromheen. Om een checkbox in met wat meer styling te gebruiken, gebruik dan de `CheckBox` component.
|
|
3637
3638
|
* Dat is een wrapper om deze component heen. De properties `type`, `step`, `min`, `max`, `icon`, `pattern`, `placeholder` en `direction` zijn niet van toepassing op deze component.
|
|
@@ -3646,7 +3647,7 @@ declare function CheckBox({ id, label, name, size, direction, required, showRequ
|
|
|
3646
3647
|
* const [x, setX] = React.useState(false);
|
|
3647
3648
|
* <CB name="test" label="test" value={x} onValueChanged={setX}/>
|
|
3648
3649
|
*/
|
|
3649
|
-
declare function CB({ helpTag, errorMessage, infoMessage, label, disabled, keyboardType, title, name, value, required, spellCheck, id, autoComplete, readonly, autofocus, form, inputRef: ref, onBlur, onChange, onFocus, onKeyDown, onKeyUp, onValueChanged, size, alignment, color, infoDataEl, }: StrictOmit<CheckBoxInputProps, 'direction' | 'labelHidden' | 'infoData'> & {
|
|
3650
|
+
declare function CB({ helpTag, errorMessage, infoMessage, label, disabled, keyboardType, title, name, value, required, spellCheck, id, autoComplete, readonly, autofocus, form, inputRef: ref, onBlur, onChange, onFocus, onKeyDown, onKeyUp, onValueChanged, size: sizeProp, alignment: alignmentProp, color, infoDataEl, }: StrictOmit<CheckBoxInputProps, 'direction' | 'labelHidden' | 'infoData'> & {
|
|
3650
3651
|
infoDataEl?: React$1.ReactNode;
|
|
3651
3652
|
}): JSX.Element;
|
|
3652
3653
|
|
|
@@ -3759,7 +3760,7 @@ type SelectInputProps<T extends number | string | string[]> = StrictOmit<InputPr
|
|
|
3759
3760
|
* ..</Select.OptGroup>
|
|
3760
3761
|
* </Select>
|
|
3761
3762
|
*/
|
|
3762
|
-
declare function Select<T extends number | string | string[] = string>({ value, id, name, label, grouped, required, showRequiredOnLabel, errorMessage, infoMessage, multiple, alignment, size, direction, options, children: nodes, helpTag, disabled, keyboardType, title, spellCheck, loading, autoComplete, autofocus, form, inputRef: ref, labelHidden, icon, infoData, onBlur, onFocus, onChange, onKeyDown, onKeyUp, onValueChanged, }: SelectInputProps<T>): JSX.Element;
|
|
3763
|
+
declare function Select<T extends number | string | string[] = string>({ value, id, name, label, grouped, required, showRequiredOnLabel, errorMessage, infoMessage, multiple, alignment: alignmentProp, size: sizeProp, direction: directionProp, options, children: nodes, helpTag, disabled, keyboardType, title, spellCheck, loading, autoComplete, autofocus, form, inputRef: ref, labelHidden, icon, infoData, onBlur, onFocus, onChange, onKeyDown, onKeyUp, onValueChanged, }: SelectInputProps<T>): JSX.Element;
|
|
3763
3764
|
declare namespace Select {
|
|
3764
3765
|
var Option: ({ value, disabled, id, children, }: {
|
|
3765
3766
|
id?: string | undefined;
|
|
@@ -3816,7 +3817,7 @@ type ComboBoxProps<T extends unknown = {}> = StrictOmit<InputPropsType<number |
|
|
|
3816
3817
|
* onSearch={(txt, v) => v.last_name.includes(txt) || v.first_name.includes(txt)}
|
|
3817
3818
|
* />
|
|
3818
3819
|
*/
|
|
3819
|
-
declare function ComboBox<T extends unknown = {}>({ value, options, id, name, label, required, showRequiredOnLabel, errorMessage, infoMessage, alignment, size, direction, placeholder, helpTag, disabled, loading, autofocus, labelHidden, icon, infoData, onValueChanged, onChange, onFocus, onBlur, onKeyDown, onKeyUp, onSearch, formatLabel, }: ComboBoxProps<T>): JSX.Element;
|
|
3820
|
+
declare function ComboBox<T extends unknown = {}>({ value, options, id, name, label, required, showRequiredOnLabel, errorMessage, infoMessage, alignment: alignmentProp, size: sizeProp, direction: directionProp, placeholder, helpTag, disabled, loading, autofocus, labelHidden, icon, infoData, onValueChanged, onChange, onFocus, onBlur, onKeyDown, onKeyUp, onSearch, formatLabel, }: ComboBoxProps<T>): JSX.Element;
|
|
3820
3821
|
|
|
3821
3822
|
type MultiComboBoxProps<T extends unknown = {}> = StrictOmit<InputPropsType<number | string | string[]>, 'type' | 'step' | 'inputRef' | 'value' | 'onValueChanged' | 'min' | 'max' | 'readonly' | 'pattern' | 'errorMessage' | 'infoMessage' | 'title' | 'form' | 'autoComplete' | 'spellCheck' | 'keyboardType' | 'onChange'> & InputStylingPropsType & {
|
|
3822
3823
|
/** De waarde van de combobox */ value: T[];
|
|
@@ -3859,7 +3860,7 @@ type MultiComboBoxProps<T extends unknown = {}> = StrictOmit<InputPropsType<numb
|
|
|
3859
3860
|
* onSearch={(txt, v) => v.last_name.includes(txt) || v.first_name.includes(txt)}
|
|
3860
3861
|
* />
|
|
3861
3862
|
*/
|
|
3862
|
-
declare function MultiComboBox<T extends unknown = {}>({ value, options, id, name, label, required, showRequiredOnLabel, errorMessage, infoMessage, alignment, size, direction, placeholder, helpTag, disabled, loading, autofocus, labelHidden, icon, infoData, onValueChanged, onFocus, onBlur, onKeyDown, onKeyUp, onSearch, formatLabel, formatValue, }: MultiComboBoxProps<T>): JSX.Element;
|
|
3863
|
+
declare function MultiComboBox<T extends unknown = {}>({ value, options, id, name, label, required, showRequiredOnLabel, errorMessage, infoMessage, alignment: alignmentProp, size: sizeProp, direction: directionProp, placeholder, helpTag, disabled, loading, autofocus, labelHidden, icon, infoData, onValueChanged, onFocus, onBlur, onKeyDown, onKeyUp, onSearch, formatLabel, formatValue, }: MultiComboBoxProps<T>): JSX.Element;
|
|
3863
3864
|
|
|
3864
3865
|
type ColorInputProps = StrictOmit<InputPropsType<string>, 'type' | 'value' | 'onValueChanged' | 'step' | 'min' | 'max' | 'autoComplete' | 'spellCheck' | 'keyboardType'> & InputStylingPropsType & {
|
|
3865
3866
|
/** Gebruik de color-input met een hex-color, bijvooerbeeld`#ff8000` of `#fff` */
|
|
@@ -4012,7 +4013,7 @@ type RadioInputProps<T extends RBValueType = string> = StrictOmit<InputPropsType
|
|
|
4012
4013
|
* ..</RB>
|
|
4013
4014
|
* </div>
|
|
4014
4015
|
*/
|
|
4015
|
-
declare function RB<T extends RBValueType = string>({ helpTag, disabled, keyboardType, title, name, value, checked, required, spellCheck, id, autoComplete, readonly, autofocus, form, inputRef: ref, onBlur, onChange, onFocus, onKeyDown, onKeyUp, onValueChanged, size, alignment, itemsDirection, color, children, infoData, }: RadioInputProps<T>): JSX.Element;
|
|
4016
|
+
declare function RB<T extends RBValueType = string>({ helpTag, disabled, keyboardType, title, name, value, checked, required, spellCheck, id, autoComplete, readonly, autofocus, form, inputRef: ref, onBlur, onChange, onFocus, onKeyDown, onKeyUp, onValueChanged, size: sizeProp, alignment: alignmentProp, itemsDirection: itemsDirectionProp, color, children, infoData, }: RadioInputProps<T>): JSX.Element;
|
|
4016
4017
|
/** RadioGroup is een groep radio-buttons met direction, alignment, etc. Gebruik `RB` voor een losstaande radio-button, **dus niet `<RadioGroup.Item>` daarvoor**
|
|
4017
4018
|
* De RadioGroup kan je vullen met `RadioGroup.Item`-componenten, of met `RB`-componenten.
|
|
4018
4019
|
* @param value de geselecteerde waarde van de input
|
|
@@ -4026,7 +4027,7 @@ declare function RB<T extends RBValueType = string>({ helpTag, disabled, keyboar
|
|
|
4026
4027
|
* ..<RB value="Z">set to Z</RB>
|
|
4027
4028
|
* </RadioGroup>
|
|
4028
4029
|
*/
|
|
4029
|
-
declare function RadioGroup<T extends RBValueType = string>({ children: nodeChildren, id, label, disabled, labelHidden, name, value, required, showRequiredOnLabel, size, direction, itemsDirection, alignment, errorMessage, infoMessage, infoData, helpTag, onValueChanged, onBlur, onChange, onFocus, onKeyDown, onKeyUp, }: RadioGroupProps<T>): JSX.Element;
|
|
4030
|
+
declare function RadioGroup<T extends RBValueType = string>({ children: nodeChildren, id, label, disabled, labelHidden, name, value, required, showRequiredOnLabel, size: sizeProp, direction: directionProp, itemsDirection: itemsDirectionProp, alignment: alignmentProp, errorMessage, infoMessage, infoData, helpTag, onValueChanged, onBlur, onChange, onFocus, onKeyDown, onKeyUp, }: RadioGroupProps<T>): JSX.Element;
|
|
4030
4031
|
declare namespace RadioGroup {
|
|
4031
4032
|
var Item: typeof SpecialRadioItem;
|
|
4032
4033
|
}
|
|
@@ -4071,7 +4072,7 @@ type TagsInputProps = StrictOmit<InputPropsType<string>, 'type' | 'step' | 'valu
|
|
|
4071
4072
|
* </Section>
|
|
4072
4073
|
* @returns
|
|
4073
4074
|
*/
|
|
4074
|
-
declare function TagsInput({ value, allowDuplicates, disableRemove, disabled, id, name, label, color: colorProp, direction, errorMessage, infoMessage, showRequiredOnLabel, icon, labelHidden, required, loading, size, alignment, autoComplete, optionListId, autofocus, form, helpTag, keyboardType, maxLength, minLength, pattern, placeholder, readonly, spellCheck, title, className: extraClasses, styles, randomColors, maxTags, infoData, onBlur, onFocus, onValueChanged, onKeyDown, onKeyUp, }: TagsInputProps): react_jsx_runtime.JSX.Element;
|
|
4075
|
+
declare function TagsInput({ value, allowDuplicates, disableRemove, disabled, id, name, label, color: colorProp, direction: directionProp, errorMessage, infoMessage, showRequiredOnLabel, icon, labelHidden, required, loading, size: sizeProp, alignment: alignmentProp, autoComplete, optionListId, autofocus, form, helpTag, keyboardType, maxLength, minLength, pattern, placeholder, readonly, spellCheck, title, className: extraClasses, styles, randomColors, maxTags, infoData, onBlur, onFocus, onValueChanged, onKeyDown, onKeyUp, }: TagsInputProps): react_jsx_runtime.JSX.Element;
|
|
4075
4076
|
|
|
4076
4077
|
type EmailInputProps = StrictOmit<InputPropsType<string>, 'type' | 'step'> & InputStylingPropsType & {
|
|
4077
4078
|
pattern?: string;
|
|
@@ -4119,7 +4120,7 @@ type PasswordInputProps = StrictOmit<InputPropsType<string>, 'type' | 'step'> &
|
|
|
4119
4120
|
* @param revealPasswordMsg boodschap bij de checkbox. Default is `Toon wachtwoord`
|
|
4120
4121
|
* @param iconRevealed icon voor ww revealed. Default is `faEye`
|
|
4121
4122
|
*/
|
|
4122
|
-
declare function PasswordInput({ value, autoComplete, icon, name, id, label, required, showRequiredOnLabel, labelHidden, size, direction, revealPasswordAllowed, revealPasswordMsg, iconRevealed, errorMessage, infoMessage, infoData, helpTag, onValueChanged, onBlur, onFocus, ...props }: PasswordInputProps): JSX.Element;
|
|
4123
|
+
declare function PasswordInput({ value, autoComplete, icon, name, id, label, required, showRequiredOnLabel, labelHidden, size: sizeProp, direction: directionProp, revealPasswordAllowed, revealPasswordMsg, iconRevealed, errorMessage, infoMessage, infoData, helpTag, onValueChanged, onBlur, onFocus, ...props }: PasswordInputProps): JSX.Element;
|
|
4123
4124
|
|
|
4124
4125
|
type TextEditorPropsType = {
|
|
4125
4126
|
content?: string;
|
|
@@ -4179,7 +4180,7 @@ type TextAreaProps = StrictOmit<InputPropsType<string>, 'type' | 'inputRef' | 'k
|
|
|
4179
4180
|
* @param rows aantal rijen voor de textarea (default: 4)
|
|
4180
4181
|
* @param cols aantal kolommen voor de textarea. **werkt niet in Bulma! de breedte is altijd maximaal!**
|
|
4181
4182
|
*/
|
|
4182
|
-
declare function TextArea({ value, label, errorMessage, infoMessage, helpTag, id, name, spellCheck, required, showRequiredOnLabel, autoComplete, placeholder, disabled, form, readonly, autofocus, inputRef, max, min, title, size, alignment, direction, cols, rows, labelHidden, loading, infoData, onValueChanged, onChange, onBlur, onFocus, onKeyDown, onKeyUp, }: TextAreaProps): JSX.Element;
|
|
4183
|
+
declare function TextArea({ value, label, errorMessage, infoMessage, helpTag, id, name, spellCheck, required, showRequiredOnLabel, autoComplete, placeholder, disabled, form, readonly, autofocus, inputRef, max, min, title, size: sizeProp, alignment: alignmentProp, direction: directionProp, cols, rows, labelHidden, loading, infoData, onValueChanged, onChange, onBlur, onFocus, onKeyDown, onKeyUp, }: TextAreaProps): JSX.Element;
|
|
4183
4184
|
|
|
4184
4185
|
type CharType = '0-9' | 'a-z' | 'A-Z' | 'a-Z' | '0-Z' | (string & {}) | RegExp;
|
|
4185
4186
|
type TextInputProps = StrictOmit<InputPropsType<string>, 'type' | 'step'> & InputStylingPropsType & {
|
|
@@ -4231,7 +4232,7 @@ type RangeInputProps = StrictOmit<InputPropsType<number>, 'autofocus' | 'autoCom
|
|
|
4231
4232
|
* @param step De stapgrootte van de input (default = 1)
|
|
4232
4233
|
* @example <RangeInput value={50} min={0} max={100} />
|
|
4233
4234
|
*/
|
|
4234
|
-
declare function RangeInput({ value, min, max, step, prefix, suffix, helpTag, errorMessage, infoMessage, label, disabled, title, name, size, required, showRequiredOnLabel, id, readonly, form, inputRef, onBlur, onChange, onFocus, onKeyDown, onKeyUp, onValueChanged, direction, labelHidden, infoData, }: RangeInputProps): JSX.Element;
|
|
4235
|
+
declare function RangeInput({ value, min, max, step, prefix, suffix, helpTag, errorMessage, infoMessage, label, disabled, title, name, size: sizeProp, required, showRequiredOnLabel, id, readonly, form, inputRef, onBlur, onChange, onFocus, onKeyDown, onKeyUp, onValueChanged, direction: directionProp, labelHidden, infoData, }: RangeInputProps): JSX.Element;
|
|
4235
4236
|
|
|
4236
4237
|
type DateInputProps = StrictOmit<InputPropsType<string>, 'type' | 'value' | 'onValueChanged'> & InputStylingPropsType & {
|
|
4237
4238
|
/**
|
|
@@ -4407,7 +4408,7 @@ type FileInputProps = StrictOmit<InputPropsType<string>, 'type' | 'step' | 'valu
|
|
|
4407
4408
|
* **default:** toon de namen van alle geselecteerde bestanden, gescheiden door komma's. Als er geen bestanden zijn, dan de noFilesTxt tonen.
|
|
4408
4409
|
* @param onValueChanged callback voor value changes. Bevat het path naar de file(s) en de files in een array.
|
|
4409
4410
|
*/
|
|
4410
|
-
declare function FileInput({ labelHidden, multiple, placeholder, helpTag, errorMessage, infoMessage, label, disabled, keyboardType, title, name, required, showRequiredOnLabel, spellCheck, id, autoComplete, max, min, readonly, pattern, autofocus, form, inputRef: ref, onBlur, onChange, onFocus, onKeyDown, onKeyUp, onValueChanged, size, alignment, direction, value, icon, boxed, accept, capture, noFilesTxt, chooseFileTxt, infoData, formatter, }: FileInputProps): JSX.Element;
|
|
4411
|
+
declare function FileInput({ labelHidden, multiple, placeholder, helpTag, errorMessage, infoMessage, label, disabled, keyboardType, title, name, required, showRequiredOnLabel, spellCheck, id, autoComplete, max, min, readonly, pattern, autofocus, form, inputRef: ref, onBlur, onChange, onFocus, onKeyDown, onKeyUp, onValueChanged, size: sizeProp, alignment: alignmentProp, direction: directionProp, value, icon, boxed, accept, capture, noFilesTxt, chooseFileTxt, infoData, formatter, }: FileInputProps): JSX.Element;
|
|
4411
4412
|
|
|
4412
4413
|
type CurrencyInputProps = StrictOmit<InputPropsType<number>, 'keyboardType' | 'pattern' | 'value' | 'type' | 'onValueChanged' | 'errorMessage' | 'infoMessage'> & InputStylingPropsType & {
|
|
4413
4414
|
/** waarde van de input. Als number of als number-string-tuple (zoals waarde uit `onValueChanged`) */
|
|
@@ -4449,7 +4450,7 @@ type CurrencyInputProps = StrictOmit<InputPropsType<number>, 'keyboardType' | 'p
|
|
|
4449
4450
|
* const [x, setX] = React.useState<string>('0');
|
|
4450
4451
|
* <CurrencyInput value={x} onValueChanged={([strVal, _numVal]) => setX(strVal)} />
|
|
4451
4452
|
*/
|
|
4452
|
-
declare function CurrencyInput({ placeholder, helpTag, errorMessage, infoMessage, label, disabled, title, name, value, required, showRequiredOnLabel, spellCheck, id, autoComplete, max, min, inputRef, readonly, step, autofocus, infoData, form, onBlur, onChange, onFocus, onKeyDown, onKeyUp, onValueChanged, size, alignment, direction, labelHidden, loading, icon, suffix, prefix, decimalScale, decimalSeparator, groupSeparator, }: CurrencyInputProps): JSX.Element;
|
|
4453
|
+
declare function CurrencyInput({ placeholder, helpTag, errorMessage, infoMessage, label, disabled, title, name, value, required, showRequiredOnLabel, spellCheck, id, autoComplete, max, min, inputRef, readonly, step, autofocus, infoData, form, onBlur, onChange, onFocus, onKeyDown, onKeyUp, onValueChanged, size: sizeProp, alignment: alignmentProp, direction: directionProp, labelHidden, loading, icon, suffix, prefix, decimalScale, decimalSeparator, groupSeparator, }: CurrencyInputProps): JSX.Element;
|
|
4453
4454
|
|
|
4454
4455
|
/** WeekInput: input voor een weeknummer (format: yyyy-Www)
|
|
4455
4456
|
* -1e getal: jaartal
|
|
@@ -4825,13 +4826,88 @@ declare function ModalProvider({ children }: {
|
|
|
4825
4826
|
children: React$1.ReactNode;
|
|
4826
4827
|
}): react_jsx_runtime.JSX.Element;
|
|
4827
4828
|
|
|
4829
|
+
type InputSettings = {
|
|
4830
|
+
/** default size setting (`m`) */
|
|
4831
|
+
size: SizeProp;
|
|
4832
|
+
/** default direction setting (`v`) */
|
|
4833
|
+
direction: DirectionProp;
|
|
4834
|
+
/** default alignment setting (`l`) */
|
|
4835
|
+
alignment: AlignmentProp;
|
|
4836
|
+
/** default direction setting for radio-button-items (`v`) */
|
|
4837
|
+
rbDirection: DirectionProp;
|
|
4838
|
+
};
|
|
4839
|
+
type ButtonSettings = {
|
|
4840
|
+
/** default size setting (`m`) */
|
|
4841
|
+
size: SizeProp;
|
|
4842
|
+
/** default color setting (`p`) , voor als er geen color is opgegeven*/
|
|
4843
|
+
color: ColorProp;
|
|
4844
|
+
};
|
|
4845
|
+
type TabSettings = {
|
|
4846
|
+
/** default size setting (`m`) */
|
|
4847
|
+
size: SizeProp;
|
|
4848
|
+
};
|
|
4849
|
+
type TagSettings = {
|
|
4850
|
+
/** default size setting (`m`) */
|
|
4851
|
+
size: TagSizeProp;
|
|
4852
|
+
};
|
|
4853
|
+
type DefaultsType = {
|
|
4854
|
+
/** default settings for inputs */
|
|
4855
|
+
input: InputSettings;
|
|
4856
|
+
/** default button settings*/
|
|
4857
|
+
button: ButtonSettings;
|
|
4858
|
+
/** default tabbar settings */
|
|
4859
|
+
tabs: TabSettings;
|
|
4860
|
+
/** default tag settings */
|
|
4861
|
+
tags: TagSettings;
|
|
4862
|
+
};
|
|
4863
|
+
/** Partial type voor het updaten van een of meer enkele settings.
|
|
4864
|
+
* Alle properties zijn optioneel, en kunnen dus ook weggelaten worden.
|
|
4865
|
+
*/
|
|
4866
|
+
type OptionalDefaultsType = Partial<{
|
|
4867
|
+
/** default settings for inputs */
|
|
4868
|
+
input: Partial<InputSettings>;
|
|
4869
|
+
/** default button settings*/
|
|
4870
|
+
button: Partial<ButtonSettings>;
|
|
4871
|
+
/** default tabbar settings */
|
|
4872
|
+
tabs: Partial<TabSettings>;
|
|
4873
|
+
/** default tag settings */
|
|
4874
|
+
tags: Partial<TagSettings>;
|
|
4875
|
+
}>;
|
|
4876
|
+
/**
|
|
4877
|
+
* Context voor het bijhouden van de default waardes voor de LoonBulmaReact componenten
|
|
4878
|
+
* @param defaults de defaults zoals geconfigureerd: een merge van de standaard-defaults en de opgegeven defaults in de provider.
|
|
4879
|
+
* @param update: update functie voor de defaults
|
|
4880
|
+
* @param reset: reset functie voor de defaults. Zet de defaults terug naar de custom defaults.
|
|
4881
|
+
* @returns een context met de default waardes en een functie om deze te updaten
|
|
4882
|
+
*/
|
|
4883
|
+
declare const DefaultsContext: React$1.Context<{
|
|
4884
|
+
defaults: DefaultsType;
|
|
4885
|
+
update: (d: OptionalDefaultsType) => void;
|
|
4886
|
+
reset: () => void;
|
|
4887
|
+
}>;
|
|
4888
|
+
/** Provider voor de DefaultsContext
|
|
4889
|
+
* @param children de children van de provider
|
|
4890
|
+
* @param defaults de custom defaults die de standaard defaults overschrijven
|
|
4891
|
+
* @returns de provider met de defaults en de update en reset functies
|
|
4892
|
+
*/
|
|
4893
|
+
declare function DefaultsProvider({ children, defaults: customDefaults }: {
|
|
4894
|
+
children: React$1.ReactNode;
|
|
4895
|
+
defaults?: OptionalDefaultsType;
|
|
4896
|
+
}): react_jsx_runtime.JSX.Element;
|
|
4897
|
+
|
|
4828
4898
|
type AppProviderProps = {
|
|
4829
4899
|
children: React.ReactNode;
|
|
4830
4900
|
notifierLocation?: 'top' | 'bottom';
|
|
4831
4901
|
initialTheme?: ColorSchemeType;
|
|
4902
|
+
defaults?: OptionalDefaultsType;
|
|
4832
4903
|
onThemeChanged?: (v: ColorSchemeType) => void;
|
|
4833
4904
|
};
|
|
4834
|
-
|
|
4905
|
+
/**
|
|
4906
|
+
* Provider-wrapper die alle LoonBulmaReact providers bevat.
|
|
4907
|
+
* @param param0
|
|
4908
|
+
* @returns
|
|
4909
|
+
*/
|
|
4910
|
+
declare function LoonBulmaReactProviders({ children, initialTheme, notifierLocation, defaults, onThemeChanged, }: AppProviderProps): react_jsx_runtime.JSX.Element;
|
|
4835
4911
|
|
|
4836
4912
|
type CopyType = {
|
|
4837
4913
|
/**
|
|
@@ -5300,4 +5376,4 @@ declare function ContextMenu({ outerRef, children }: {
|
|
|
5300
5376
|
children: React$1.ReactNode;
|
|
5301
5377
|
}): react_jsx_runtime.JSX.Element;
|
|
5302
5378
|
|
|
5303
|
-
export { AND, type ActionSheetButton, ActionSheetProvider, type AlignmentProp, type AllowedPromptTypes, type AnchorRelProp, type AnchorTargetProp, AspectRatio, type AspectRatioProps, type AutoCompleteProp, type BaseEventProps, BaseInput, Block, BorderBox, Box, type BoxProps, Button, Buttons as ButtonGroup, type ButtonGroupProps, type ButtonProps, Buttons, CB, Calendar, type CalendarOptions, type CalendarType, CheckBox, type CheckBoxInputProps as CheckboxInputProps, ColorInput, type ColorInputProps, type ColorProp, ColorSchemeContext, ColorSchemeProvider, type ColorSchemeType, Column, type ColumnProps, Columns, ComboBox, type ComboBoxProps, ConfirmProvider, Container, Content, ContextMenu, type CoordinatesProp, CurrencyInput, type CurrencyInputProps, DOTS, DataTable, type DataTableColumnProp as DataTableColumn, type DataTableProps, DateInput, type DateInputProps, DateTimeInput, type DateTimeInputProps, DefinedHexColors, DialogsProvider, type DiffFnType, type DirectionProp, EmailInput, type EmailInputProps, EvMv, type ExpandedColumnProps, FileInput, type FileInputProps, type FileInputValue, Footer, H1, H2, H3, H4, H5, H6, type HSLColor, HelpTxt, type HelpTxtProps, Hero, type HeroProps, type HexColor$1 as HexColor, HiddenInput, type HiddenInputProps, type Hotkey, type HotkeyItem, IF, IbanDetailsPerLand, Icon, type IconProps, IconStack, IconText, type IconTextProps, Image, type ImageProps, Indicator, type IndicatorPositionProp, type IndicatorProps, Input, InputContainer, type InputPropsType, type InputStylingPropsType, type InputValueType, type JSChangeDateTimeType, type JSDateSetterType, JSDateTime, JSDuration, Kbd, Kbds, type KeyOf, type KeyboardTypeProp, Link, LinkButton, type LinkButtonProps, type LinkProps, LoonBulmaReactProviders, Menu, type MenuItemGroupProps, type MenuItemProps, type MenuProps, Message, type MessageProps, Modal, ModalContext, type ModalProps, ModalProvider, MonthInput, type MonthInputProps, type MonthInputString, type MonthViewProps, MultiComboBox, type MultiComboBoxProps, NAND, NOR, NOT, Notification, type NotificationProps, Notifier, type NotifierContextType, type NotifierItemProps, type NotifierProps, NotifierProvider, type NotifierProviderProps, NumberInput, type NumberInputProps, OR, type OnOffToggleItemProps, Pagination, type PaginationParams, type PaginationProps, PasswordInput, type PasswordInputProps, type PositionProp, type PrettierType, ProgressBar, type ProgressBarProps, PromptProvider, QuickView, type QuickViewProps, RB, type RGBColor, RadioGroup, type RadioInputProps, RangeInput, type RangeInputProps, type RectProp, type RelationshipProp, ContextMenu as RightClickMenu, SWITCH, ScrollArea, Section, Select, type SelectInputProps, SimpleTable, type SimpleTableColProps, type SimpleTableProps, type SizeProp, type StepItemProps, Steps, type StepsProps, type StrictOmit, TabBar, type TabBarItemProps, type TabBarProps, Table, Tag, type TagProps, type TagSizeProp, Tags, TagsInput, type TagsInputProps, type TagsProps, TelephoneInput, type TelephoneInputProps, type TextAlignmentProp, TextArea, type TextAreaProps, TextEditor, TextInput, type TextInputProps, TimeInput, type TimeInputProps, TimeLine, type TimeLineItemProps, type TimeLinePointProps, type TimeLineProps, ToggleBar, type ToggleBarProps, type ToggleItemProps, TT as Tooltip, URLInput, type URLInputProps, type UncontrolledMode, type UncontrolledOptions, WeekInput, type WeekInputProps, type WeekInputString, type WeekViewProps, XNOR, XOR, boolSort, calculateTxtColor, centerPad, colorPropToHex, dateSort, getCurrentColorScheme, getHotkeyHandler, getHotkeyMatcher, getSystemColorScheme, hasBSN, hexToHSL, hexToRGB, hslToHex, hslToRGB, isHSLColor, isHexColor, isIBAN, isRGBColor, leftPad, numSort, parseHotkey, randomColor, randomColorProp, randomDbl, randomInt, rgbToHSL, rgbToHex, rightPad, roundTo, setColorScheme, stringSort, useActionSheet, useBoolToggle, useClickOutside, useClipboard, useColorScheme, useConfirm, useContextMenu, useDebouncedState, useDebouncedValue, useFetchAPI, useHotkeys, useLocalStoredState, useNotifier, usePagination, usePrompt, useContextMenu as useRightClick, useScrollIntoView, useSessionStoredState, useToggle, useUncontrolled, useValidatedState };
|
|
5379
|
+
export { AND, type ActionSheetButton, ActionSheetProvider, type AlignmentProp, type AllowedPromptTypes, type AnchorRelProp, type AnchorTargetProp, AspectRatio, type AspectRatioProps, type AutoCompleteProp, type BaseEventProps, BaseInput, Block, BorderBox, Box, type BoxProps, Button, Buttons as ButtonGroup, type ButtonGroupProps, type ButtonProps, Buttons, CB, Calendar, type CalendarOptions, type CalendarType, CheckBox, type CheckBoxInputProps as CheckboxInputProps, ColorInput, type ColorInputProps, type ColorProp, ColorSchemeContext, ColorSchemeProvider, type ColorSchemeType, Column, type ColumnProps, Columns, ComboBox, type ComboBoxProps, ConfirmProvider, Container, Content, ContextMenu, type CoordinatesProp, CurrencyInput, type CurrencyInputProps, DOTS, DataTable, type DataTableColumnProp as DataTableColumn, type DataTableProps, DateInput, type DateInputProps, DateTimeInput, type DateTimeInputProps, DefaultsContext, DefaultsProvider, DefinedHexColors, DialogsProvider, type DiffFnType, type DirectionProp, EmailInput, type EmailInputProps, EvMv, type ExpandedColumnProps, FileInput, type FileInputProps, type FileInputValue, Footer, H1, H2, H3, H4, H5, H6, type HSLColor, HelpTxt, type HelpTxtProps, Hero, type HeroProps, type HexColor$1 as HexColor, HiddenInput, type HiddenInputProps, type Hotkey, type HotkeyItem, IF, IbanDetailsPerLand, Icon, type IconProps, IconStack, IconText, type IconTextProps, Image, type ImageProps, Indicator, type IndicatorPositionProp, type IndicatorProps, Input, InputContainer, type InputPropsType, type InputStylingPropsType, type InputValueType, type JSChangeDateTimeType, type JSDateSetterType, JSDateTime, JSDuration, Kbd, Kbds, type KeyOf, type KeyboardTypeProp, Link, LinkButton, type LinkButtonProps, type LinkProps, LoonBulmaReactProviders, Menu, type MenuItemGroupProps, type MenuItemProps, type MenuProps, Message, type MessageProps, Modal, ModalContext, type ModalProps, ModalProvider, MonthInput, type MonthInputProps, type MonthInputString, type MonthViewProps, MultiComboBox, type MultiComboBoxProps, NAND, NOR, NOT, Notification, type NotificationProps, Notifier, type NotifierContextType, type NotifierItemProps, type NotifierProps, NotifierProvider, type NotifierProviderProps, NumberInput, type NumberInputProps, OR, type OnOffToggleItemProps, type OptionalDefaultsType, Pagination, type PaginationParams, type PaginationProps, PasswordInput, type PasswordInputProps, type PositionProp, type PrettierType, ProgressBar, type ProgressBarProps, PromptProvider, QuickView, type QuickViewProps, RB, type RGBColor, RadioGroup, type RadioInputProps, RangeInput, type RangeInputProps, type RectProp, type RelationshipProp, ContextMenu as RightClickMenu, SWITCH, ScrollArea, Section, Select, type SelectInputProps, SimpleTable, type SimpleTableColProps, type SimpleTableProps, type SizeProp, type StepItemProps, Steps, type StepsProps, type StrictOmit, TabBar, type TabBarItemProps, type TabBarProps, Table, Tag, type TagProps, type TagSizeProp, Tags, TagsInput, type TagsInputProps, type TagsProps, TelephoneInput, type TelephoneInputProps, type TextAlignmentProp, TextArea, type TextAreaProps, TextEditor, TextInput, type TextInputProps, TimeInput, type TimeInputProps, TimeLine, type TimeLineItemProps, type TimeLinePointProps, type TimeLineProps, ToggleBar, type ToggleBarProps, type ToggleItemProps, TT as Tooltip, URLInput, type URLInputProps, type UncontrolledMode, type UncontrolledOptions, WeekInput, type WeekInputProps, type WeekInputString, type WeekViewProps, XNOR, XOR, boolSort, calculateTxtColor, centerPad, colorPropToHex, dateSort, getCurrentColorScheme, getHotkeyHandler, getHotkeyMatcher, getSystemColorScheme, hasBSN, hexToHSL, hexToRGB, hslToHex, hslToRGB, isHSLColor, isHexColor, isIBAN, isRGBColor, leftPad, numSort, parseHotkey, randomColor, randomColorProp, randomDbl, randomInt, rgbToHSL, rgbToHex, rightPad, roundTo, setColorScheme, stringSort, useActionSheet, useBoolToggle, useClickOutside, useClipboard, useColorScheme, useConfirm, useContextMenu, useDebouncedState, useDebouncedValue, useFetchAPI, useHotkeys, useLocalStoredState, useNotifier, usePagination, usePrompt, useContextMenu as useRightClick, useScrollIntoView, useSessionStoredState, useToggle, useUncontrolled, useValidatedState };
|