Ohm-Management - Projektarbeit B-ME
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

themeable.js 3.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. var _extends = Object.assign || 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; };
  6. exports.functionalThemeClasses = functionalThemeClasses;
  7. var _vue = require('vue');
  8. var _vue2 = _interopRequireDefault(_vue);
  9. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  10. function functionalThemeClasses(context) {
  11. var vm = _extends({}, context.props, context.injections);
  12. var isDark = Themeable.options.computed.isDark.call(vm);
  13. return Themeable.options.computed.themeClasses.call({ isDark: isDark });
  14. }
  15. /* @vue/component */
  16. var Themeable = _vue2.default.extend().extend({
  17. name: 'themeable',
  18. provide: function provide() {
  19. return {
  20. theme: this.themeableProvide
  21. };
  22. },
  23. inject: {
  24. theme: {
  25. default: {
  26. isDark: false
  27. }
  28. }
  29. },
  30. props: {
  31. dark: {
  32. type: Boolean,
  33. default: null
  34. },
  35. light: {
  36. type: Boolean,
  37. default: null
  38. }
  39. },
  40. data: function data() {
  41. return {
  42. themeableProvide: {
  43. isDark: false
  44. }
  45. };
  46. },
  47. computed: {
  48. isDark: function isDark() {
  49. if (this.dark === true) {
  50. // explicitly dark
  51. return true;
  52. } else if (this.light === true) {
  53. // explicitly light
  54. return false;
  55. } else {
  56. // inherit from parent, or default false if there is none
  57. return this.theme.isDark;
  58. }
  59. },
  60. themeClasses: function themeClasses() {
  61. return {
  62. 'theme--dark': this.isDark,
  63. 'theme--light': !this.isDark
  64. };
  65. },
  66. /** Used by menus and dialogs, inherits from v-app instead of the parent */
  67. rootIsDark: function rootIsDark() {
  68. if (this.dark === true) {
  69. // explicitly dark
  70. return true;
  71. } else if (this.light === true) {
  72. // explicitly light
  73. return false;
  74. } else {
  75. // inherit from v-app
  76. return this.$vuetify.dark;
  77. }
  78. },
  79. rootThemeClasses: function rootThemeClasses() {
  80. return {
  81. 'theme--dark': this.rootIsDark,
  82. 'theme--light': !this.rootIsDark
  83. };
  84. }
  85. },
  86. watch: {
  87. isDark: {
  88. handler: function handler(newVal, oldVal) {
  89. if (newVal !== oldVal) {
  90. this.themeableProvide.isDark = this.isDark;
  91. }
  92. },
  93. immediate: true
  94. }
  95. }
  96. });
  97. exports.default = Themeable;
  98. //# sourceMappingURL=themeable.js.map