procode-vs-theme 1.0.0

package/dist/index.js

@@ -0,0 +1,279 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+// VS Theme Variables Export
+// Provides access to all theme variables and base styles
+// Base variables and mixins
+const colors$1 = './base/_color.scss';
+const fonts$1 = './base/_font.scss';
+const spacing$2 = './base/_space.scss';
+const borders$2 = './base/_border.scss';
+const sizes$1 = './base/_size.scss';
+// Mixins
+const mediaQueryMixins$1 = './base/mixins/_media-query-mx.scss';
+const fontSizeMixins$1 = './base/mixins/_font_size-mx.scss';
+const applyThemeMixins$1 = './base/mixins/_apply-theme.scss';
+// All base variables combined
+const allVariables = [
+    colors$1,
+    fonts$1,
+    spacing$2,
+    borders$2,
+    sizes$1,
+    mediaQueryMixins$1,
+    fontSizeMixins$1,
+    applyThemeMixins$1
+];
+var variables = {
+    colors: colors$1,
+    fonts: fonts$1,
+    spacing: spacing$2,
+    borders: borders$2,
+    sizes: sizes$1,
+    mixins: {
+        mediaQuery: mediaQueryMixins$1,
+        fontSize: fontSizeMixins$1,
+        applyTheme: applyThemeMixins$1
+    },
+    all: allVariables
+};
+
+var variables$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  allVariables: allVariables,
+  applyThemeMixins: applyThemeMixins$1,
+  borders: borders$2,
+  colors: colors$1,
+  default: variables,
+  fontSizeMixins: fontSizeMixins$1,
+  fonts: fonts$1,
+  mediaQueryMixins: mediaQueryMixins$1,
+  sizes: sizes$1,
+  spacing: spacing$2
+});
+
+// VS Theme Base Export
+// Provides access to all base variables and mixins
+const colors = './base/_color.scss';
+const fonts = './base/_font.scss';
+const spacing$1 = './base/_space.scss';
+const borders$1 = './base/_border.scss';
+const sizes = './base/_size.scss';
+// Mixins
+const mediaQueryMixins = './base/mixins/_media-query-mx.scss';
+const fontSizeMixins = './base/mixins/_font_size-mx.scss';
+const applyThemeMixins = './base/mixins/_apply-theme.scss';
+// All base styles combined
+const allBase = [
+    colors,
+    fonts,
+    spacing$1,
+    borders$1,
+    sizes,
+    mediaQueryMixins,
+    fontSizeMixins,
+    applyThemeMixins
+];
+var baseExports = {
+    colors,
+    fonts,
+    spacing: spacing$1,
+    borders: borders$1,
+    sizes,
+    mixins: {
+        mediaQuery: mediaQueryMixins,
+        fontSize: fontSizeMixins,
+        applyTheme: applyThemeMixins
+    },
+    all: allBase
+};
+
+var baseExports$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  allBase: allBase,
+  applyThemeMixins: applyThemeMixins,
+  borders: borders$1,
+  colors: colors,
+  default: baseExports,
+  fontSizeMixins: fontSizeMixins,
+  fonts: fonts,
+  mediaQueryMixins: mediaQueryMixins,
+  sizes: sizes,
+  spacing: spacing$1
+});
+
+// VS Theme Components Export
+// Provides access to all component styles
+const buttons = './components/_buttons.scss';
+const input = './components/_input.scss';
+const cards = './components/_cards.scss';
+// All components combined
+const allComponents = [
+    buttons,
+    input,
+    cards
+];
+var components = {
+    buttons,
+    input,
+    cards,
+    all: allComponents
+};
+
+var components$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  allComponents: allComponents,
+  buttons: buttons,
+  cards: cards,
+  default: components,
+  input: input
+});
+
+// VS Theme Layout Export  
+// Provides access to all layout styles
+const drawer = './layout/_drawer.scss';
+const header = './layout/_header.scss';
+const footer = './layout/_footer.scss';
+const sidebar = './layout/_sidebar.scss';
+// All layout components combined
+const allLayout = [
+    drawer,
+    header,
+    footer,
+    sidebar
+];
+var layout = {
+    drawer,
+    header,
+    footer,
+    sidebar,
+    all: allLayout
+};
+
+var layout$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  allLayout: allLayout,
+  default: layout,
+  drawer: drawer,
+  footer: footer,
+  header: header,
+  sidebar: sidebar
+});
+
+// VS Theme Utilities Export
+// Provides access to all utility styles
+// Reset and base utilities
+const reset = './utilities/_reset.scss';
+// Typography utilities
+const typographyFont = './utilities/typography/_font.scss';
+const typographyColor = './utilities/typography/_color.scss';
+const typography = [typographyFont, typographyColor];
+// Background utilities
+const backgroundColor = './utilities/background-color/index.scss';
+// Border utilities  
+const borderColor = './utilities/border/_border-color.scss';
+const borderRadius = './utilities/border/_border-radius.scss';
+const borderSize = './utilities/border/_border-size.scss';
+const borders = [borderColor, borderRadius, borderSize];
+// Spacing utilities
+const gap = './utilities/spaces/_gap.scss';
+const margin = './utilities/spaces/_margin.scss';
+const padding = './utilities/spaces/_padding.scss';
+const spacing = [gap, margin, padding];
+// Box shadow utilities
+const boxShadow = './utilities/box-shadow/index.scss';
+// Size utilities
+const size = './utilities/size/index.scss';
+// All utilities combined
+const allUtilities = [
+    reset,
+    ...typography,
+    backgroundColor,
+    ...borders,
+    ...spacing,
+    boxShadow,
+    size
+];
+var utilities = {
+    reset,
+    typography: {
+        font: typographyFont,
+        color: typographyColor,
+        all: typography
+    },
+    backgroundColor,
+    borders: {
+        color: borderColor,
+        radius: borderRadius,
+        size: borderSize,
+        all: borders
+    },
+    spacing: {
+        gap,
+        margin,
+        padding,
+        all: spacing
+    },
+    boxShadow,
+    size,
+    all: allUtilities
+};
+
+var utilities$1 = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  allUtilities: allUtilities,
+  backgroundColor: backgroundColor,
+  borderColor: borderColor,
+  borderRadius: borderRadius,
+  borderSize: borderSize,
+  borders: borders,
+  boxShadow: boxShadow,
+  default: utilities,
+  gap: gap,
+  margin: margin,
+  padding: padding,
+  reset: reset,
+  size: size,
+  spacing: spacing,
+  typography: typography,
+  typographyColor: typographyColor,
+  typographyFont: typographyFont
+});
+
+// VS Theme - Main Entry Point
+// Provides comprehensive access to all theme components
+// Main theme SCSS entry point
+const themeStylesheet = './index.scss';
+// Default export - Main theme configuration
+var index = {
+    name: 'vs-theme',
+    version: '1.0.0',
+    stylesheet: './index.scss',
+    variables: './variables',
+    components: './components',
+    layout: './layout',
+    utilities: './utilities'
+};
+// Theme utility functions
+const getThemeStylesheet = () => themeStylesheet;
+const getThemeConfig = () => ({
+    name: 'vs-theme',
+    version: '1.0.0',
+    stylesheet: './index.scss',
+    variables: './variables',
+    components: './components',
+    layout: './layout',
+    utilities: './utilities'
+});
+
+exports.base = baseExports$1;
+exports.components = components$1;
+exports.default = index;
+exports.getThemeConfig = getThemeConfig;
+exports.getThemeStylesheet = getThemeStylesheet;
+exports.layout = layout$1;
+exports.themeStylesheet = themeStylesheet;
+exports.utilities = utilities$1;
+exports.variables = variables$1;
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/layout.esm.js

