@updevs/components 1.0.0-alpha.1 → 1.0.0-alpha.11

package/README.md

@@ -1,24 +1,8 @@
-# Components
+# UpDevs Components Library for Angular
 
-This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 15.1.0.
+After updating tabler
+Replace all "tblr" to "upd"
 
-## Code scaffolding
+LOCAL: "@updevs/icons": "file:../icons", "@updevs/sdk": "file:../sdk",
 
-Run `ng generate component component-name --project components` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module --project components`.
-> Note: Don't forget to add `--project components` or else it will be added to the default project in your `angular.json` file. 
-
-## Build
-
-Run `ng build components` to build the project. The build artifacts will be stored in the `dist/` directory.
-
-## Publishing
-
-After building your library with `ng build components`, go to the dist folder `cd dist/components` and run `npm publish`.
-
-## Running unit tests
-
-Run `ng test components` to execute the unit tests via [Karma](https://karma-runner.github.io).
-
-## Further help
-
-To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
+PUBLISHED: "@updevs/icons": "^1.0.4", "@updevs/sdk": "^1.0.0-alpha.15",

package/assets/styles/_bootstrap-components.scss

@@ -0,0 +1,55 @@
+// Layout & components
+@import "bootstrap/scss/root";
+@import "bootstrap/scss/reboot";
+@import "bootstrap/scss/type";
+@import "bootstrap/scss/images";
+@import "bootstrap/scss/containers";
+@import "bootstrap/scss/grid";
+@import "bootstrap/scss/tables";
+@import "bootstrap/scss/forms";
+@import "bootstrap/scss/buttons";
+@import "bootstrap/scss/transitions";
+@import "bootstrap/scss/dropdown";
+@import "bootstrap/scss/button-group";
+@import "bootstrap/scss/nav";
+@import "bootstrap/scss/navbar";
+@import "bootstrap/scss/card";
+@import "bootstrap/scss/accordion";
+@import "bootstrap/scss/breadcrumb";
+@import "bootstrap/scss/pagination";
+@import "bootstrap/scss/badge";
+@import "bootstrap/scss/alert";
+@import "bootstrap/scss/progress";
+@import "bootstrap/scss/list-group";
+@import "bootstrap/scss/close";
+@import "bootstrap/scss/toasts";
+@import "bootstrap/scss/modal";
+@import "bootstrap/scss/tooltip";
+@import "bootstrap/scss/popover";
+@import "bootstrap/scss/carousel";
+@import "bootstrap/scss/spinners";
+@import "bootstrap/scss/offcanvas";
+@import "bootstrap/scss/placeholders";
+
+// Helpers
+@import "bootstrap/scss/helpers";
+@import "bootstrap/scss/utilities";
+
+// extend `text-align` utility
+$utilities: map-merge(
+        $utilities,
+        (
+            "text-align": map-merge(
+                    map-get($utilities, "text-align"),
+                    (
+                        values: map-merge(
+                                map-get(map-get($utilities, "text-align"), "values"),
+                                (justify: justify),
+                        ),
+                    ),
+            ),
+        )
+);
+
+// include utilities API last to generate classes based on the Sass map in `_utilities.scss`
+@import "bootstrap/scss/utilities/api";

package/assets/styles/_bootstrap-config.scss

@@ -0,0 +1,7 @@
+// Config
+@import "bootstrap/scss/functions";
+@import "bootstrap/scss/variables";
+@import "bootstrap/scss/variables-dark";
+@import "bootstrap/scss/maps";
+@import "bootstrap/scss/mixins";
+@import "bootstrap/scss/utilities";

package/assets/styles/_bootstrap-override.scss

@@ -0,0 +1,78 @@
+@mixin caret($direction: down) {
+    $selector: "after";
+
+    @if $direction == "left" {
+        $selector: "before";
+    }
+
+    &:#{$selector} {
+        content: "";
+        display: inline-block;
+        vertical-align: $caret-vertical-align;
+        width: $caret-width;
+        height: $caret-width;
+        border-bottom: 1px var(--#{$prefix}border-style);
+        border-left: 1px var(--#{$prefix}border-style);
+        margin-right: 0.1em;
+
+        @if $direction != "left" {
+            margin-left: $caret-spacing;
+        } @else {
+            margin-right: $caret-spacing;
+        }
+
+        @if $direction == down {
+            transform: rotate(-45deg);
+        } @else if $direction == up {
+            transform: rotate(135deg);
+        } @else if $direction == end {
+            transform: rotate(-135deg);
+        } @else {
+            transform: rotate(45deg);
+        }
+    }
+
+    @if $direction == "left" {
+        &:after {
+            content: none;
+        }
+    }
+}
+
+@mixin alert-variant($background: null, $border: null, $color: null) {
+    // Override bootstrap core
+}
+
+@mixin button-variant(
+    $background: null,
+    $border: null,
+    $color: null,
+    $hover-background: null,
+    $hover-border: null,
+    $hover-color: null,
+    $active-background: null,
+    $active-border: null,
+    $active-color: null,
+    $disabled-background: null,
+    $disabled-border: null,
+    $disabled-color: null
+) {
+    // Override bootstrap core
+}
+
+@mixin button-outline-variant(
+    $color: null,
+    $color-hover: null,
+    $active-background: null,
+    $active-border: null,
+    $active-color: null
+) {
+    // Override bootstrap core
+}
+
+//
+// TODO: remove when https://github.com/twbs/bootstrap/pull/37425/ will be released
+//
+@function opaque($background, $foreground) {
+    @return mix(rgba($foreground, 1), $background, opacity($foreground) * 100%);
+}

package/assets/styles/_config.scss

@@ -0,0 +1,9 @@
+@import "bootstrap/scss/functions";
+
+@import "variables";
+@import "variables-dark";
+@import "utilities";
+@import "mixins";
+
+@import "bootstrap-config";
+@import "bootstrap-override";

package/assets/styles/_core.scss

@@ -0,0 +1,71 @@
+@import "config";
+@import "bootstrap-components";
+
+@import "fonts/webfonts";
+
+@import "layout/root";
+@import "layout/animations";
+@import "layout/core";
+@import "layout/navbar";
+@import "layout/page";
+@import "layout/footer";
+@import "layout/dark";
+
+@import "ui/accordion";
+@import "ui/alerts";
+@import "ui/avatars";
+@import "ui/badges";
+@import "ui/breadcrumbs";
+@import "ui/buttons";
+@import "ui/button-group";
+@import "ui/calendars";
+@import "ui/carousel";
+@import "ui/cards";
+@import "ui/close";
+@import "ui/dropdowns";
+@import "ui/datagrid";
+@import "ui/empty";
+@import "ui/grid";
+@import "ui/icons";
+@import "ui/images";
+@import "ui/forms";
+@import "ui/forms/form-icon";
+@import "ui/forms/form-colorinput";
+@import "ui/forms/form-imagecheck";
+@import "ui/forms/form-selectgroup";
+@import "ui/forms/form-custom";
+@import "ui/forms/form-check";
+@import "ui/forms/validation";
+@import "ui/legend";
+@import "ui/lists";
+@import "ui/loaders";
+@import "ui/login";
+@import "ui/modals";
+@import "ui/nav";
+@import "ui/stars";
+@import "ui/pagination";
+@import "ui/popovers";
+@import "ui/progress";
+@import "ui/ribbons";
+@import "ui/markdown";
+@import "ui/placeholder";
+@import "ui/steps";
+@import "ui/status";
+@import "ui/switch-icon";
+@import "ui/tables";
+@import "ui/tags";
+@import "ui/toasts";
+@import "ui/toolbar";
+@import "ui/tracking";
+@import "ui/timeline";
+@import "ui/type";
+@import "ui/charts";
+@import "ui/offcanvas";
+
+@import "utils/background";
+@import "utils/colors";
+@import "utils/scroll";
+@import "utils/sizing";
+@import "utils/opacity";
+@import "utils/shadow";
+@import "utils/text";

package/assets/styles/_mixins.scss

@@ -0,0 +1,2 @@
+@import "mixins/mixins";
+@import "mixins/functions";

package/assets/styles/_seven-columns.scss

@@ -0,0 +1,73 @@
+@media (min-width: 768px) {
+    .seven-cols .col-1 {
+        width: 100%;
+    }
+
+    .seven-cols .col-6 {
+        width: 85.7142857143%;
+    }
+}
+
+@media (min-width: 992px) {
+    .seven-cols .col-1 {
+        width: 14.285714285714285714285714285714%;
+    }
+
+    .seven-cols .col-2 {
+        width: 28.5714285714%;
+    }
+
+    .seven-cols .col-3 {
+        width: 42.8571428571%;
+    }
+
+    .seven-cols .col-4 {
+        width: 57.1428571429%;
+    }
+
+    .seven-cols .col-5 {
+        width: 71.4285714286%;
+    }
+
+    .seven-cols .col-6 {
+        width: 85.7142857143%;
+    }
+
+    .seven-cols .col-7 {
+        width: 100%;
+    }
+}
+
+/**
+ *  The following is not really needed in this case
+ *  Only to demonstrate the usage of @media for large screens
+ */
+@media (min-width: 1200px) {
+    .seven-cols .col-1 {
+        width: 14.285714285714285714285714285714%;
+    }
+
+    .seven-cols .col-2 {
+        width: 28.5714285714%;
+    }
+
+    .seven-cols .col-3 {
+        width: 42.8571428571%;
+    }
+
+    .seven-cols .col-4 {
+        width: 57.1428571429%;
+    }
+
+    .seven-cols .col-5 {
+        width: 71.4285714286%;
+    }
+
+    .seven-cols .col-6 {
+        width: 85.7142857143%;
+    }
+
+    .seven-cols .col-7 {
+        width: 100%;
+    }
+}

package/assets/styles/_updevs.scss

@@ -0,0 +1,13 @@
+@import "core";
+
+.upd-brand-logo {
+    content: var(--upd-brand-logo-src);
+}
+
+.upd-right-login-image {
+    content: var(--upd-right-login-image-src);
+}
+
+.upd-right-login-cover-image {
+    background-image: var(--upd-right-login-cover-image-bg);
+}

package/assets/styles/_utilities.scss

@@ -0,0 +1,98 @@
+$border-values: (
+    null: var(--#{$prefix}border-width) var(--#{$prefix}border-style) $border-color-translucent,
+    wide: $border-width-wide var(--#{$prefix}border-style) $border-color-translucent,
+    0: 0,
+);
+
+//Utilities
+$utilities: (
+    "object": (
+        property: object-fit,
+        class: object,
+        values: (
+            contain: contain,
+            cover: cover,
+            fill: fill,
+            scale-down: scale-down,
+            none: none,
+        ),
+    ),
+    "spacing": (
+        property: letter-spacing,
+        class: tracking,
+        values: (
+            tight: -0.05em,
+            normal: 0,
+            wide: 0.05em,
+        ),
+    ),
+    "cursor": (
+        property: cursor,
+        class: cursor,
+        values: (
+            auto: auto,
+            pointer: pointer,
+            move: move,
+            not-allowed: not-allowed,
+            zoom-in: zoom-in,
+            zoom-out: zoom-out,
+            default: default,
+            none: none,
+            help: help,
+            progress: progress,
+            wait: wait,
+            text: text,
+            v-text: vertical-text,
+            grab: grab,
+            grabbing: grabbing,
+        ),
+    ),
+    "border": (
+        property: border,
+        values: $border-values,
+    ),
+    "border-top": (
+        property: border-top,
+        values: $border-values,
+    ),
+    "border-end": (
+        class: border-end,
+        property: border-right,
+        values: $border-values,
+    ),
+    "border-bottom": (
+        property: border-bottom,
+        values: $border-values,
+    ),
+    "border-start": (
+        class: border-start,
+        property: border-left,
+        values: $border-values,
+    ),
+    "border-x": (
+        class: border-x,
+        property: border-left border-right,
+        values: $border-values,
+    ),
+    "border-y": (
+        class: border-y,
+        property: border-top border-bottom,
+        values: $border-values,
+    ),
+    "width": (
+        property: width,
+        class: w,
+        values: $size-values,
+    ),
+    "height": (
+        property: height,
+        class: h,
+        values: $size-values,
+    ),
+    "columns": (
+        property: columns,
+        class: columns,
+        responsive: true,
+        values: 2 3 4,
+    ),
+) !default;

package/assets/styles/_variables-dark.scss

@@ -0,0 +1,17 @@
+//
+// Dark mode
+//
+$darken-dark: darken($dark, 2%) !default;
+$lighten-dark: lighten($dark, 2%) !default;
+$border-color-dark: lighten($dark, 4%) !default;
+$border-color-translucent-dark: rgba(72, 110, 149, .14) !default;
+$border-dark-color-dark: lighten($dark, 4%) !default;
+$border-color-active-dark: lighten($dark, 12%) !default;
+
+//new bootsrap variables
+$body-color-dark: $light !default;
+$body-emphasis-color-dark: $white !default;
+
+$code-color-dark: var(--#{$prefix}gray-300) !default;
+$text-secondary-dark: rgba(153, 159, 164, 1) !default;
+