Merge branch 'blocks-antd' into blocks-antd-weekselector

This commit is contained in:
Gervwyk 2020-11-04 16:23:03 +02:00
commit ff2e4a836e
20 changed files with 1662 additions and 222 deletions

View File

@ -4,3 +4,96 @@
type: DateSelector
properties:
title: DateSelector title
- id: "properties.allowClear: false"
type: DateSelector
properties:
allowClear: false
- id: "properties.autoFocus: true"
type: DateSelector
properties:
autoFocus: true
- id: "properties.disabled: true"
type: DateSelector
properties:
disabled: true
- id: "properties.disabledDates.min"
type: DateSelector
properties:
disabledDates:
min: 2020-10-20
- id: "properties.disabledDates.max"
type: DateSelector
properties:
disabledDates:
max: 2020-10-15
- id: "properties.disabledDates.dates"
type: DateSelector
properties:
disabledDates:
dates:
- _date: 2020-10-26
- 2020-10-29
- 2020-11-02
- id: "properties.disabledDates.ranges" #Works as >= start, but < end?
type: DateSelector
properties:
disabledDates:
ranges:
- ["2020-10-26", "2020-10-29"]
- - 2020-11-01
- 2020-11-02
- id: "properties.format: YYYY-MMMM-DD"
type: DateSelector
properties:
format: YYYY-MMMM-DD
- id: "properties.inputStyle: CSS style applied"
type: DateSelector
properties:
inputStyle:
border: 1px solid red
- id: "properties.placeholder: - Select this Date"
type: DateSelector
properties:
placeholder: Select this Date
- id: "properties.showToday: true"
type: DateSelector
properties:
showToday: true
- id: "properties.size: small"
type: DateSelector
properties:
size: small
- id: "properties.suffixIcon: CalendarTwoTone"
type: DateSelector
properties:
suffixIcon: CalendarTwoTone
- id: "properties.label span: 12"
type: DateSelector
properties:
label:
span: 12
- id: "properties.label align: right"
type: DateSelector
properties:
label:
align: right
- id: "properties.label inline: true"
type: DateSelector
properties:
label:
inline: true
- id: "properties.label disabled: true"
type: DateSelector
properties:
label:
disabled: true
- id: "properties.label colon: true"
type: DateSelector
properties:
label:
colon: true
- id: "properties.label extra: extra text added"
type: DateSelector
properties:
label:
extra: extra text added

View File

@ -3,4 +3,5 @@
- id: properties.content
type: PageHCF
properties:
content: This is page content
content:
content: This is page content

View File

@ -3,4 +3,5 @@
- id: properties.content
type: PageHCSF
properties:
content: This is page content
content:
content: This is page content

View File

@ -3,4 +3,5 @@
- id: properties.content
type: PageHSCF
properties:
content: This is page content
content:
content: This is page content

View File

@ -3,4 +3,5 @@
- id: properties.content
type: PageHeaderMenu
properties:
content: This is page content
content:
content: This is page content

View File

@ -3,4 +3,5 @@
- id: properties.content
type: PageSHCF
properties:
content: This is page content
content:
content: This is page content

View File

@ -3,4 +3,5 @@
- id: properties.content
type: PageSiderMenu
properties:
content: This is page content
content:
content: This is page content

View File