@@ -0,0 +1,23 @@
+// VS Theme Layout Export  
+// Provides access to all layout styles
+const drawer = './layout/_drawer.scss';
+const header = './layout/_header.scss';
+const footer = './layout/_footer.scss';
+const sidebar = './layout/_sidebar.scss';
+// All layout components combined
+const allLayout = [
+    drawer,
+    header,
+    footer,
+    sidebar
+];
+var layout = {
+    drawer,
+    header,
+    footer,
+    sidebar,
+    all: allLayout
+};
+
+export { allLayout, layout as default, drawer, footer, header, sidebar };
+//# sourceMappingURL=layout.esm.js.map

package/dist/layout.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.esm.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/layout.js

@@ -0,0 +1,32 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+// VS Theme Layout Export  
+// Provides access to all layout styles
+const drawer = './layout/_drawer.scss';
+const header = './layout/_header.scss';
+const footer = './layout/_footer.scss';
+const sidebar = './layout/_sidebar.scss';
+// All layout components combined
+const allLayout = [
+    drawer,
+    header,
+    footer,
+    sidebar
+];
+var layout = {
+    drawer,
+    header,
+    footer,
+    sidebar,
+    all: allLayout
+};
+
+exports.allLayout = allLayout;
+exports.default = layout;
+exports.drawer = drawer;
+exports.footer = footer;
+exports.header = header;
+exports.sidebar = sidebar;
+//# sourceMappingURL=layout.js.map

