@bgord/design 0.27.59 → 0.27.60
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +14 -0
- package/dist/design.cjs.development.js +56 -2
- package/dist/design.cjs.development.js.map +1 -1
- package/dist/design.cjs.production.min.js +1 -1
- package/dist/design.cjs.production.min.js.map +1 -1
- package/dist/design.esm.js +56 -2
- package/dist/design.esm.js.map +1 -1
- package/dist/generator.d.ts +2 -1
- package/dist/main.css +36 -0
- package/dist/main.min.css +1 -1
- package/dist/main.min.css.br +0 -0
- package/dist/main.min.css.gz +0 -0
- package/dist/object-fits-generator.d.ts +7 -0
- package/dist/tokens.d.ts +2 -0
- package/package.json +1 -1
- package/src/generate-css.ts +4 -0
- package/src/generator.ts +2 -0
- package/src/object-fits-generator.ts +35 -0
- package/src/tokens.ts +10 -0
package/README.md
CHANGED
|
@@ -475,3 +475,17 @@ Orange
|
|
|
475
475
|
| ----- | :-----------------: |
|
|
476
476
|
| black | rgba(0, 0, 0, 0.75) |
|
|
477
477
|
| none | none |
|
|
478
|
+
|
|
479
|
+
## Object fits
|
|
480
|
+
|
|
481
|
+
| Definition | Value |
|
|
482
|
+
| ---------- | ---------- |
|
|
483
|
+
| data-fit | object-fit |
|
|
484
|
+
|
|
485
|
+
| Key | Value |
|
|
486
|
+
| ---------- | :--------: |
|
|
487
|
+
| contain | contain |
|
|
488
|
+
| cover | cover |
|
|
489
|
+
| fill | fill |
|
|
490
|
+
| scale-down | scale-down |
|
|
491
|
+
| none | none |
|
|
@@ -2396,6 +2396,52 @@ var BackdropsGenerator = /*#__PURE__*/function (_AbstractGenerator) {
|
|
|
2396
2396
|
return BackdropsGenerator;
|
|
2397
2397
|
}(AbstractGenerator);
|
|
2398
2398
|
|
|
2399
|
+
var ObjectFitsGenerator = /*#__PURE__*/function (_AbstractGenerator) {
|
|
2400
|
+
_inheritsLoose(ObjectFitsGenerator, _AbstractGenerator);
|
|
2401
|
+
|
|
2402
|
+
function ObjectFitsGenerator(config) {
|
|
2403
|
+
var _this;
|
|
2404
|
+
|
|
2405
|
+
_this = _AbstractGenerator.call(this, 'Object fits') || this;
|
|
2406
|
+
_this.objectFits = config.objectFits;
|
|
2407
|
+
_this.breakpoints = config.breakpoints;
|
|
2408
|
+
return _this;
|
|
2409
|
+
}
|
|
2410
|
+
|
|
2411
|
+
var _proto = ObjectFitsGenerator.prototype;
|
|
2412
|
+
|
|
2413
|
+
_proto.generateCss = function generateCss() {
|
|
2414
|
+
var output = ''; // Regular display: data-fit="*"
|
|
2415
|
+
|
|
2416
|
+
for (var _i = 0, _Object$entries = Object.entries(this.objectFits); _i < _Object$entries.length; _i++) {
|
|
2417
|
+
var _Object$entries$_i = _Object$entries[_i],
|
|
2418
|
+
key = _Object$entries$_i[0],
|
|
2419
|
+
value = _Object$entries$_i[1];
|
|
2420
|
+
output += "*[data-fit='" + key + "'] {\n object-fit: " + value + ";\n}\n";
|
|
2421
|
+
}
|
|
2422
|
+
|
|
2423
|
+
for (var _i2 = 0, _Object$entries2 = Object.entries(this.breakpoints); _i2 < _Object$entries2.length; _i2++) {
|
|
2424
|
+
var _Object$entries2$_i = _Object$entries2[_i2],
|
|
2425
|
+
name = _Object$entries2$_i[0],
|
|
2426
|
+
_value = _Object$entries2$_i[1];
|
|
2427
|
+
output += "@media (max-width: " + _value + "px) {\n";
|
|
2428
|
+
|
|
2429
|
+
for (var _i3 = 0, _Object$entries3 = Object.entries(this.objectFits); _i3 < _Object$entries3.length; _i3++) {
|
|
2430
|
+
var _Object$entries3$_i = _Object$entries3[_i3],
|
|
2431
|
+
_key = _Object$entries3$_i[0],
|
|
2432
|
+
_value2 = _Object$entries3$_i[1];
|
|
2433
|
+
output += " *[data-" + name + "-fit='" + _key + "'] {\n object-fit: " + _value2 + ";\n }\n";
|
|
2434
|
+
}
|
|
2435
|
+
|
|
2436
|
+
output += "}\n";
|
|
2437
|
+
}
|
|
2438
|
+
|
|
2439
|
+
return output;
|
|
2440
|
+
};
|
|
2441
|
+
|
|
2442
|
+
return ObjectFitsGenerator;
|
|
2443
|
+
}(AbstractGenerator);
|
|
2444
|
+
|
|
2399
2445
|
var Spacing = {
|
|
2400
2446
|
'0': '0',
|
|
2401
2447
|
'3': '3px',
|
|
@@ -2414,6 +2460,13 @@ var Displays = {
|
|
|
2414
2460
|
'inline-block': 'inline-block',
|
|
2415
2461
|
none: 'none'
|
|
2416
2462
|
};
|
|
2463
|
+
var ObjectFits = {
|
|
2464
|
+
contain: 'contain',
|
|
2465
|
+
cover: 'cover',
|
|
2466
|
+
fill: 'fill',
|
|
2467
|
+
'scale-down': 'scale-down',
|
|
2468
|
+
none: 'none'
|
|
2469
|
+
};
|
|
2417
2470
|
var AxisPlacements = {
|
|
2418
2471
|
start: 'flex-start',
|
|
2419
2472
|
end: 'flex-end',
|
|
@@ -2775,10 +2828,11 @@ function _main() {
|
|
|
2775
2828
|
heights: Heights,
|
|
2776
2829
|
cursors: Cursors,
|
|
2777
2830
|
pointerEvents: PointerEvents,
|
|
2778
|
-
backdrops: Backdrops
|
|
2831
|
+
backdrops: Backdrops,
|
|
2832
|
+
objectFits: ObjectFits
|
|
2779
2833
|
};
|
|
2780
2834
|
_context2.next = 3;
|
|
2781
|
-
return new GeneratorProcessor().process([new Margins(config), new Paddings(config), new DisplaysGenerator(config), new AxisPlacementsGenerator(config), new FlexWrapGenerator(config), new FlexDirectionsGenerator(config), new FlexGrowsGenerator(config), new FlexShrinksGenerator(config), new GapGenerator(config), new WidthsGenerator(config), new PositionsGenerator(config), new ZIndexGenerator(config), new FontSizeGenerator(config), new FontWeightGenerator(config), new FontColorsGenerator(config), new LineHeightsGenerator(config), new LetterSpacingsGenerator(config), new BackgroundsGenerator(config), new BorderWidthsGenerator(config), new BorderColorsGenerator(config), new BorderRadiusesGenerator(config), new MaxWidthsGenerator(config), new TransformsGenerator(config), new OverflowsGenerator(config), new PositionersGenerator(config), new HeightsGenerator(config), new CursorsGenerator(config), new PointerEventsGenerator(config), new BackdropsGenerator(config)]);
|
|
2835
|
+
return new GeneratorProcessor().process([new Margins(config), new Paddings(config), new DisplaysGenerator(config), new AxisPlacementsGenerator(config), new FlexWrapGenerator(config), new FlexDirectionsGenerator(config), new FlexGrowsGenerator(config), new FlexShrinksGenerator(config), new GapGenerator(config), new WidthsGenerator(config), new PositionsGenerator(config), new ZIndexGenerator(config), new FontSizeGenerator(config), new FontWeightGenerator(config), new FontColorsGenerator(config), new LineHeightsGenerator(config), new LetterSpacingsGenerator(config), new BackgroundsGenerator(config), new BorderWidthsGenerator(config), new BorderColorsGenerator(config), new BorderRadiusesGenerator(config), new MaxWidthsGenerator(config), new TransformsGenerator(config), new OverflowsGenerator(config), new PositionersGenerator(config), new HeightsGenerator(config), new CursorsGenerator(config), new PointerEventsGenerator(config), new BackdropsGenerator(config), new ObjectFitsGenerator(config)]);
|
|
2782
2836
|
|
|
2783
2837
|
case 3:
|
|
2784
2838
|
case "end":
|