@ -18,27 +18,14 @@ import React from 'react';
import { DatePicker } from 'antd';
import moment from 'moment';
import { blockDefaultProps } from '@lowdefy/block-tools';
import { get, type } from '@lowdefy/helpers';
import { type } from '@lowdefy/helpers';
import Label from '../Label/Label';
import Icon from '../Icon/Icon';
import disabledDate from '../../disabledDate';
const RangePicker = DatePicker.RangePicker;
const disabledDate = ({ min, max, dates, ranges }) => (currentDate) => {
if (min && currentDate < min) return true;
if (max && currentDate > max) return true;
let match = dates.find((date) => date.format('YYYY MM DD') === currentDate.format('YYYY MM DD'));
if (match) return true;
ranges.forEach((range) => {
if (currentDate >= range[0] && currentDate <= range[1]) {
match = true;
}
});
if (match) return true;
return false;
};
const rangeValue = (value, format) => {
if (value && format) return value.map((val) => moment.utc(val, format).startOf('day'));
if (value) return value.map((val) => moment.utc(val).startOf('day'));
@ -90,23 +77,7 @@ const DateRangeSelector = ({
)
}
separator={properties.separator || '~'}
disabledDate={disabledDate({
min: get(properties, 'disabledDates.min')
? moment(properties.disabledDates.min)
: undefined,
max: get(properties, 'disabledDates.max')
? moment(properties.disabledDates.max).add(1, 'days')
: undefined,
dates: (get(properties, 'disabledDates.dates') || []).map((date) => moment(date)),
ranges: (get(properties, 'disabledDates.ranges') || [])
.map((range) => {
if (type.isArray(range) && range.length === 2) {
return [moment(range[0]), moment(range[1])];
}
return null;
})
.filter((range) => range !== null),
})}
disabledDate={disabledDate(properties.disabledDate)}
onChange={(newVal) => {
methods.setValue(
!newVal

View File

@ -16,32 +16,19 @@
import React from 'react';
import moment from 'moment';
import { get, type } from '@lowdefy/helpers';
import { type } from '@lowdefy/helpers';
import { blockDefaultProps } from '@lowdefy/block-tools';
import { DatePicker } from 'antd';
import Label from '../Label/Label';
import Icon from '../Icon/Icon';
const disabledDate = ({ min, max, dates, ranges }) => (currentDate) => {
if (min && currentDate < min) return true;
if (max && currentDate > max) return true;
let match = dates.find((date) => date.format('YYYY MM DD') === currentDate.format('YYYY MM DD'));
if (match) return true;
ranges.forEach((range) => {
if (currentDate >= range[0] && currentDate <= range[1]) {
match = true;
}
});
if (match) return true;
return false;
};
import disabledDate from '../../disabledDate';
const DateSelector = ({ blockId, loading, methods, properties, required, validate, value }) => {
return (
<Label
blockId={blockId}
properties={{ title: properties.title, size: properties.size, ...properties.Label }}
properties={{ title: properties.title, size: properties.size, ...properties.label }}
validate={validate}
required={required}
loading={loading}
@ -69,23 +56,7 @@ const DateSelector = ({ blockId, loading, methods, properties, required, validat
/>
)
}
disabledDate={disabledDate({
min: get(properties, 'disabledDates.min')
? moment(properties.disabledDates.min)
: undefined,
max: get(properties, 'disabledDates.max')
? moment(properties.disabledDates.max).add(1, 'days')
: undefined,
dates: (get(properties, 'disabledDates.dates') || []).map((date) => moment(date)),
ranges: (get(properties, 'disabledDates.ranges') || [])
.map((range) => {
if (type.isArray(range) && range.length === 2) {
return [moment(range[0]), moment(range[1])];
}
return null;
})
.filter((range) => range !== null),
})}
disabledDate={disabledDate(properties.disabledDate)}
onChange={(newVal) => {
methods.setValue(
!newVal

View File

@ -51,6 +51,7 @@
"label": {
"type": "object",
"description": "Label properties.",
"additionalProperties": false,
"properties": {
"align": {
"type": "string",
@ -71,11 +72,24 @@
"type": "string",
"description": "Label title."
},
"span": {
"type": "number",
"description": "Label inline span."
},
"disabled": {
"type": "boolean",
"description": "Hide input label."
},
"hasFeedback": {
"type": "boolean",
"defaultValue": true,
"description": "Display feedback extra from validation, this does not disable validation."
},
"inline": {
"type": "boolean",
"defaultValue": false,
"description": "Render input and label inline."
},
"extraStyle": {
"type": "object",
"description": "Css style to applied to label extra."

View File

@ -22,20 +22,7 @@ import { blockDefaultProps } from '@lowdefy/block-tools';
import Label from '../Label/Label';
import Icon from '../Icon/Icon';
const disabledDate = ({ min, max, dates, ranges }) => (currentDate) => {
if (min && currentDate < min) return true;
if (max && currentDate > max) return true;
let match = dates.find((date) => date.format('YYYY MM DD') === currentDate.format('YYYY MM DD'));
if (match) return true;
ranges.forEach((range) => {
if (currentDate >= range[0] && currentDate <= range[1]) {
match = true;
}
});
if (match) return true;
return false;
};
import disabledDate from '../../disabledDate';
const DateTimeSelector = ({ blockId, loading, methods, properties, required, validate, value }) => {
const timeUnit = !type.isString(properties.timeFormat)
@ -83,23 +70,7 @@ const DateTimeSelector = ({ blockId, loading, methods, properties, required, val
secondStep: properties.secondStep || 30,
}}
showNow={properties.showNow}
disabledDate={disabledDate({
min: get(properties, 'disabledDates.min')
? moment(properties.disabledDates.min)
: undefined,
max: get(properties, 'disabledDates.max')
? moment(properties.disabledDates.max).add(1, 'days')
: undefined,
dates: (get(properties, 'disabledDates.dates') || []).map((date) => moment(date)),
ranges: (get(properties, 'disabledDates.ranges') || [])
.map((range) => {
if (type.isArray(range) && range.length === 2) {
return [moment(range[0]), moment(range[1])];
}
return null;
})
.filter((range) => range !== null),
})}
disabledDate={disabledDate(properties.disabledDate)}
onChange={(newVal) => {
methods.setValue(
!newVal

View File

@ -18,26 +18,14 @@ import React from 'react';
import { DatePicker } from 'antd';
import moment from 'moment';
import { blockDefaultProps } from '@lowdefy/block-tools';
import { get, type } from '@lowdefy/helpers';
import { type } from '@lowdefy/helpers';
import Label from '../Label/Label';
import Icon from '../Icon/Icon';
import disabledDate from '../../disabledDate';
const MonthPicker = DatePicker.MonthPicker;
const disabledDate = ({ min, max, dates, ranges }) => (currentDate) => {
if (min && currentDate < min) return true;
if (max && currentDate > max) return true;
let match = dates.find((date) => date.format('YYYY MM DD') === currentDate.format('YYYY MM DD'));
if (match) return true;
ranges.forEach((range) => {
if (currentDate >= range[0] && currentDate <= range[1]) {
match = true;
}
});
if (match) return true;
return false;
};
const MonthSelector = ({ blockId, loading, methods, properties, required, validate, value }) => {
return (
<Label
@ -69,23 +57,7 @@ const MonthSelector = ({ blockId, loading, methods, properties, required, valida
/>
)
}
disabledDate={disabledDate({
min: get(properties, 'disabledDates.min')
? moment(get(properties, 'disabledDates.min'))
: undefined,
max: get(properties, 'disabledDates.max')
? moment(get(properties, 'disabledDates.max')).add(1, 'months')
: undefined,
dates: (get(properties, 'disabledDates.dates') || []).map((date) => moment(date)),
ranges: (get(properties, 'disabledDates.ranges') || [])
.map((range) => {
if (type.isArray(range) && range.length === 2) {
return [moment(range[0]), moment(range[1])];
}
return null;
})
.filter((range) => range !== null),
})}
disabledDate={disabledDate(properties.disabledDate)}
onChange={(newVal) => {
methods.setValue(
!newVal

View File

@ -18,27 +18,14 @@ import React from 'react';
import { DatePicker } from 'antd';
import moment from 'moment';
import { blockDefaultProps } from '@lowdefy/block-tools';
import { get, type } from '@lowdefy/helpers';
import { type } from '@lowdefy/helpers';
import Label from '../Label/Label';
import Icon from '../Icon/Icon';
import disabledDate from '../../disabledDate';
const WeekPicker = DatePicker.WeekPicker;
const disabledDate = ({ min, max, dates, ranges }) => (currentDate) => {
if (min && currentDate < min) return true;
if (max && currentDate > max) return true;
let match = dates.find((date) => date.format('YYYY MM DD') === currentDate.format('YYYY MM DD'));
if (match) return true;
ranges.forEach((range) => {
if (currentDate >= range[0] && currentDate <= range[1]) {
match = true;
}
});
if (match) return true;
return false;
};
const WeekSelector = ({ blockId, loading, methods, properties, required, validate, value }) => {
return (
<Label
@ -70,23 +57,7 @@ const WeekSelector = ({ blockId, loading, methods, properties, required, validat
/>
)
}
disabledDate={disabledDate({
min: get(properties, 'disabledDates.min')
? moment(properties.disabledDates.min)
: undefined,
max: get(properties, 'disabledDates.max')
? moment(properties.disabledDates.max).add(1, 'weeks')
: undefined,
dates: (get(properties, 'disabledDates.dates') || []).map((date) => moment(date)),
ranges: (get(properties, 'disabledDates.ranges') || [])
.map((range) => {
if (type.isArray(range) && range.length === 2) {
return [moment(range[0]), moment(range[1])];
}
return null;
})
.filter((range) => range !== null),
})}
disabledDate={disabledDate(properties.disabledDate)}
onChange={(newVal) => {
methods.setValue(
!newVal

View File

@ -0,0 +1,40 @@
import moment from 'moment';
import { type } from '@lowdefy/helpers';
const disabledDate = (disabledDates = {}) => {
const min = type.isNone(disabledDates.min)
? undefined
: moment(disabledDates.min).utc().startOf('day');
const max = type.isNone(disabledDates.max)
? undefined
: moment(disabledDates.max).utc().endOf('day');
const dates = (disabledDates.dates || []).map((date) => moment(date).utc().startOf('day'));
const ranges = (disabledDates.ranges || [])
.map((range) => {
if (type.isArray(range) && range.length === 2) {
return [moment(range[0]).utc().startOf('day'), moment(range[1]).utc().endOf('day')];
}
return null;
})
.filter((range) => range !== null);
return (currentDate) => {
const utcCurrentData = currentDate.utc();
if (min && utcCurrentData.isBefore(min)) return true;
if (max && utcCurrentData.isAfter(max)) return true;
let match = dates.find((date) => date.isSame(utcCurrentData.startOf('day')));
if (match) return true;
ranges.forEach((range) => {
if (
utcCurrentData.startOf('day').isSameOrAfter(range[0]) &&
utcCurrentData.endOf('day').isSameOrBefore(range[1])
) {
match = true;
}
});
if (match) return true;
return false;
};
};
export default disabledDate;

View File

@ -0,0 +1,97 @@
import moment from 'moment';
import disabledDate from './disabledDate';
test('default', () => {
const fn = disabledDate();
expect(fn(moment(new Date(0)))).toEqual(false);
});
test('disabledDate.min', () => {
const fn = disabledDate({
min: new Date('2020-01-01T00:00:00.000Z'),
});
expect(fn(moment('2019-12-31T23:59:00.000Z'))).toEqual(true);
expect(fn(moment('2020-01-01T00:00:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-01T01:00:00.000Z'))).toEqual(false);
});
test('disabledDate.min invalid', () => {
const fn = disabledDate({
min: 0,
});
expect(fn(moment('2019-12-31T23:59:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-01T00:00:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-01T01:00:00.000Z'))).toEqual(false);
});
test('disabledDate.max', () => {
const fn = disabledDate({
max: new Date('2020-01-01T00:00:00.000Z'),
});
expect(fn(moment('2020-01-01T00:00:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-01T23:59:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-02T00:00:00.000Z'))).toEqual(true);
});
test('disabledDate.max invalid', () => {
const fn = disabledDate({
max: 'x',
});
expect(fn(moment('2019-12-31T23:59:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-01T00:00:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-01T01:00:00.000Z'))).toEqual(false);
});
test('disabledDate.dates', () => {
const fn = disabledDate({
dates: [new Date('2020-01-01T00:00:00.000Z'), new Date('2020-01-05T00:00:00.000Z')],
});
expect(fn(moment('2020-01-01T00:00:00.000Z'))).toEqual(true);
expect(fn(moment('2020-01-01T01:00:00.000Z'))).toEqual(true);
expect(fn(moment('2020-01-05T00:00:00.000Z'))).toEqual(true);
expect(fn(moment('2020-01-05T12:00:00.000Z'))).toEqual(true);
expect(fn(moment('2020-01-06T00:00:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-04T23:59:00.000Z'))).toEqual(false);
});
test('disabledDate.dates - invalid: schema to throw', () => {
const fn = disabledDate({
dates: ['x', new Date('2020-01-05T00:00:00.000Z')],
});
expect(fn(moment('2020-01-01T00:00:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-01T01:00:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-05T00:00:00.000Z'))).toEqual(true);
expect(fn(moment('2020-01-05T12:00:00.000Z'))).toEqual(true);
expect(fn(moment('2020-01-06T00:00:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-04T23:59:00.000Z'))).toEqual(false);
});
test('disabledDate.range', () => {
const fn = disabledDate({
ranges: [[new Date('2020-01-02T00:00:00.000Z'), new Date('2020-01-05T00:00:00.000Z')]],
});
expect(fn(moment('2020-01-01T00:00:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-01T23:59:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-02T00:00:00.000Z'))).toEqual(true);
expect(fn(moment('2020-01-04T23:00:00.000Z'))).toEqual(true);
expect(fn(moment('2020-01-05T00:00:00.000Z'))).toEqual(true);
expect(fn(moment('2020-01-05T23:59:00.000Z'))).toEqual(true);
expect(fn(moment('2020-01-06T00:00:00.000Z'))).toEqual(false);
});
test('disabledDate.range - invalid: schema to throw', () => {
const fn = disabledDate({
ranges: [new Date('2020-01-02T00:00:00.000Z'), new Date('2020-01-05T00:00:00.000Z')],
});
expect(fn(moment('2020-01-01T00:00:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-01T23:59:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-02T00:00:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-04T23:00:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-05T00:00:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-05T23:59:00.000Z'))).toEqual(false);
expect(fn(moment('2020-01-06T00:00:00.000Z'))).toEqual(false);
});

View File

@ -50,18 +50,6 @@ exports[`Test Schema default 1`] = `true`;
exports[`Test Schema default 2`] = `null`;
exports[`Test Schema properties.content 1`] = `false`;
exports[`Test Schema properties.content 1`] = `true`;
exports[`Test Schema properties.content 2`] = `
Array [
Object {
"dataPath": "/properties/content",
"keyword": "type",
"message": "should be object",
"params": Object {
"type": "object",
},
"schemaPath": "#/properties/properties/properties/content/type",
},
]
`;
exports[`Test Schema properties.content 2`] = `null`;

View File

@ -60,18 +60,6 @@ exports[`Test Schema default 1`] = `true`;
exports[`Test Schema default 2`] = `null`;
exports[`Test Schema properties.content 1`] = `false`;
exports[`Test Schema properties.content 1`] = `true`;
exports[`Test Schema properties.content 2`] = `
Array [
Object {
"dataPath": "/properties",
"keyword": "additionalProperties",
"message": "should NOT have additional properties",
"params": Object {
"additionalProperty": "content",
},
"schemaPath": "#/properties/properties/additionalProperties",
},
]
`;
exports[`Test Schema properties.content 2`] = `null`;

View File

@ -60,18 +60,6 @@ exports[`Test Schema default 1`] = `true`;
exports[`Test Schema default 2`] = `null`;
exports[`Test Schema properties.content 1`] = `false`;
exports[`Test Schema properties.content 1`] = `true`;
exports[`Test Schema properties.content 2`] = `
Array [
Object {
"dataPath": "/properties/content",
"keyword": "type",
"message": "should be object",
"params": Object {
"type": "object",
},
"schemaPath": "#/properties/properties/properties/content/type",
},
]
`;
exports[`Test Schema properties.content 2`] = `null`;

View File

@ -60,18 +60,6 @@ exports[`Test Schema default 1`] = `true`;
exports[`Test Schema default 2`] = `null`;
exports[`Test Schema properties.content 1`] = `false`;
exports[`Test Schema properties.content 1`] = `true`;
exports[`Test Schema properties.content 2`] = `
Array [
Object {
"dataPath": "/properties/content",
"keyword": "type",
"message": "should be object",
"params": Object {
"type": "object",
},
"schemaPath": "#/properties/properties/properties/content/type",
},
]
`;
exports[`Test Schema properties.content 2`] = `null`;