package/dist/layout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/src/_apply-theme.scss

@@ -0,0 +1,28 @@
+// /abstracts/_mixins.scss
+
+@mixin apply-theme($name) {
+  $theme: tf.get-theme($name);
+
+  background-color: mdg.map-deep-get($theme, "colors", "background", "main");
+  color: mdg.map-deep-get($theme, "colors", "text", "primary");
+
+  font-family: mdg.map-deep-get($theme, "typography", "font-family", "primary");
+  font-size: mdg.map-deep-get($theme, "typography", "font-size", "md");
+  line-height: mdg.map-deep-get($theme, "typography", "line-height", "normal");
+
+  .btn {
+    background-color: mdg.map-deep-get($theme, "colors", "primary");
+    color: mdg.map-deep-get($theme, "colors", "text", "primary");
+    padding: mdg.map-deep-get($theme, "spacing", "sm");
+    border-radius: mdg.map-deep-get($theme, "border-radius", "md");
+    transition: all mdg.map-deep-get($theme, "transitions", "speed", "normal")
+      mdg.map-deep-get($theme, "transitions", "easing", "ease-in-out");
+  }
+
+  .card {
+    background-color: mdg.map-deep-get($theme, "colors", "background", "paper");
+    box-shadow: 0 2px 8px mdg.map-deep-get($theme, "colors", "shadow");
+    padding: mdg.map-deep-get($theme, "spacing", "md");
+    border-radius: mdg.map-deep-get($theme, "border-radius", "lg");
+  }
+}

package/dist/src/_border-color.scss

@@ -0,0 +1,33 @@
+@use "../../base/color" as cl;
+
+.qo-border-primary {
+  border-color: cl.$border-primary;
+}
+
+.qo-border-secondary {
+  border-color: cl.$border-secondary;
+}
+
+.qo-border-success {
+  border-color: cl.$border-success;
+}
+
+.qo-border-warning {
+  border-color: cl.$border-warning;
+}
+
+.qo-border-danger {
+  border-color: cl.$border-danger;
+}
+
+.qo-border-info {
+  border-color: cl.$border-info;
+}
+
+.qo-border-light {
+  border-color: cl.$border-light;
+}
+
+.qo-border-dark {
+  border-color: cl.$border-dark;
+}

package/dist/src/_border-radius.scss

@@ -0,0 +1,17 @@
+@use "../../base/border" as bo;
+
+.qo-border-radius-sm {
+  border-radius: bo.$border-radius-sm;
+}
+
+.qo-border-radius-md {
+  border-radius: bo.$border-radius-md;
+}
+
+.qo-border-radius-lg {
+  border-radius: bo.$border-radius-lg;
+}
+
+.qo-border-radius-full {
+  border-radius: bo.$border-radius-full;
+}

