@ulu/frontend 0.1.0-beta.0 → 0.1.0-beta.1

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # Change Log
 
+## Version 0.1.0-beta.1
+
+- Remove dev dependencies from package json (vite, autoprefixer) and move specific JS module dependencies (ie. floating ui, ally.js and aria-tablist) to optionalDependencies so they can be installed if the user is using modules that require them
+
+## Version 0.1.0-beta.0
+
+- Minor release keeps most of the current API for SASS the same but adds new functions/mixins and components. JS has been slightly reorganized and outdated modules have been replaced
+- Remove calculate module and move the functions to utils (responsive property and pixel-to-em)
+- Add other components modules 
+- Update documentation and API documentation
+- Update all sass to work with new/future sass version 
+- Add root styles for ulu specific custom properties
+- Add transitions to buttons
+- JS remove mini collapsible and rely on floating ui library for tooltip/popovers
+- JS move to native dialog element instead of micro-modal
+- JS add new collapsible class for popovers or other accessible collapsible containers
+- JS reorganize utils and helpers
+- Create new docs website with api docs and component examples
+- Full build (ie. /dist/) is bundled by Vite 
+
 ## Version 0.0.23
 
 - Fix mistake introduced in 0.0.22, that broke container css

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ulu/frontend",
-  "version": "0.1.0-beta.0",
+  "version": "0.1.0-beta.1",
   "description": "Modular Sass Theming Library",
   "browser": "js/index.js",
   "main": "index.js",
@@ -78,16 +78,15 @@
     "sharp": "^0.33.4",
     "svgo": "^3.3.2",
     "typescript": "^5.3.3",
-    "vitepress": "^1.0.0-rc.27"
-  },
-  "dependencies": {
-    "@floating-ui/dom": "^1.6.5",
-    "@ulu/utils": "^0.0.17",
-    "aria-tablist": "^1.2.2",
     "autoprefixer": "^10.4.16",
     "vite": "^5.4.11"
   },
+  "dependencies": {
+    "@ulu/utils": "^0.0.17"
+  },
   "optionalDependencies": {
-    "ally.js": "^1.4.1"
+    "ally.js": "^1.4.1",
+    "aria-tablist": "^1.2.2",
+    "@floating-ui/dom": "^1.6.5"
   }
 }

package/scss/components/_slider.scss

@@ -31,7 +31,7 @@
 /// @prop {Dimension} button-font-size-small [false] Currently unused @joe-check
 /// @prop {Dimension} button-icon-offset-x [false] Offsets the control icons in from their respective sides. @joe-check
 /// @prop {Dimension} button-icon-offset-y [false] Offsets the control options down by adding a margin. 
-/// @prop {Dimension} button-margin [0.75rem] The margin between the controls and the slide content when using .slide-gap-for-controls
+/// @prop {Dimension} button-margin [0.75rem] The margin between the controls and the slide content when using .slider__slide-gap-for-controls
 /// @prop {Dimension} button-margin-small [0.75rem] Currently commented out @joe-check
 /// @prop {Dimension} button-size [3rem] Size of the button. Likely antiquated and replaced with button-width and button-height
 /// @prop {Dimension} button-size-small [false] Currently commented out @joe-check
@@ -193,7 +193,7 @@ $config: (
       padding: get("padding-top") $slide-padding-x get("padding-bottom") $slide-padding-x;
     }
   }
-  .slide-gap-for-controls {
+  #{ $prefix }__slide-gap-for-controls {
     $padding:  get("button-width") + get("button-margin");
     padding-left: $padding;
     padding-right: $padding;
@@ -215,7 +215,7 @@ $config: (
     }
   }
   #{ $prefix }--inset-controls {
-    .slide-gap-for-controls {
+    #{ $prefix }__slide-gap-for-controls {
       $padding: get("button-width") + get("button-margin") + get("button-icon-offset-x");
       padding-left: $padding;
       padding-right: $padding;

package/scss/components/_tag.scss

@@ -23,6 +23,20 @@ $-fallbacks: (
 
 /// Module Settings
 /// @type Map
+/// @prop {CssValue} font-weight [normal] Font weight for the tag text.
+/// @prop {String} font-family [true] Font family for the tag text.
+/// @prop {CssValue} box-shadow [none] Box shadow for the tag.
+/// @prop {Dimension} padding [(0.4em 0.75em)] Inner padding for the tag.
+/// @prop {CssValue} vertical-align [baseline] Vertical alignment of tag text.
+/// @prop {Dimension} margin-between [0.5em] Margin between tags.
+/// @prop {Dimension} margin-between-tags [0] @joe-check 
+/// @prop {Number} line-height [1] Line height for the tag text.
+/// @prop {String} type-size ["small"] Font size for the tag text.
+/// @prop {Color} background-color [#eaeaea] Background color of the tag.
+/// @prop {Dimension} border-radius [1.25em] Border radius of the tag.
+/// @prop {Color} border-color [transparent] Border color for the tag.
+/// @prop {Dimension} border-width [1px] Border width of the tag.
+/// @prop {String} color ["type-tertiary"] Color of the tag text.
 
 $config: (
   "font-weight" : normal,