tiny-components
/
datepicker
1
0
Fork 0
Code Issues Pull Requests Projects Releases 6 Wiki Activity

adding

Browse Source
main
HerrHase 2 years ago
parent fa9fe9b551
commit ec94ffa927
10 changed files with 83 additions and 16 deletions
Show Stats Download Patch File Download Diff File

12
README.md
Unescape View File

@ -2,8 +2,8 @@
Datepicker Datepicker
Source: [https://gitea.node001.net/tiny-components/raw](https://gitea.node001.net/tiny-components/raw) Source: [https://gitea.node001.net/tiny-components/datepicker](https://gitea.node001.net/tiny-components/datepicker)
Mirror: [https://github.com/node001-net/tiny-components-raw](https://github.com/node001-net/tiny-components-raw) Mirror: [https://github.com/node001-net/tiny-components-datepicker](https://github.com/node001-net/tiny-components-datepicker)
## Installation ## Installation
@ -16,18 +16,16 @@ Setup this registry in your project .npmrc file:
Install with npm or yarn Install with npm or yarn
``` ```
npm i --save @tiny-components/raw npm i --save @tiny-components/datepicker
yarn add @tiny-components/raw yarn add @tiny-components/datepicker
``` ```
## Using ## Using
Thats all, html in String will not escaped.
``` ```
<tiny-raw html={ htmlString }></tiny-raw> <tiny-datepicker></tiny-datepicker>
``` ```
## i18n ## i18n
[List of locales](https://github.com/iamkun/dayjs/tree/dev/src/locale) [List of locales](https://github.com/iamkun/dayjs/tree/dev/src/locale)

9
example/example.css
Unescape View File

@ -14840,3 +14840,12 @@ svg.field-choice__checked {
.tiny-datepicker__button { .tiny-datepicker__button {
padding: 0.5em 0.75em; padding: 0.5em 0.75em;
} }
.console {
overflow-y: scroll;
max-height: 350px;
background: gray;
padding: 1em 1.5em;
background: #ddd;
border: 1px solid #b3b3b3;
}

28
example/example.js
Unescape View File

@ -361,16 +361,26 @@ __webpack_require__.r(__webpack_exports__);
"use strict"; "use strict";
__webpack_require__.r(__webpack_exports__); __webpack_require__.r(__webpack_exports__);
/* harmony import */ var riot__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! riot */ "./node_modules/riot/esm/api/register.js"); /* harmony import */ var riot__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! riot */ "./node_modules/riot/esm/api/register.js");
/* harmony import */ var riot__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! riot */ "./node_modules/riot/esm/riot.js"); /* harmony import */ var riot__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! riot */ "./node_modules/riot/esm/riot.js");
/* harmony import */ var _datepicker_riot__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./datepicker.riot */ "./src/datepicker.riot"); /* harmony import */ var _datepicker_riot__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./datepicker.riot */ "./src/datepicker.riot");
/* harmony import */ var dayjs__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! dayjs */ "./node_modules/dayjs/dayjs.min.js"); /* harmony import */ var _store_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./store.js */ "./src/store.js");
/* harmony import */ var dayjs__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(dayjs__WEBPACK_IMPORTED_MODULE_2__); /* harmony import */ var dayjs__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! dayjs */ "./node_modules/dayjs/dayjs.min.js");
/* harmony import */ var dayjs__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(dayjs__WEBPACK_IMPORTED_MODULE_3__);
riot__WEBPACK_IMPORTED_MODULE_1__.register('tiny-datepicker', _datepicker_riot__WEBPACK_IMPORTED_MODULE_0__["default"]); riot__WEBPACK_IMPORTED_MODULE_2__.register('tiny-datepicker', _datepicker_riot__WEBPACK_IMPORTED_MODULE_0__["default"]);
window.riot = riot__WEBPACK_IMPORTED_MODULE_3__; window.riot = riot__WEBPACK_IMPORTED_MODULE_4__;
document.addEventListener("DOMContentLoaded", function (event) {
var console = document.querySelector('.console');
_store_js__WEBPACK_IMPORTED_MODULE_1__["default"].on('change', function (data) {
var element = document.createElement('div');
element.append('Event => Change, ' + data.date.format('YYYY-MM-DD'));
console.append(element);
});
});
/***/ }), /***/ }),
@ -395,8 +405,12 @@ __webpack_require__.r(__webpack_exports__);
// add function for iso
dayjs__WEBPACK_IMPORTED_MODULE_0___default().extend((dayjs_plugin_isoWeek__WEBPACK_IMPORTED_MODULE_2___default())); dayjs__WEBPACK_IMPORTED_MODULE_0___default().extend((dayjs_plugin_isoWeek__WEBPACK_IMPORTED_MODULE_2___default()));
// getting local data for names
dayjs__WEBPACK_IMPORTED_MODULE_0___default().extend((dayjs_plugin_localeData__WEBPACK_IMPORTED_MODULE_3___default())); dayjs__WEBPACK_IMPORTED_MODULE_0___default().extend((dayjs_plugin_localeData__WEBPACK_IMPORTED_MODULE_3___default()));
/** /**
@ -433,6 +447,8 @@ dayjs__WEBPACK_IMPORTED_MODULE_0___default().extend((dayjs_plugin_localeData__WE
} else { } else {
this.state.date = dayjs__WEBPACK_IMPORTED_MODULE_0___default()(); this.state.date = dayjs__WEBPACK_IMPORTED_MODULE_0___default()();
} }
// change
if (this.props.isoFormat === 0) { if (this.props.isoFormat === 0) {
this.state.isoFormat = false; this.state.isoFormat = false;
this.state.weekFormat = 'week'; this.state.weekFormat = 'week';

7
example/index.html
Unescape View File

@ -36,9 +36,14 @@
<div class="container m-top-6"> <div class="container m-top-6">
<div class="grid"> <div class="grid">
<div class="col-12"> <div class="col-12 col-md-6">
<tiny-datepicker></tiny-datepicker> <tiny-datepicker></tiny-datepicker>
</div> </div>
<div class="col-12 col-md-6">
<div class="console">
</div>
</div>
</div> </div>
</div> </div>
<script defer src="/example.js"></script> <script defer src="/example.js"></script>

2
example/symbol-defs.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 66 KiB

After

Width:  |  Height:  |  Size: 69 KiB

13
src/example.js
Unescape View File

@ -1,8 +1,21 @@
import * as riot from 'riot' import * as riot from 'riot'
import Datepicker from './datepicker.riot' import Datepicker from './datepicker.riot'
import store from './store.js'
riot.register('tiny-datepicker', Datepicker) riot.register('tiny-datepicker', Datepicker)
import dayjs from 'dayjs' import dayjs from 'dayjs'
window.riot = riot window.riot = riot
document.addEventListener("DOMContentLoaded", (event) => {
const console = document.querySelector('.console')
store.on('change', (data) => {
const element = document.createElement('div')
element.append('Event => Change, ' + data.date.format('YYYY-MM-DD'))
console.append(element)
})
})

9
src/example.scss
Unescape View File

@ -1,3 +1,12 @@
@import @import
'../node_modules/@tiny-components/plain-ui/src/scss/plain-ui', '../node_modules/@tiny-components/plain-ui/src/scss/plain-ui',
'styles'; 'styles';
.console {
overflow-y: scroll;
max-height: 350px;
background: gray;
padding: 1em 1.5em;
background: #ddd;
border: 1px solid #b3b3b3;
}

11
src/icons/brands/gitea.svg
Unescape View File

@ -0,0 +1,11 @@
<svg version="1.1" id="main_outline" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 640 640" style="enable-background:new 0 0 640 640;" xml:space="preserve">
<g>
<path id="teabag" style="fill:#FFFFFF" d="M395.9,484.2l-126.9-61c-12.5-6-17.9-21.2-11.8-33.8l61-126.9c6-12.5,21.2-17.9,33.8-11.8 c17.2,8.3,27.1,13,27.1,13l-0.1-109.2l16.7-0.1l0.1,117.1c0,0,57.4,24.2,83.1,40.1c3.7,2.3,10.2,6.8,12.9,14.4 c2.1,6.1,2,13.1-1,19.3l-61,126.9C423.6,484.9,408.4,490.3,395.9,484.2z"/>
<g>
<g>
<path style="fill:#609926" d="M622.7,149.8c-4.1-4.1-9.6-4-9.6-4s-117.2,6.6-177.9,8c-13.3,0.3-26.5,0.6-39.6,0.7c0,39.1,0,78.2,0,117.2 c-5.5-2.6-11.1-5.3-16.6-7.9c0-36.4-0.1-109.2-0.1-109.2c-29,0.4-89.2-2.2-89.2-2.2s-141.4-7.1-156.8-8.5 c-9.8-0.6-22.5-2.1-39,1.5c-8.7,1.8-33.5,7.4-53.8,26.9C-4.9,212.4,6.6,276.2,8,285.8c1.7,11.7,6.9,44.2,31.7,72.5 c45.8,56.1,144.4,54.8,144.4,54.8s12.1,28.9,30.6,55.5c25,33.1,50.7,58.9,75.7,62c63,0,188.9-0.1,188.9-0.1s12,0.1,28.3-10.3 c14-8.5,26.5-23.4,26.5-23.4s12.9-13.8,30.9-45.3c5.5-9.7,10.1-19.1,14.1-28c0,0,55.2-117.1,55.2-231.1 C633.2,157.9,624.7,151.8,622.7,149.8z M125.6,353.9c-25.9-8.5-36.9-18.7-36.9-18.7S69.6,321.8,60,295.4 c-16.5-44.2-1.4-71.2-1.4-71.2s8.4-22.5,38.5-30c13.8-3.7,31-3.1,31-3.1s7.1,59.4,15.7,94.2c7.2,29.2,24.8,77.7,24.8,77.7 S142.5,359.9,125.6,353.9z M425.9,461.5c0,0-6.1,14.5-19.6,15.4c-5.8,0.4-10.3-1.2-10.3-1.2s-0.3-0.1-5.3-2.1l-112.9-55 c0,0-10.9-5.7-12.8-15.6c-2.2-8.1,2.7-18.1,2.7-18.1L322,273c0,0,4.8-9.7,12.2-13c0.6-0.3,2.3-1,4.5-1.5c8.1-2.1,18,2.8,18,2.8 l110.7,53.7c0,0,12.6,5.7,15.3,16.2c1.9,7.4-0.5,14-1.8,17.2C474.6,363.8,425.9,461.5,425.9,461.5z"/>
<path style="fill:#609926" d="M326.8,380.1c-8.2,0.1-15.4,5.8-17.3,13.8c-1.9,8,2,16.3,9.1,20c7.7,4,17.5,1.8,22.7-5.4 c5.1-7.1,4.3-16.9-1.8-23.1l24-49.1c1.5,0.1,3.7,0.2,6.2-0.5c4.1-0.9,7.1-3.6,7.1-3.6c4.2,1.8,8.6,3.8,13.2,6.1 c4.8,2.4,9.3,4.9,13.4,7.3c0.9,0.5,1.8,1.1,2.8,1.9c1.6,1.3,3.4,3.1,4.7,5.5c1.9,5.5-1.9,14.9-1.9,14.9 c-2.3,7.6-18.4,40.6-18.4,40.6c-8.1-0.2-15.3,5-17.7,12.5c-2.6,8.1,1.1,17.3,8.9,21.3c7.8,4,17.4,1.7,22.5-5.3 c5-6.8,4.6-16.3-1.1-22.6c1.9-3.7,3.7-7.4,5.6-11.3c5-10.4,13.5-30.4,13.5-30.4c0.9-1.7,5.7-10.3,2.7-21.3 c-2.5-11.4-12.6-16.7-12.6-16.7c-12.2-7.9-29.2-15.2-29.2-15.2s0-4.1-1.1-7.1c-1.1-3.1-2.8-5.1-3.9-6.3c4.7-9.7,9.4-19.3,14.1-29 c-4.1-2-8.1-4-12.2-6.1c-4.8,9.8-9.7,19.7-14.5,29.5c-6.7-0.1-12.9,3.5-16.1,9.4c-3.4,6.3-2.7,14.1,1.9,19.8 C343.2,346.5,335,363.3,326.8,380.1z"/>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.5 KiB

3
src/icons/brands/github.svg
Unescape View File

@ -0,0 +1,3 @@
<svg width="1024" height="1024" viewBox="0 0 1024 1024" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M8 0C3.58 0 0 3.58 0 8C0 11.54 2.29 14.53 5.47 15.59C5.87 15.66 6.02 15.42 6.02 15.21C6.02 15.02 6.01 14.39 6.01 13.72C4 14.09 3.48 13.23 3.32 12.78C3.23 12.55 2.84 11.84 2.5 11.65C2.22 11.5 1.82 11.13 2.49 11.12C3.12 11.11 3.57 11.7 3.72 11.94C4.44 13.15 5.59 12.81 6.05 12.6C6.12 12.08 6.33 11.73 6.56 11.53C4.78 11.33 2.92 10.64 2.92 7.58C2.92 6.71 3.23 5.99 3.74 5.43C3.66 5.23 3.38 4.41 3.82 3.31C3.82 3.31 4.49 3.1 6.02 4.13C6.66 3.95 7.34 3.86 8.02 3.86C8.7 3.86 9.38 3.95 10.02 4.13C11.55 3.09 12.22 3.31 12.22 3.31C12.66 4.41 12.38 5.23 12.3 5.43C12.81 5.99 13.12 6.7 13.12 7.58C13.12 10.65 11.25 11.33 9.47 11.53C9.76 11.78 10.01 12.26 10.01 13.01C10.01 14.08 10 14.94 10 15.21C10 15.42 10.15 15.67 10.55 15.59C13.71 14.53 16 11.53 16 8C16 3.58 12.42 0 8 0Z" transform="scale(64)" fill="#1B1F23"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 967 B

5
webpack.mix.js
Unescape View File

@ -31,7 +31,10 @@ mix.webpackConfig({
} }
]}, ]},
plugins: [ plugins: [
new SvgSpritemapPlugin('node_modules/@tiny-components/plain-ui/src/icons/mono-icons/svg/*.svg', { new SvgSpritemapPlugin([
'node_modules/@tiny-components/plain-ui/src/icons/mono-icons/svg/*.svg',
'src/icons/brands/*.svg'
], {
output: { output: {
filename: 'symbol-defs.svg', filename: 'symbol-defs.svg',
chunk: { chunk: {

Write Preview
Loading…
Cancel
Save