package/dist/src/_border-size.scss

@@ -0,0 +1,10 @@
+@use "../../base/border" as bo;
+.qo-border-sm {
+  border-width: bo.$border-width-sm;
+}
+.qo-border-md {
+  border-width: bo.$border-width-md;
+}
+.qo-border-lg {
+  border-width: bo.$border-width-lg;
+}

package/dist/src/_border.scss

@@ -0,0 +1,8 @@
+$border-radius-sm: 2px !default;
+$border-radius-md: 4px !default;
+$border-radius-lg: 16px !default;
+$border-radius-full: 50% !default;
+
+$border-width-sm: 1px !default;
+$border-width-md: 2px !default;
+$border-width-lg: 4px !default;

package/dist/src/_buttons.scss

@@ -0,0 +1,38 @@
+@use "../base/mixins/font_size-mx" as mx;
+@use "../base/font" as ft;
+@use "../base/color" as cl;
+@use "../base/border" as bo;
+
+$btn-padding-xs: 5.5px !default;
+$btn-padding-md: 8px !default;
+$btn-padding-xl: 16px !default;
+
+.qo-btn {
+  display: inline-block;
+  border-radius: bo.$border-radius-sm;
+}
+.qo-btn-full {
+  display: block;
+  border-radius: bo.$border-radius-sm;
+  width: 100%;
+  padding: $btn-padding-xl;
+  @include mx.font-size(ft.$font-size-md, ft.$line-height-md);
+}
+.qo-btn-xs {
+  padding: $btn-padding-xs;
+  @include mx.font-size(ft.$font-size-xs, ft.$line-height-xs);
+}
+.qo-btn-md {
+  padding: $btn-padding-md;
+  @include mx.font-size(ft.$font-size-md, ft.$line-height-md);
+}
+.qo-btn-primary {
+  background-color: cl.$background-primary !important;
+  border: bo.$border-width-sm solid cl.$border-primary;
+  color: cl.$text-light !important;
+}
+.qo-btn-default {
+  background-color: cl.$background-default;
+  border: bo.$border-width-sm solid cl.$border-default;
+  color: cl.$text-dark !important;
+}

package/dist/src/_color.scss

@@ -0,0 +1,35 @@
+@use "../../base/color" as cl;
+.qo-text-primary {
+  color: cl.$text-primary;
+}
+.qo-text-secondary {
+  color: cl.$text-secondary;
+}
+.qo-text-success {
+  color: cl.$text-success;
+}
+.qo-text-warning {
+  color: cl.$text-warning;
+}
+.qo-text-danger {
+  color: cl.$text-danger;
+}
+.qo-text-info {
+  color: cl.$text-info;
+}
+.qo-text-default {
+  color: cl.$text-default;
+}
+.qo-text-dark {
+  color: cl.$text-dark;
+}
+.qo-text-light {
+  color: cl.$text-light !important;
+}
+.qo-text-tertiary {
+  color: cl.$text-tertiary;
+}
+
+.qo-validation{
+   color: cl.$text-danger;
+}

package/dist/src/_drawer.scss

@@ -0,0 +1,16 @@
+@use "../base/color" as cl;
+
+.qo-drawer-shield {
+  background-color: cl.$background-transparent;
+  width: 100%;
+  height: 100vh;
+}
+
+.qo-drawer {
+  background-color: cl.$background-default;
+}
+
+.qo-drawer-md {
+  width: 43.53%;
+  height: 100%;
+}

package/dist/src/_font.scss

