design-system-govbr-rnp
Version:
## Padrão Digital de Governo - React Biblioteca de componentes React que implementa o [Padrão Visual digital do governo](https://www.gov.br/ds/). O objetivo da biblioteca é facilitar a implementação e promover a padronização das interfaces de sistemas do
138 lines (137 loc) • 4.23 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.DatePickerOnTimeDate = exports.DatePickerOnTime = exports.DatePickerOnRage = exports.DatePickerOnDefault = void 0;
var _react = _interopRequireDefault(require("react"));
var _DatePicker = _interopRequireDefault(require("./DatePicker"));
var _DatePickerRage = _interopRequireDefault(require("./DatePickerRage"));
var _DatePickerTime = _interopRequireDefault(require("./DatePickerTime"));
var _DatePickerTimerPicker = _interopRequireDefault(require("./DatePickerTimerPicker"));
var _freeSolidSvgIcons = require("@fortawesome/free-solid-svg-icons");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
var _default = {
title: "Components/DatePicker",
component: _DatePicker.default,
argTypes: {
title: {
name: "Título",
type: {
name: "string",
required: true
},
description: "Título do DatePicker",
table: {
type: {
summary: "string"
}
},
control: {
type: "text"
}
},
size: {
name: "Tamanho",
type: {
name: "string",
required: true
},
description: "Tamanho do DatePicker",
table: {
type: {
summary: "string"
},
defaultValue: {
summary: "small"
}
},
control: {
type: "select",
options: ["small", "medium", "large"]
}
},
bgColor: {
name: "Cor de Fundo",
type: {
name: "string",
required: true
},
description: "Cor de fundo do DatePicker",
table: {
type: {
summary: "string"
},
defaultValue: {
summary: "#dbe8fb"
}
},
control: {
type: "color"
}
},
textColor: {
name: "Cor do Texto",
type: {
name: "string",
required: true
},
description: "Cor do texto do DatePicker",
table: {
type: {
summary: "string"
},
defaultValue: {
summary: "#c5d4eb"
}
},
control: {
type: "color"
}
},
type: {
table: {
disable: true
}
}
}
};
exports.default = _default;
var commonProps = {
label: "data",
id: "simples-input",
ariaLabel: "Abrir Timepicker"
};
var Template = function Template(args) {
return /*#__PURE__*/_react.default.createElement(_DatePicker.default, _extends({
placeholder: "dd/mm/aaaa"
}, commonProps, args));
};
var TemplateOnRage = function TemplateOnRage(args) {
return /*#__PURE__*/_react.default.createElement(_DatePickerRage.default, _extends({
placeholder: "dd/mm/aaaa at\xE9 dd/mm/aaaa"
}, commonProps, args));
};
var TemplateOntime = function TemplateOntime(args) {
return /*#__PURE__*/_react.default.createElement(_DatePickerTime.default, _extends({
placeholder: "hh:mm",
buttonIcon: _freeSolidSvgIcons.faClock
}, commonProps, args));
};
var TamplateOnTimeDate = function TamplateOnTimeDate(args) {
return /*#__PURE__*/_react.default.createElement(_DatePickerTimerPicker.default, _extends({
placeholder: "dd/mm/aaaa hh:mm"
}, commonProps, args));
};
var DatePickerOnDefault = Template.bind({});
exports.DatePickerOnDefault = DatePickerOnDefault;
DatePickerOnDefault.storyName = "DatePicker Padrão";
var DatePickerOnRage = TemplateOnRage.bind({});
exports.DatePickerOnRage = DatePickerOnRage;
DatePickerOnRage.storyName = "DatePicker com rager";
var DatePickerOnTime = TemplateOntime.bind();
exports.DatePickerOnTime = DatePickerOnTime;
DatePickerOnTime.storyName = "DatePickr on time";
var DatePickerOnTimeDate = TamplateOnTimeDate.bind();
exports.DatePickerOnTimeDate = DatePickerOnTimeDate;
DatePickerOnTimeDate.storyName = "DatePickr on time Date";