[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-8986":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":9,"language":10,"languages":9,"totalLinesOfCode":9,"stars":11,"forks":12,"watchers":13,"openIssues":14,"contributorsCount":15,"subscribersCount":15,"size":15,"stars1d":15,"stars7d":15,"stars30d":15,"stars90d":15,"forks30d":15,"starsTrendScore":15,"compositeScore":16,"rankGlobal":9,"rankLanguage":9,"license":17,"archived":18,"fork":18,"defaultBranch":19,"hasWiki":20,"hasPages":20,"topics":21,"createdAt":9,"pushedAt":9,"updatedAt":22,"readmeContent":23,"aiSummary":24,"trendingCount":15,"starSnapshotCount":15,"syncStatus":25,"lastSyncTime":26,"discoverSource":27},8986,"dayspan-vuetify","ClickerMonkey\u002Fdayspan-vuetify","ClickerMonkey","A collection of components that visualizes DaySpan Calendars and Schedules using Vuetify",null,"Vue",1186,247,39,59,0,55.18,"MIT License",false,"master",true,[],"2026-06-12 04:00:42","# dayspan-vuetify\n\n> A collection of components for Schedules and Calendars in DaySpan using Vuetify\n\nThis library strives to offer all the functionality any modern calendar app could support, and more. Not only can this be used for calendar apps, but any application where the user wishes to control when events should occur within a system.\n\n[Click here for a full app example](https:\u002F\u002Fclickermonkey.github.io\u002Fdayspan-vuetify\u002Fexample\u002F)\n\nEvery feature of the library can be toggled with local and global settings, and all text can be localized.\n\n## Status\n\nThis library is nearing functional completion (documentation on every component, prop, event, slot, method will have to wait) but is still subject to the occasional small change in API.\n\n[Current documentation](docs\u002FREADME.md)\n\n### Notice\n\n- This library uses v-html in a few places (to display event details for example) so you must sanitize your own data against XSS vulnerabilities.\n\n## Usage\n\nInstall with `npm install --save dayspan-vuetify`\n\n**This library works best with Vuetify >= 1.1.9**\n\n```javascript\nimport DaySpanVuetify from 'dayspan-vuetify'\n\nVue.use( DaySpanVuetify, {\n  \u002F\u002F options is vue definition, the resulting reactive component is stored in components as this.$dayspan or Vue.$dayspan\n  data: {\n    \u002F\u002F data or computed to override\n  },\n  computed: {\n    \u002F\u002F data or computed to override\n  },\n  methods: {\n    \u002F\u002F methods to override\n  }\n});\n```\n\nTo see what options can be passed to the plugin, [checkout this file](src\u002Fcomponent.js).\n\nOnce done, you can access components like `ds-event`, `ds-calendar`, and `ds-calendar-app` from any component (they are registered globally).\n\n## Example \u002F Template\n\nCheckout [dayspan-vuetify-example](https:\u002F\u002Fgithub.com\u002FClickerMonkey\u002Fdayspan-vuetify-example) for an example of a calendar app which saves events to localStorage.\n\n## Example Code\n\nInstall with `npm install --save dayspan-vuetify`\n\n#### app.js\n```javascript\nimport Vue from 'vue'\nimport Vuetify from 'vuetify'\nimport DaySpanVuetify from 'dayspan-vuetify'\nimport App from '.\u002FApp.vue'\n\nimport 'vuetify\u002Fdist\u002Fvuetify.min.css'\nimport 'material-design-icons-iconfont\u002Fdist\u002Fmaterial-design-icons.css'\nimport 'dayspan-vuetify\u002Fdist\u002Flib\u002Fdayspan-vuetify.min.css'\n\nVue.config.productionTip = false\n\nVue.use(Vuetify);\n\nVue.use(DaySpanVuetify, {\n  methods: {\n    getDefaultEventColor: () => '#1976d2'\n  }\n});\n\nnew Vue({\n  el: '#app',\n  render: h => h(App)\n})\n```\n\n#### App.vue\n```vue\n\u003Ctemplate>\n  \u003Cv-app id=\"dayspan\" v-cloak>\n    \u003Cds-calendar-app :calendar=\"calendar\">\u003C\u002Fds-calendar-app>\n  \u003C\u002Fv-app>\n\u003C\u002Ftemplate>\n\n\u003Cscript>\nimport { Calendar } from 'dayspan';\n\nexport default {\n  name: 'app',\n  data: () => ({\n    calendar: Calendar.months()\n  })\n}\n\u003C\u002Fscript>\n\n\u003Cstyle>\nbody, html, #app, #dayspan {\n  font-family: Roboto, sans-serif;\n  width: 100%;\n  height: 100%;\n}\n\u003C\u002Fstyle>\n```\n\n#### index.html\n```html\n\u003C!DOCTYPE html>\n\u003Chtml>\n  \u003Chead>\n    \u003Clink href='https:\u002F\u002Ffonts.googleapis.com\u002Fcss?family=Roboto:300,400,500,700|Material+Icons' rel=\"stylesheet\">\n    \u003Cmeta charset=\"utf-8\">\n    \u003Cmeta name=\"viewport\" content=\"width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui\">\n    \u003Cmeta http-equiv=\"x-ua-compatible\" content=\"ie=edge\">\n    \u003Ctitle>You Calendar App Title\u003C\u002Ftitle>\n    \u003Cstyle> [v-cloak] { display: none; } \u003C\u002Fstyle>\n  \u003C\u002Fhead>\n  \u003Cbody>\n    \u003Cdiv id=\"app\">\u003C\u002Fdiv>\n    \u003C!-- built files should be auto injected -->\n  \u003C\u002Fbody>\n\u003C\u002Fhtml>\n```\n\n### Locales\n\nThis library supports multiple locales but the build only comes with [en-us\u002Fen](https:\u002F\u002Fgithub.com\u002FClickerMonkey\u002Fdayspan-vuetify\u002Fblob\u002Fmaster\u002Fsrc\u002Flocales\u002Fen.js). The following code shows you how to add locales, changing the current locale, and updating a given locale:\n\n```javascript\n\u002F\u002F You can access $dayspan via Vue.$dayspan or this.$dayspan inside a component.\n\n$dayspan.setLocale('en'); \u002F\u002F if en does not exist, this will have no affect\n$dayspan.setLocale('fr', true); \u002F\u002F true was passed, so if the locale does not exist an error is thrown\n$dayspan.locales; \u002F\u002F map of locale names to locale values\n\n\u002F\u002F A locale is really just an object that overrides the values you specify found in $dayspan. A locale does not need to specify all possible values, just ones that should be overriden when setLocale is called.\n\n$dayspan.addLocale('es', {\n  promptLabels: {\n    \u002F\u002F Are you sure you want to remove this event?\n    actionRemove: '¿Estás seguro de que quieres eliminar este evento?'\n  }\n});\n\n\u002F\u002F Update locale (merge changes into locale)\n$dayspan.updateLocale('en', {\n  patterns: {\n    lastDay: (day) => 'Final day of the month'\n  }\n});\n```\n\n#### French Locale\n\n```javascript\nimport fr from 'dayspan-vuetify\u002Fsrc\u002Flocales\u002Ffr';\nimport Vue from 'vue';\n\u002F\u002F dayspan-vuetify should already be loaded at this point\nVue.$dayspan.addLocales(['fr', 'fr-CA', 'fr-BE', 'fr-CH', 'fr-FR', 'fr-LU', 'fr-MC'], fr);\n```\n\n#### Dutch Locale\n\n```javascript\nimport nl from 'dayspan-vuetify\u002Fsrc\u002Flocales\u002Fnl';\nimport Vue from 'vue';\n\u002F\u002F dayspan-vuetify should already be loaded at this point\nVue.$dayspan.addLocales(['nl', 'nl-NL', 'nl-BE'], nl);\n```\n\n#### German Locale\n\n```javascript\nimport de from 'dayspan-vuetify\u002Fsrc\u002Flocales\u002Fde';\nimport Vue from 'vue';\n\u002F\u002F dayspan-vuetify should already be loaded at this point\nVue.$dayspan.addLocales(['de', 'de-DE', 'de-CH', 'de-AT', 'de-BE', 'de-IT', 'de-LI', 'de-LU'], de);\n```\n\n#### Catalan Locale\n\n```javascript\nimport ca from 'dayspan-vuetify\u002Fsrc\u002Flocales\u002Fca';\nimport Vue from 'vue';\n\u002F\u002F dayspan-vuetify should already be loaded at this point\nVue.$dayspan.addLocales(['ca', 'ca-ES'], ca);\n```\n\n## Build Setup\n\n``` bash\n# install dependencies\nnpm install\n\n# serve with hot reload at localhost:8080\nnpm run dev\n\n# build for production with minification\nnpm run build\n\n# build for production and view the bundle analyzer report\nnpm run build --report\n```\n\nFor detailed explanation on how things work, checkout the [guide](http:\u002F\u002Fvuejs-templates.github.io\u002Fwebpack\u002F) and [docs for vue-loader](http:\u002F\u002Fvuejs.github.io\u002Fvue-loader).\n","dayspan-vuetify 是一个基于 Vuetify 的日历和时间表组件库。它提供了丰富的功能，支持现代日历应用所需的全部特性，并且可以灵活地应用于任何需要用户控制事件发生时间的场景中。该库的核心技术特点是高度可配置性，包括全局与局部设置切换、文本本地化等。同时，它允许通过 v-html 展示事件详情，但需要注意数据需自行处理以防止XSS攻击。适用于使用 Vue 和 Vuetify 框架开发的应用程序，特别是那些需要复杂日程管理功能的项目。",2,"2026-06-11 03:20:40","top_language"]