@@ -0,0 +1,63 @@
+@use "../../base/font" as ft;
+@use "../../base/mixins/font_size-mx" as mx;
+@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,100..700;1,100..700&display=swap");
+
+.qo-font-family-primary {
+  font-family: ft.$font-family-primary;
+}
+
+.qo-font-family-secondary {
+  font-family: ft.$font-family-secondary;
+}
+
+.qo-font-xxs {
+  @include mx.font-size(ft.$font-size-xxs, ft.$line-height-xxs);
+}
+.qo-font-xs {
+  @include mx.font-size(ft.$font-size-xs, ft.$line-height-xs);
+}
+.qo-font-sm {
+  @include mx.font-size(ft.$font-size-sm, ft.$line-height-sm);
+}
+.qo-font-md {
+  @include mx.font-size(ft.$font-size-md, ft.$line-height-md);
+}
+.qo-font-lg {
+  @include mx.font-size(ft.$font-size-lg, ft.$line-height-lg);
+}
+.qo-font-xl {
+  @include mx.font-size(ft.$font-size-xl, ft.$line-height-xl);
+}
+.qo-font-xxl {
+  @include mx.font-size(ft.$font-size-xxl, ft.$line-height-xxl);
+}
+
+.qo-font-weight-light {
+  font-weight: ft.$font-weight-light;
+}
+.qo-font-weight-regular {
+  font-weight: ft.$font-weight-regular;
+}
+.qo-font-weight-medium {
+  font-weight: ft.$font-weight-medium;
+}
+.qo-font-weight-semibold {
+  font-weight: ft.$font-weight-semibold;
+}
+.qo-font-weight-bold {
+  font-weight: ft.$font-weight-bold;
+}
+.qo-font-weight-extrabold {
+  font-weight: ft.$font-weight-extrabold;
+}
+.qo-validation {
+  @include mx.font-size(ft.$font-size-md, ft.$line-height-md);
+  font-weight: ft.$font-weight-light;
+  margin-top: 2px;
+}
+
+h4 {
+  @include mx.font-size(ft.$font-size-md, ft.$line-height-md);
+  font-family: ft.$font-family-primary;
+  font-weight: ft.$font-weight-medium;
+}

package/dist/src/_font_size-mx.scss

@@ -0,0 +1,4 @@
+@mixin font-size($size, $lineheight) {
+  font-size: $size;
+  line-height: $lineheight;
+}

package/dist/src/_gap.scss

@@ -0,0 +1,20 @@
+@use "../../base/space" as sp;
+
+.qo-gap-sm {
+  gap: sp.$space-sm;
+}
+.qo-gap-md {
+  gap: sp.$space-md;
+}
+.qo-gap-md-y {
+  gap: sp.$space-md 0;
+}
+.qo-gap-md-x {
+  gap: 0 sp.$space-md;
+}
+.qo-gap-lg {
+  gap: sp.$space-lg;
+}
+.qo-gap-xl {
+  gap: sp.$space-xl;
+}

package/dist/src/_input.scss

@@ -0,0 +1,32 @@
+@use "../base/mixins/font_size-mx" as mx;
+@use "../base/font" as ft;
+@use "../base/color" as cl;
+@use "../base/border" as bo;
+
+$input-padding-xs: 5.5px !default;
+$input-padding-md: 8px !default;
+$input-padding-xl: 16px !default;
+
+.qo-input {
+  display: inline-block;
+  border-radius: bo.$border-radius-sm;
+}
+.qo-input-full {
+  display: block;
+  border-radius: bo.$border-radius-sm;
+  width: 100%;
+  padding: $input-padding-xl;
+  @include mx.font-size(ft.$font-size-md, ft.$line-height-md);
+}
+.qo-input-xs {
+  padding: $input-padding-xs;
+  @include mx.font-size(ft.$font-size-xs, ft.$line-height-xs);
+}
+.qo-input-md {
+  padding: $input-padding-md;
+  @include mx.font-size(ft.$font-size-md, ft.$line-height-md);
+}
+.qo-input-default {
+  background-color: cl.$background-default;
+  border: bo.$border-width-sm solid cl.$border-default;
+}