Comparing version 0.13.0 to 0.14.0
@@ -1,3 +0,3 @@ | ||
import { GwenBase, GwenParams } from './GwenBase'; | ||
import { GwenParams } from './GwenBase'; | ||
import { Gwen } from './Gwen'; | ||
export { GwenBase, GwenParams, Gwen }; | ||
export { GwenParams, Gwen }; |
"use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
var GwenBase_1 = require("./GwenBase"); | ||
exports.GwenBase = GwenBase_1.GwenBase; | ||
var Gwen_1 = require("./Gwen"); | ||
exports.Gwen = Gwen_1.Gwen; | ||
exports.Gwen = void 0; | ||
const Gwen_1 = require("./Gwen"); | ||
Object.defineProperty(exports, "Gwen", { enumerable: true, get: function () { return Gwen_1.Gwen; } }); | ||
//# sourceMappingURL=external.js.map |
import { GwenBase, GwenParams } from './GwenBase'; | ||
import { CSSObject } from '@emotion/css'; | ||
export declare class Gwen<Params extends GwenParams = GwenParams> extends GwenBase<Params> { | ||
declare type noUndefined<T> = T extends undefined ? never : T; | ||
export declare class Gwen<Params extends GwenParams | undefined = GwenParams> extends GwenBase<noUndefined<Params>> { | ||
constructor(params?: Params); | ||
get row(): this; | ||
@@ -148,1 +150,2 @@ get rowr(): this; | ||
} | ||
export {}; |
1255
lib/src/Gwen.js
"use strict"; | ||
var __extends = (this && this.__extends) || (function () { | ||
var extendStatics = function (d, b) { | ||
extendStatics = Object.setPrototypeOf || | ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || | ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; | ||
return extendStatics(d, b); | ||
}; | ||
return function (d, b) { | ||
extendStatics(d, b); | ||
function __() { this.constructor = d; } | ||
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); | ||
}; | ||
})(); | ||
var __importDefault = (this && this.__importDefault) || function (mod) { | ||
@@ -19,514 +6,291 @@ return (mod && mod.__esModule) ? mod : { "default": mod }; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
var GwenBase_1 = require("./GwenBase"); | ||
var color_1 = __importDefault(require("color")); | ||
// type CSS = ObjectInterpolation<undefined>; | ||
var Gwen = /** @class */ (function (_super) { | ||
__extends(Gwen, _super); | ||
function Gwen() { | ||
return _super !== null && _super.apply(this, arguments) || this; | ||
exports.Gwen = void 0; | ||
const GwenBase_1 = require("./GwenBase"); | ||
const color_1 = __importDefault(require("color")); | ||
class Gwen extends GwenBase_1.GwenBase { | ||
constructor(params) { | ||
super((params || {})); | ||
} | ||
Object.defineProperty(Gwen.prototype, "row", { | ||
get: function () { | ||
return this.css({ | ||
display: 'flex', | ||
flexDirection: 'row', | ||
}); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "rowr", { | ||
get: function () { | ||
return this.css({ | ||
display: 'flex', | ||
flexDirection: 'row-reverse', | ||
}); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "col", { | ||
get: function () { | ||
return this.css({ | ||
display: 'flex', | ||
flexDirection: 'column', | ||
}); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "column", { | ||
get: function () { | ||
return this.css({ | ||
display: 'flex', | ||
flexDirection: 'column', | ||
}); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "colr", { | ||
get: function () { | ||
return this.css({ | ||
display: 'flex', | ||
flexDirection: 'column-reverse', | ||
}); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "wrap", { | ||
get: function () { | ||
return this.css({ flexWrap: 'wrap' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "wrapr", { | ||
get: function () { | ||
return this.css({ flexWrap: 'wrap-reverse' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "nowrap", { | ||
get: function () { | ||
return this.css({ flexWrap: 'nowrap' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "ac", { | ||
get: function () { | ||
return this.css({ alignItems: 'center' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "ast", { | ||
get: function () { | ||
return this.css({ alignItems: 'stretch' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "as", { | ||
get: function () { | ||
return this.css({ alignItems: 'flex-start' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "ae", { | ||
get: function () { | ||
return this.css({ alignItems: 'flex-end' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "ab", { | ||
get: function () { | ||
return this.css({ alignItems: 'baseline' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "jc", { | ||
get: function () { | ||
return this.css({ justifyContent: 'center' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "js", { | ||
get: function () { | ||
return this.css({ justifyContent: 'flex-start' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "je", { | ||
get: function () { | ||
return this.css({ justifyContent: 'flex-end' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "jsb", { | ||
get: function () { | ||
return this.css({ justifyContent: 'space-between' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "jsa", { | ||
get: function () { | ||
return this.css({ justifyContent: 'space-around' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "jse", { | ||
get: function () { | ||
return this.css({ justifyContent: 'space-evenly' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "white", { | ||
get: function () { | ||
return this.css({ color: '#FFFFFF' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "black", { | ||
get: function () { | ||
return this.css({ color: "#000000" }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "underline", { | ||
get: function () { | ||
return this.css({ textDecoration: 'underline' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "tdn", { | ||
get: function () { | ||
return this.css({ textDecoration: 'none' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "visible", { | ||
get: function () { | ||
return this.css({ visibility: 'visible' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "hidden", { | ||
get: function () { | ||
return this.css({ visibility: 'hidden' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "scroll", { | ||
get: function () { | ||
return this.css({ overflow: 'scroll' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "scrollx", { | ||
get: function () { | ||
return this.css({ overflowX: 'scroll' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "scrolly", { | ||
get: function () { | ||
return this.css({ overflowY: 'scroll' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "pointer", { | ||
get: function () { | ||
return this.css({ cursor: 'pointer' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "ellipsis", { | ||
get: function () { | ||
return this.css({ textOverflow: 'ellipsis' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "bold", { | ||
get: function () { | ||
return this.css({ fontWeight: 'bold' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "bolder", { | ||
get: function () { | ||
return this.css({ fontWeight: 'bolder' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "lighter", { | ||
get: function () { | ||
return this.css({ fontWeight: 'lighter' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "wide", { | ||
get: function () { | ||
return this.css({ width: '100%' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "tall", { | ||
get: function () { | ||
return this.css({ height: '100%' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "fill", { | ||
get: function () { | ||
return this.wide.tall; | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "uppercase", { | ||
get: function () { | ||
return this.css({ textTransform: 'uppercase' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "lowercase", { | ||
get: function () { | ||
return this.css({ textTransform: 'lowercase' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "caps", { | ||
get: function () { | ||
return this.css({ textTransform: 'capitalize' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "tal", { | ||
get: function () { | ||
return this.css({ textAlign: 'left' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "tac", { | ||
get: function () { | ||
return this.css({ textAlign: 'center' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "tar", { | ||
get: function () { | ||
return this.css({ textAlign: 'right' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "taj", { | ||
get: function () { | ||
return this.css({ textAlign: 'justify' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "fullw", { | ||
get: function () { | ||
return this.css({ width: '100vw' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "fullh", { | ||
get: function () { | ||
return this.css({ height: '100vh' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "full", { | ||
get: function () { | ||
return this.css({ height: '100vh', width: '100vw' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "ofh", { | ||
get: function () { | ||
return this.css({ overflow: 'hidden' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "ofv", { | ||
get: function () { | ||
return this.css({ overflow: 'visible' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "ofs", { | ||
get: function () { | ||
return this.css({ overflow: 'scroll' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "ofa", { | ||
get: function () { | ||
return this.css({ overflow: 'auto' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "smallcaps", { | ||
get: function () { | ||
return this.css({ fontVariant: 'small-caps' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "allsmallcaps", { | ||
/** | ||
* @property allsmallcaps | ||
* @description { fontVariant: "all-small-caps" } | ||
*/ | ||
get: function () { | ||
return this.css({ fontVariant: 'all-small-caps' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "bn", { | ||
get: function () { | ||
return this.css({ border: 'none' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "sans", { | ||
get: function () { | ||
return this.css({ fontSize: this.theme.sansFont }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "serif", { | ||
get: function () { | ||
return this.css({ fontSize: this.theme.serifFont }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
get row() { | ||
return this.css({ | ||
display: 'flex', | ||
flexDirection: 'row', | ||
}); | ||
} | ||
get rowr() { | ||
return this.css({ | ||
display: 'flex', | ||
flexDirection: 'row-reverse', | ||
}); | ||
} | ||
get col() { | ||
return this.css({ | ||
display: 'flex', | ||
flexDirection: 'column', | ||
}); | ||
} | ||
get column() { | ||
return this.css({ | ||
display: 'flex', | ||
flexDirection: 'column', | ||
}); | ||
} | ||
get colr() { | ||
return this.css({ | ||
display: 'flex', | ||
flexDirection: 'column-reverse', | ||
}); | ||
} | ||
get wrap() { | ||
return this.css({ flexWrap: 'wrap' }); | ||
} | ||
get wrapr() { | ||
return this.css({ flexWrap: 'wrap-reverse' }); | ||
} | ||
get nowrap() { | ||
return this.css({ flexWrap: 'nowrap' }); | ||
} | ||
get ac() { | ||
return this.css({ alignItems: 'center' }); | ||
} | ||
get ast() { | ||
return this.css({ alignItems: 'stretch' }); | ||
} | ||
get as() { | ||
return this.css({ alignItems: 'flex-start' }); | ||
} | ||
get ae() { | ||
return this.css({ alignItems: 'flex-end' }); | ||
} | ||
get ab() { | ||
return this.css({ alignItems: 'baseline' }); | ||
} | ||
get jc() { | ||
return this.css({ justifyContent: 'center' }); | ||
} | ||
get js() { | ||
return this.css({ justifyContent: 'flex-start' }); | ||
} | ||
get je() { | ||
return this.css({ justifyContent: 'flex-end' }); | ||
} | ||
get jsb() { | ||
return this.css({ justifyContent: 'space-between' }); | ||
} | ||
get jsa() { | ||
return this.css({ justifyContent: 'space-around' }); | ||
} | ||
get jse() { | ||
return this.css({ justifyContent: 'space-evenly' }); | ||
} | ||
get white() { | ||
return this.css({ color: '#FFFFFF' }); | ||
} | ||
get black() { | ||
return this.css({ color: `#000000` }); | ||
} | ||
get underline() { | ||
return this.css({ textDecoration: 'underline' }); | ||
} | ||
get tdn() { | ||
return this.css({ textDecoration: 'none' }); | ||
} | ||
get visible() { | ||
return this.css({ visibility: 'visible' }); | ||
} | ||
get hidden() { | ||
return this.css({ visibility: 'hidden' }); | ||
} | ||
get scroll() { | ||
return this.css({ overflow: 'scroll' }); | ||
} | ||
get scrollx() { | ||
return this.css({ overflowX: 'scroll' }); | ||
} | ||
get scrolly() { | ||
return this.css({ overflowY: 'scroll' }); | ||
} | ||
get pointer() { | ||
return this.css({ cursor: 'pointer' }); | ||
} | ||
get ellipsis() { | ||
return this.css({ textOverflow: 'ellipsis' }); | ||
} | ||
get bold() { | ||
return this.css({ fontWeight: 'bold' }); | ||
} | ||
get bolder() { | ||
return this.css({ fontWeight: 'bolder' }); | ||
} | ||
get lighter() { | ||
return this.css({ fontWeight: 'lighter' }); | ||
} | ||
get wide() { | ||
return this.css({ width: '100%' }); | ||
} | ||
get tall() { | ||
return this.css({ height: '100%' }); | ||
} | ||
get fill() { | ||
return this.wide.tall; | ||
} | ||
get uppercase() { | ||
return this.css({ textTransform: 'uppercase' }); | ||
} | ||
get lowercase() { | ||
return this.css({ textTransform: 'lowercase' }); | ||
} | ||
get caps() { | ||
return this.css({ textTransform: 'capitalize' }); | ||
} | ||
get tal() { | ||
return this.css({ textAlign: 'left' }); | ||
} | ||
get tac() { | ||
return this.css({ textAlign: 'center' }); | ||
} | ||
get tar() { | ||
return this.css({ textAlign: 'right' }); | ||
} | ||
get taj() { | ||
return this.css({ textAlign: 'justify' }); | ||
} | ||
get fullw() { | ||
return this.css({ width: '100vw' }); | ||
} | ||
get fullh() { | ||
return this.css({ height: '100vh' }); | ||
} | ||
get full() { | ||
return this.css({ height: '100vh', width: '100vw' }); | ||
} | ||
get ofh() { | ||
return this.css({ overflow: 'hidden' }); | ||
} | ||
get ofv() { | ||
return this.css({ overflow: 'visible' }); | ||
} | ||
get ofs() { | ||
return this.css({ overflow: 'scroll' }); | ||
} | ||
get ofa() { | ||
return this.css({ overflow: 'auto' }); | ||
} | ||
get smallcaps() { | ||
return this.css({ fontVariant: 'small-caps' }); | ||
} | ||
/** | ||
* @property allsmallcaps | ||
* @description { fontVariant: "all-small-caps" } | ||
*/ | ||
get allsmallcaps() { | ||
return this.css({ fontVariant: 'all-small-caps' }); | ||
} | ||
get bn() { | ||
return this.css({ border: 'none' }); | ||
} | ||
get sans() { | ||
return this.css({ fontSize: this.theme.sansFont }); | ||
} | ||
get serif() { | ||
return this.css({ fontSize: this.theme.serifFont }); | ||
} | ||
// TODO: cursors | ||
Gwen.prototype.hover = function (delta) { | ||
var _a; | ||
return this.css((_a = {}, _a["&:hover"] = delta(this.reset()).class, _a)); | ||
}; | ||
Gwen.prototype.pseudo = function (cond, delta) { | ||
var _a; | ||
return this.css((_a = {}, | ||
_a["&" + cond] = delta(this.reset()).class, | ||
_a)); | ||
}; | ||
Gwen.prototype.media = function (conditions, delta) { | ||
var _a; | ||
return this.css((_a = {}, | ||
_a["@media only screen " + (conditions.min ? " and (min-width: " + conditions.min + ")" : "") + " " + (conditions.max ? " and (max-width: " + conditions.max + ")" : '')] = delta(this.reset()).class, | ||
_a)); | ||
}; | ||
Gwen.prototype.selector = function (cond, delta) { | ||
var _a; | ||
hover(delta) { | ||
return this.css({ [`&:hover`]: delta(this.reset()).class }); | ||
} | ||
pseudo(cond, delta) { | ||
return this.css({ | ||
[`&${cond}`]: delta(this.reset()).class, | ||
}); | ||
} | ||
media(conditions, delta) { | ||
if (!conditions.min && !conditions.max) | ||
return this; | ||
return this.css({ | ||
[`@media only screen ${conditions.min ? ` and (min-width: ${conditions.min})` : ``} ${conditions.max ? ` and (max-width: ${conditions.max})` : ''}`]: delta(this.reset()).class, | ||
}); | ||
} | ||
selector(cond, delta) { | ||
// const newInst: Gwen = new (this as any).constructor(this.theme); | ||
return this.css((_a = {}, | ||
_a[cond] = delta(this.reset()).class, | ||
_a)); | ||
}; | ||
Gwen.prototype.smup = function (delta) { | ||
return this.css({ | ||
[cond]: delta(this.reset()).class, | ||
}); | ||
} | ||
smup(delta) { | ||
return this.media({ min: this.theme.sm }, delta); | ||
}; | ||
Gwen.prototype.mdup = function (delta) { | ||
} | ||
mdup(delta) { | ||
return this.media({ min: this.theme.md }, delta); | ||
}; | ||
Gwen.prototype.lgup = function (delta) { | ||
} | ||
lgup(delta) { | ||
return this.media({ min: this.theme.lg }, delta); | ||
}; | ||
Gwen.prototype.xlup = function (delta) { | ||
} | ||
xlup(delta) { | ||
return this.media({ min: this.theme.xl }, delta); | ||
}; | ||
Gwen.prototype.xsdown = function (delta) { | ||
} | ||
xsdown(delta) { | ||
return this.media({ max: this.theme.sm }, delta); | ||
}; | ||
Gwen.prototype.smdown = function (delta) { | ||
} | ||
smdown(delta) { | ||
return this.media({ max: this.theme.md }, delta); | ||
}; | ||
Gwen.prototype.mddown = function (delta) { | ||
} | ||
mddown(delta) { | ||
return this.media({ max: this.theme.lg }, delta); | ||
}; | ||
Gwen.prototype.lgdown = function (delta) { | ||
} | ||
lgdown(delta) { | ||
return this.media({ max: this.theme.xl }, delta); | ||
}; | ||
Gwen.prototype.xsonly = function (delta) { | ||
} | ||
xsonly(delta) { | ||
return this.media({ min: this.theme.xs, max: this.theme.sm }, delta); | ||
}; | ||
Gwen.prototype.smonly = function (delta) { | ||
} | ||
smonly(delta) { | ||
return this.media({ min: this.theme.sm, max: this.theme.md }, delta); | ||
}; | ||
Gwen.prototype.mdonly = function (delta) { | ||
} | ||
mdonly(delta) { | ||
return this.media({ min: this.theme.md, max: this.theme.lg }, delta); | ||
}; | ||
Gwen.prototype.lgonly = function (delta) { | ||
} | ||
lgonly(delta) { | ||
return this.media({ min: this.theme.lg, max: this.theme.xl }, delta); | ||
}; | ||
Gwen.prototype.xlonly = function (delta) { | ||
} | ||
xlonly(delta) { | ||
return this.media({ min: this.theme.xl }, delta); | ||
}; | ||
Gwen.prototype.checked = function (delta) { | ||
return this.pseudo(":checked", delta); | ||
}; | ||
Gwen.prototype.focus = function (delta) { | ||
return this.pseudo(":focus", delta); | ||
}; | ||
Gwen.prototype.focusWithin = function (delta) { | ||
return this.pseudo(":focus-within", delta); | ||
}; | ||
Gwen.prototype.visited = function (delta) { | ||
return this.pseudo(":visited", delta); | ||
}; | ||
Gwen.prototype.active = function (delta) { | ||
return this.pseudo(":active", delta); | ||
}; | ||
Gwen.prototype.empty = function (delta) { | ||
return this.pseudo(":empty", delta); | ||
}; | ||
Gwen.prototype.enabled = function (delta) { | ||
return this.pseudo(":enabled", delta); | ||
}; | ||
Gwen.prototype.firstOfType = function (delta) { | ||
return this.pseudo(":first-of-type", delta); | ||
}; | ||
Gwen.prototype.lastOfType = function (delta) { | ||
return this.pseudo(":last-of-type", delta); | ||
}; | ||
Gwen.prototype.firstChild = function (delta) { | ||
return this.pseudo(":first-child", delta); | ||
}; | ||
Gwen.prototype.lastChild = function (delta) { | ||
return this.pseudo(":last-child", delta); | ||
}; | ||
Gwen.prototype.nthChild = function (n, delta) { | ||
return this.pseudo(":nth-child(" + n + ")", delta); | ||
}; | ||
Gwen.prototype.if = function (condition, ifDelta, elseDelta) { | ||
} | ||
checked(delta) { | ||
return this.pseudo(`:checked`, delta); | ||
} | ||
focus(delta) { | ||
return this.pseudo(`:focus`, delta); | ||
} | ||
focusWithin(delta) { | ||
return this.pseudo(`:focus-within`, delta); | ||
} | ||
visited(delta) { | ||
return this.pseudo(`:visited`, delta); | ||
} | ||
active(delta) { | ||
return this.pseudo(`:active`, delta); | ||
} | ||
empty(delta) { | ||
return this.pseudo(`:empty`, delta); | ||
} | ||
enabled(delta) { | ||
return this.pseudo(`:enabled`, delta); | ||
} | ||
firstOfType(delta) { | ||
return this.pseudo(`:first-of-type`, delta); | ||
} | ||
lastOfType(delta) { | ||
return this.pseudo(`:last-of-type`, delta); | ||
} | ||
firstChild(delta) { | ||
return this.pseudo(`:first-child`, delta); | ||
} | ||
lastChild(delta) { | ||
return this.pseudo(`:last-child`, delta); | ||
} | ||
nthChild(n, delta) { | ||
return this.pseudo(`:nth-child(${n})`, delta); | ||
} | ||
if(condition, ifDelta, elseDelta) { | ||
if (condition) | ||
@@ -537,337 +301,164 @@ return ifDelta(this); | ||
return this; | ||
}; | ||
Gwen.prototype.bgc = function (arg) { | ||
} | ||
bgc(arg) { | ||
return this.css({ backgroundColor: arg }); | ||
}; | ||
Object.defineProperty(Gwen.prototype, "shadow0", { | ||
get: function () { | ||
return this.css({ boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 1px 0 rgba(0, 0, 0, 0.06);' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "shadow1", { | ||
get: function () { | ||
return this.css({ boxShadow: '0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 1px 0 rgba(0, 0, 0, 0.06);' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "shadow2", { | ||
get: function () { | ||
return this.css({ boxShadow: '0 2px 3px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.06);' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "shadow3", { | ||
get: function () { | ||
return this.css({ boxShadow: '0 3px 5px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.06);' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "shadow4", { | ||
get: function () { | ||
return this.css({ boxShadow: '0 5px 8px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.06);' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "shadow5", { | ||
get: function () { | ||
return this.css({ boxShadow: '0 8px 11px 0 rgba(0, 0, 0, 0.1), 0 5px 5px 0 rgba(0, 0, 0, 0.06);' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "shadow6", { | ||
get: function () { | ||
return this.css({ boxShadow: '0 11px 17px 0 rgba(0, 0, 0, 0.1), 0 8px 8px 0 rgba(0, 0, 0, 0.06);' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "shadow7", { | ||
get: function () { | ||
return this.css({ boxShadow: '0 17px 26px 0 rgba(0, 0, 0, 0.1), 0 11px 11px 0 rgba(0, 0, 0, 0.06);' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "shadow8", { | ||
get: function () { | ||
return this.css({ boxShadow: '0 26px 38px 0 rgba(0, 0, 0, 0.1), 0 17px 17px 0 rgba(0, 0, 0, 0.06);' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "shadow9", { | ||
get: function () { | ||
return this.css({ boxShadow: '0 38px 58px 0 rgba(0, 0, 0, 0.1), 0 26px 26px 0 rgba(0, 0, 0, 0.06);' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "shadow10", { | ||
get: function () { | ||
return this.css({ boxShadow: '0 58px 86px 0 rgba(0, 0, 0, 0.1), 0 38px 38px 0 rgba(0, 0, 0, 0.06);' }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "fw1", { | ||
get: function () { | ||
return this.css({ fontWeight: 100 }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "fw2", { | ||
get: function () { | ||
return this.css({ fontWeight: 200 }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "fw3", { | ||
get: function () { | ||
return this.css({ fontWeight: 300 }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "fw4", { | ||
get: function () { | ||
return this.css({ fontWeight: 400 }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "fw5", { | ||
get: function () { | ||
return this.css({ fontWeight: 500 }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "fw6", { | ||
get: function () { | ||
return this.css({ fontWeight: 600 }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "fw7", { | ||
get: function () { | ||
return this.css({ fontWeight: 700 }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "fw8", { | ||
get: function () { | ||
return this.css({ fontWeight: 800 }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(Gwen.prototype, "fw9", { | ||
get: function () { | ||
return this.css({ fontWeight: 900 }); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Gwen.prototype.fs = function (size) { | ||
return this.css({ fontSize: size + "pt" }); | ||
}; | ||
Gwen.prototype.h = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.height.apply(this, args); | ||
}; | ||
Gwen.prototype.w = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.width.apply(this, args); | ||
}; | ||
Gwen.prototype.l = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.left.apply(this, args); | ||
}; | ||
Gwen.prototype.r = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.right.apply(this, args); | ||
}; | ||
Gwen.prototype.t = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.top.apply(this, args); | ||
}; | ||
Gwen.prototype.b = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.bottom.apply(this, args); | ||
}; | ||
Gwen.prototype.p = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.padding.apply(this, args); | ||
}; | ||
Gwen.prototype.pb = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.paddingBottom.apply(this, args); | ||
}; | ||
Gwen.prototype.pt = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.paddingTop.apply(this, args); | ||
}; | ||
Gwen.prototype.pl = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.paddingLeft.apply(this, args); | ||
}; | ||
Gwen.prototype.pr = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.paddingRight.apply(this, args); | ||
}; | ||
Gwen.prototype.pv = function (arg) { | ||
} | ||
get shadow0() { | ||
return this.css({ boxShadow: '0 1px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 1px 0 rgba(0, 0, 0, 0.06);' }); | ||
} | ||
get shadow1() { | ||
return this.css({ boxShadow: '0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 1px 0 rgba(0, 0, 0, 0.06);' }); | ||
} | ||
get shadow2() { | ||
return this.css({ boxShadow: '0 2px 3px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.06);' }); | ||
} | ||
get shadow3() { | ||
return this.css({ boxShadow: '0 3px 5px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.06);' }); | ||
} | ||
get shadow4() { | ||
return this.css({ boxShadow: '0 5px 8px 0 rgba(0, 0, 0, 0.1), 0 3px 3px 0 rgba(0, 0, 0, 0.06);' }); | ||
} | ||
get shadow5() { | ||
return this.css({ boxShadow: '0 8px 11px 0 rgba(0, 0, 0, 0.1), 0 5px 5px 0 rgba(0, 0, 0, 0.06);' }); | ||
} | ||
get shadow6() { | ||
return this.css({ boxShadow: '0 11px 17px 0 rgba(0, 0, 0, 0.1), 0 8px 8px 0 rgba(0, 0, 0, 0.06);' }); | ||
} | ||
get shadow7() { | ||
return this.css({ boxShadow: '0 17px 26px 0 rgba(0, 0, 0, 0.1), 0 11px 11px 0 rgba(0, 0, 0, 0.06);' }); | ||
} | ||
get shadow8() { | ||
return this.css({ boxShadow: '0 26px 38px 0 rgba(0, 0, 0, 0.1), 0 17px 17px 0 rgba(0, 0, 0, 0.06);' }); | ||
} | ||
get shadow9() { | ||
return this.css({ boxShadow: '0 38px 58px 0 rgba(0, 0, 0, 0.1), 0 26px 26px 0 rgba(0, 0, 0, 0.06);' }); | ||
} | ||
get shadow10() { | ||
return this.css({ boxShadow: '0 58px 86px 0 rgba(0, 0, 0, 0.1), 0 38px 38px 0 rgba(0, 0, 0, 0.06);' }); | ||
} | ||
get fw1() { | ||
return this.css({ fontWeight: 100 }); | ||
} | ||
get fw2() { | ||
return this.css({ fontWeight: 200 }); | ||
} | ||
get fw3() { | ||
return this.css({ fontWeight: 300 }); | ||
} | ||
get fw4() { | ||
return this.css({ fontWeight: 400 }); | ||
} | ||
get fw5() { | ||
return this.css({ fontWeight: 500 }); | ||
} | ||
get fw6() { | ||
return this.css({ fontWeight: 600 }); | ||
} | ||
get fw7() { | ||
return this.css({ fontWeight: 700 }); | ||
} | ||
get fw8() { | ||
return this.css({ fontWeight: 800 }); | ||
} | ||
get fw9() { | ||
return this.css({ fontWeight: 900 }); | ||
} | ||
fs(size) { | ||
return this.css({ fontSize: `${size}pt` }); | ||
} | ||
h(...args) { | ||
return this.height(...args); | ||
} | ||
w(...args) { | ||
return this.width(...args); | ||
} | ||
l(...args) { | ||
return this.left(...args); | ||
} | ||
r(...args) { | ||
return this.right(...args); | ||
} | ||
t(...args) { | ||
return this.top(...args); | ||
} | ||
b(...args) { | ||
return this.bottom(...args); | ||
} | ||
p(...args) { | ||
return this.padding(...args); | ||
} | ||
pb(...args) { | ||
return this.paddingBottom(...args); | ||
} | ||
pt(...args) { | ||
return this.paddingTop(...args); | ||
} | ||
pl(...args) { | ||
return this.paddingLeft(...args); | ||
} | ||
pr(...args) { | ||
return this.paddingRight(...args); | ||
} | ||
pv(arg) { | ||
return this.pt(arg).pb(arg); | ||
}; | ||
Gwen.prototype.ph = function (arg) { | ||
} | ||
ph(arg) { | ||
return this.pl(arg).pr(arg); | ||
}; | ||
Gwen.prototype.m = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.margin.apply(this, args); | ||
}; | ||
Gwen.prototype.mb = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.marginBottom.apply(this, args); | ||
}; | ||
Gwen.prototype.mt = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.marginTop.apply(this, args); | ||
}; | ||
Gwen.prototype.ml = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.marginLeft.apply(this, args); | ||
}; | ||
Gwen.prototype.mr = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.marginRight.apply(this, args); | ||
}; | ||
Gwen.prototype.mv = function (arg) { | ||
} | ||
m(...args) { | ||
return this.margin(...args); | ||
} | ||
mb(...args) { | ||
return this.marginBottom(...args); | ||
} | ||
mt(...args) { | ||
return this.marginTop(...args); | ||
} | ||
ml(...args) { | ||
return this.marginLeft(...args); | ||
} | ||
mr(...args) { | ||
return this.marginRight(...args); | ||
} | ||
mv(arg) { | ||
return this.mt(arg).mb(arg); | ||
}; | ||
Gwen.prototype.mh = function (arg) { | ||
} | ||
mh(arg) { | ||
return this.ml(arg).mr(arg); | ||
}; | ||
Gwen.prototype.mxh = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.maxHeight.apply(this, args); | ||
}; | ||
Gwen.prototype.mnh = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.minHeight.apply(this, args); | ||
}; | ||
Gwen.prototype.mxw = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.maxWidth.apply(this, args); | ||
}; | ||
Gwen.prototype.mnw = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.minWidth.apply(this, args); | ||
}; | ||
Gwen.prototype.f = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.flex.apply(this, args); | ||
}; | ||
Gwen.prototype.cg = function (k) { | ||
} | ||
mxh(...args) { | ||
return this.maxHeight(...args); | ||
} | ||
mnh(...args) { | ||
return this.minHeight(...args); | ||
} | ||
mxw(...args) { | ||
return this.maxWidth(...args); | ||
} | ||
mnw(...args) { | ||
return this.minWidth(...args); | ||
} | ||
f(...args) { | ||
return this.flex(...args); | ||
} | ||
cg(k) { | ||
return this.css({ | ||
color: color_1.default('#ffffff') | ||
color: (0, color_1.default)('#ffffff') | ||
.darken(k / 100) | ||
.toString(), | ||
}); | ||
}; | ||
Gwen.prototype.cgo = function (k) { | ||
} | ||
cgo(k) { | ||
return this.css({ | ||
color: "rgba(0, 0, 0, " + (k / 100.0).toFixed(2), | ||
color: `rgba(0, 0, 0, ${(k / 100.0).toFixed(2)}`, | ||
}); | ||
}; | ||
Gwen.prototype.op = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.opacity.apply(this, args); | ||
}; | ||
Gwen.prototype.br = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
return this.borderRadius.apply(this, args); | ||
}; | ||
return Gwen; | ||
}(GwenBase_1.GwenBase)); | ||
} | ||
op(...args) { | ||
return this.opacity(...args); | ||
} | ||
br(...args) { | ||
return this.borderRadius(...args); | ||
} | ||
} | ||
exports.Gwen = Gwen; | ||
//# sourceMappingURL=Gwen.js.map |
"use strict"; | ||
var __assign = (this && this.__assign) || function () { | ||
__assign = Object.assign || function(t) { | ||
for (var s, i = 1, n = arguments.length; i < n; i++) { | ||
s = arguments[i]; | ||
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) | ||
t[p] = s[p]; | ||
} | ||
return t; | ||
}; | ||
return __assign.apply(this, arguments); | ||
}; | ||
var __spreadArrays = (this && this.__spreadArrays) || function () { | ||
for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length; | ||
for (var r = Array(s), k = 0, i = 0; i < il; i++) | ||
for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++) | ||
r[k] = a[j]; | ||
return r; | ||
}; | ||
var __importDefault = (this && this.__importDefault) || function (mod) { | ||
@@ -24,9 +6,10 @@ return (mod && mod.__esModule) ? mod : { "default": mod }; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
var css_1 = require("@emotion/css"); | ||
var object_hash_1 = __importDefault(require("object-hash")); | ||
exports.GwenBase = void 0; | ||
const css_1 = require("@emotion/css"); | ||
const object_hash_1 = __importDefault(require("object-hash")); | ||
if (typeof window !== 'undefined') { | ||
window.hash = object_hash_1.default; | ||
} | ||
var flattenArg = function (arg) { | ||
var allArgs = []; | ||
const flattenArg = (arg) => { | ||
let allArgs = []; | ||
if (arg instanceof GwenBase) { | ||
@@ -36,10 +19,9 @@ allArgs.push(arg); | ||
else if (Array.isArray(arg)) { | ||
for (var _i = 0, arg_1 = arg; _i < arg_1.length; _i++) { | ||
var item = arg_1[_i]; | ||
allArgs = __spreadArrays(allArgs, flattenArg(item)); | ||
for (const item of arg) { | ||
allArgs = [...allArgs, ...flattenArg(item)]; | ||
} | ||
} | ||
else if (typeof arg === 'object') { | ||
for (var k in arg) { | ||
allArgs = __spreadArrays(allArgs, flattenArg(arg[k])); | ||
for (const k in arg) { | ||
allArgs = [...allArgs, ...flattenArg(arg[k])]; | ||
} | ||
@@ -49,3 +31,3 @@ } | ||
}; | ||
var DEFAULT_THEME = { | ||
const DEFAULT_THEME = { | ||
xs: '420px', | ||
@@ -56,6 +38,6 @@ sm: '640px', | ||
xl: '1280px', | ||
sansFont: "system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"", | ||
serifFont: "Georgia, Cambria, \"Times New Roman\", Times, serif", | ||
sansFont: `system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"`, | ||
serifFont: `Georgia, Cambria, "Times New Roman", Times, serif`, | ||
}; | ||
var GwenBase = /** @class */ (function () { | ||
class GwenBase { | ||
// static create(theme: Partial<GwenTheme> = {}, params: Partial<Omit<GwenParams, 'theme'>> = {}) { | ||
@@ -74,3 +56,3 @@ // const finalTheme: GwenTheme = { | ||
// } | ||
function GwenBase(params) { | ||
constructor(params) { | ||
// static cx = cx; | ||
@@ -85,30 +67,20 @@ // protected _update = (...args: CxArgs) => { | ||
} | ||
Object.defineProperty(GwenBase.prototype, "theme", { | ||
get: function () { | ||
var _a, _b; | ||
var finalTheme = __assign(__assign({}, DEFAULT_THEME), this.params.theme); | ||
if ((_a = this.params.theme) === null || _a === void 0 ? void 0 : _a.sansFont) | ||
finalTheme.sansFont = "\"" + this.params.theme.sansFont + "\", " + DEFAULT_THEME.sansFont; | ||
if ((_b = this.params.theme) === null || _b === void 0 ? void 0 : _b.serifFont) | ||
finalTheme.serifFont = "\"" + this.params.theme.serifFont + "\", " + DEFAULT_THEME.serifFont; | ||
return finalTheme; | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(GwenBase.prototype, "cssArray", { | ||
get: function () { | ||
return this.params.cssArray || []; | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
Object.defineProperty(GwenBase.prototype, "class", { | ||
get: function () { | ||
return css_1.css.apply(void 0, this.cssArray); | ||
}, | ||
enumerable: true, | ||
configurable: true | ||
}); | ||
GwenBase.prototype._gethash = function (obj) { | ||
get theme() { | ||
const finalTheme = { | ||
...DEFAULT_THEME, | ||
...this.params.theme, | ||
}; | ||
if (this.params.theme?.sansFont) | ||
finalTheme.sansFont = `"${this.params.theme.sansFont}", ${DEFAULT_THEME.sansFont}`; | ||
if (this.params.theme?.serifFont) | ||
finalTheme.serifFont = `"${this.params.theme.serifFont}", ${DEFAULT_THEME.serifFont}`; | ||
return finalTheme; | ||
} | ||
get cssArray() { | ||
return this.params.cssArray || []; | ||
} | ||
get class() { | ||
return (0, css_1.css)(...this.cssArray); | ||
} | ||
_gethash(obj) { | ||
// const itemIndex = this._hashcache.indexOf(obj); | ||
@@ -122,674 +94,670 @@ // if (itemIndex !== -1) { | ||
// console.log(`hash: ${hash}`); | ||
var newhash = object_hash_1.default(obj); | ||
const newhash = (0, object_hash_1.default)(obj); | ||
// this._hashcache.push({ obj, hash: newhash }); | ||
return newhash; | ||
// } | ||
}; | ||
GwenBase.prototype.reset = function () { | ||
} | ||
reset() { | ||
if (this._cache['__clear']) { | ||
return this._cache['__clear']; | ||
} | ||
var newInstance = new this.constructor(__assign(__assign({}, this.params), { cssArray: [] })); | ||
const newInstance = new this.constructor({ | ||
...this.params, | ||
cssArray: [], | ||
}); | ||
this._cache['__clear'] = newInstance; | ||
return newInstance; | ||
}; | ||
GwenBase.prototype.css = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
var hashKey = this._gethash(args); | ||
} | ||
css(...args) { | ||
const hashKey = this._gethash(args); | ||
if (this._cache[hashKey]) { | ||
return this._cache[hashKey]; | ||
} | ||
var newInstance = new this.constructor(__assign(__assign({}, this.params), { cssArray: __spreadArrays(this.cssArray, args) })); | ||
const newInstance = new this.constructor({ | ||
...this.params, | ||
cssArray: [...this.cssArray, ...args], | ||
}); | ||
this._cache[hashKey] = newInstance; | ||
return newInstance; | ||
}; | ||
GwenBase.prototype.mix = function () { | ||
var args = []; | ||
for (var _i = 0; _i < arguments.length; _i++) { | ||
args[_i] = arguments[_i]; | ||
} | ||
mix(...args) { | ||
let mixedCss = []; | ||
for (const arg of args) { | ||
mixedCss = [...mixedCss, ...arg.cssArray]; | ||
} | ||
var mixedCss = []; | ||
for (var _a = 0, args_1 = args; _a < args_1.length; _a++) { | ||
var arg = args_1[_a]; | ||
mixedCss = __spreadArrays(mixedCss, arg.cssArray); | ||
} | ||
return this.css(mixedCss); | ||
}; | ||
GwenBase.prototype.alignContent = function (arg) { | ||
} | ||
alignContent(arg) { | ||
return this.css({ alignContent: arg }); | ||
}; | ||
GwenBase.prototype.alignItems = function (arg) { | ||
} | ||
alignItems(arg) { | ||
return this.css({ alignItems: arg }); | ||
}; | ||
GwenBase.prototype.alignSelf = function (arg) { | ||
} | ||
alignSelf(arg) { | ||
return this.css({ alignSelf: arg }); | ||
}; | ||
GwenBase.prototype.all = function (arg) { | ||
} | ||
all(arg) { | ||
return this.css({ all: arg }); | ||
}; | ||
GwenBase.prototype.animation = function (arg) { | ||
} | ||
animation(arg) { | ||
return this.css({ animation: arg }); | ||
}; | ||
GwenBase.prototype.animationDelay = function (arg) { | ||
} | ||
animationDelay(arg) { | ||
return this.css({ animationDelay: arg }); | ||
}; | ||
GwenBase.prototype.animationDirection = function (arg) { | ||
} | ||
animationDirection(arg) { | ||
return this.css({ animationDirection: arg }); | ||
}; | ||
GwenBase.prototype.animationDuration = function (arg) { | ||
} | ||
animationDuration(arg) { | ||
return this.css({ animationDuration: arg }); | ||
}; | ||
GwenBase.prototype.animationFillMode = function (arg) { | ||
} | ||
animationFillMode(arg) { | ||
return this.css({ animationFillMode: arg }); | ||
}; | ||
GwenBase.prototype.animationIterationCount = function (arg) { | ||
} | ||
animationIterationCount(arg) { | ||
return this.css({ animationIterationCount: arg }); | ||
}; | ||
GwenBase.prototype.animationName = function (arg) { | ||
} | ||
animationName(arg) { | ||
return this.css({ animationName: arg }); | ||
}; | ||
GwenBase.prototype.animationPlayState = function (arg) { | ||
} | ||
animationPlayState(arg) { | ||
return this.css({ animationPlayState: arg }); | ||
}; | ||
GwenBase.prototype.animationTimingFunction = function (arg) { | ||
} | ||
animationTimingFunction(arg) { | ||
return this.css({ animationTimingFunction: arg }); | ||
}; | ||
GwenBase.prototype.backfaceVisibility = function (arg) { | ||
} | ||
backfaceVisibility(arg) { | ||
return this.css({ backfaceVisibility: arg }); | ||
}; | ||
GwenBase.prototype.background = function (arg) { | ||
} | ||
background(arg) { | ||
return this.css({ background: arg }); | ||
}; | ||
GwenBase.prototype.backgroundAttachment = function (arg) { | ||
} | ||
backgroundAttachment(arg) { | ||
return this.css({ backgroundAttachment: arg }); | ||
}; | ||
GwenBase.prototype.backgroundBlendMode = function (arg) { | ||
} | ||
backgroundBlendMode(arg) { | ||
return this.css({ backgroundBlendMode: arg }); | ||
}; | ||
GwenBase.prototype.backgroundClip = function (arg) { | ||
} | ||
backgroundClip(arg) { | ||
return this.css({ backgroundClip: arg }); | ||
}; | ||
GwenBase.prototype.backgroundColor = function (arg) { | ||
} | ||
backgroundColor(arg) { | ||
return this.css({ backgroundColor: arg }); | ||
}; | ||
GwenBase.prototype.backgroundImage = function (arg) { | ||
} | ||
backgroundImage(arg) { | ||
return this.css({ backgroundImage: arg }); | ||
}; | ||
GwenBase.prototype.backgroundOrigin = function (arg) { | ||
} | ||
backgroundOrigin(arg) { | ||
return this.css({ backgroundOrigin: arg }); | ||
}; | ||
GwenBase.prototype.backgroundPosition = function (arg) { | ||
} | ||
backgroundPosition(arg) { | ||
return this.css({ backgroundPosition: arg }); | ||
}; | ||
GwenBase.prototype.backgroundRepeat = function (arg) { | ||
} | ||
backgroundRepeat(arg) { | ||
return this.css({ backgroundRepeat: arg }); | ||
}; | ||
GwenBase.prototype.backgroundSize = function (arg) { | ||
} | ||
backgroundSize(arg) { | ||
return this.css({ backgroundSize: arg }); | ||
}; | ||
GwenBase.prototype.border = function (arg) { | ||
} | ||
border(arg) { | ||
return this.css({ border: arg }); | ||
}; | ||
GwenBase.prototype.borderBottom = function (arg) { | ||
} | ||
borderBottom(arg) { | ||
return this.css({ borderBottom: arg }); | ||
}; | ||
GwenBase.prototype.borderBottomColor = function (arg) { | ||
} | ||
borderBottomColor(arg) { | ||
return this.css({ borderBottomColor: arg }); | ||
}; | ||
GwenBase.prototype.borderBottomLeftRadius = function (arg) { | ||
} | ||
borderBottomLeftRadius(arg) { | ||
return this.css({ borderBottomLeftRadius: arg }); | ||
}; | ||
GwenBase.prototype.borderBottomRightRadius = function (arg) { | ||
} | ||
borderBottomRightRadius(arg) { | ||
return this.css({ borderBottomRightRadius: arg }); | ||
}; | ||
GwenBase.prototype.borderBottomStyle = function (arg) { | ||
} | ||
borderBottomStyle(arg) { | ||
return this.css({ borderBottomStyle: arg }); | ||
}; | ||
GwenBase.prototype.borderBottomWidth = function (arg) { | ||
} | ||
borderBottomWidth(arg) { | ||
return this.css({ borderBottomWidth: arg }); | ||
}; | ||
GwenBase.prototype.borderCollapse = function (arg) { | ||
} | ||
borderCollapse(arg) { | ||
return this.css({ borderCollapse: arg }); | ||
}; | ||
GwenBase.prototype.borderColor = function (arg) { | ||
} | ||
borderColor(arg) { | ||
return this.css({ borderColor: arg }); | ||
}; | ||
GwenBase.prototype.borderImage = function (arg) { | ||
} | ||
borderImage(arg) { | ||
return this.css({ borderImage: arg }); | ||
}; | ||
GwenBase.prototype.borderImageOutset = function (arg) { | ||
} | ||
borderImageOutset(arg) { | ||
return this.css({ borderImageOutset: arg }); | ||
}; | ||
GwenBase.prototype.borderImageRepeat = function (arg) { | ||
} | ||
borderImageRepeat(arg) { | ||
return this.css({ borderImageRepeat: arg }); | ||
}; | ||
GwenBase.prototype.borderImageSlice = function (arg) { | ||
} | ||
borderImageSlice(arg) { | ||
return this.css({ borderImageSlice: arg }); | ||
}; | ||
GwenBase.prototype.borderImageSource = function (arg) { | ||
} | ||
borderImageSource(arg) { | ||
return this.css({ borderImageSource: arg }); | ||
}; | ||
GwenBase.prototype.borderImageWidth = function (arg) { | ||
} | ||
borderImageWidth(arg) { | ||
return this.css({ borderImageWidth: arg }); | ||
}; | ||
GwenBase.prototype.borderLeft = function (arg) { | ||
} | ||
borderLeft(arg) { | ||
return this.css({ borderLeft: arg }); | ||
}; | ||
GwenBase.prototype.borderLeftColor = function (arg) { | ||
} | ||
borderLeftColor(arg) { | ||
return this.css({ borderLeftColor: arg }); | ||
}; | ||
GwenBase.prototype.borderLeftStyle = function (arg) { | ||
} | ||
borderLeftStyle(arg) { | ||
return this.css({ borderLeftStyle: arg }); | ||
}; | ||
GwenBase.prototype.borderLeftWidth = function (arg) { | ||
} | ||
borderLeftWidth(arg) { | ||
return this.css({ borderLeftWidth: arg }); | ||
}; | ||
GwenBase.prototype.borderRadius = function (arg) { | ||
} | ||
borderRadius(arg) { | ||
return this.css({ borderRadius: arg }); | ||
}; | ||
GwenBase.prototype.borderRight = function (arg) { | ||
} | ||
borderRight(arg) { | ||
return this.css({ borderRight: arg }); | ||
}; | ||
GwenBase.prototype.borderRightColor = function (arg) { | ||
} | ||
borderRightColor(arg) { | ||
return this.css({ borderRightColor: arg }); | ||
}; | ||
GwenBase.prototype.borderRightStyle = function (arg) { | ||
} | ||
borderRightStyle(arg) { | ||
return this.css({ borderRightStyle: arg }); | ||
}; | ||
GwenBase.prototype.borderRightWidth = function (arg) { | ||
} | ||
borderRightWidth(arg) { | ||
return this.css({ borderRightWidth: arg }); | ||
}; | ||
GwenBase.prototype.borderSpacing = function (arg) { | ||
} | ||
borderSpacing(arg) { | ||
return this.css({ borderSpacing: arg }); | ||
}; | ||
GwenBase.prototype.borderStyle = function (arg) { | ||
} | ||
borderStyle(arg) { | ||
return this.css({ borderStyle: arg }); | ||
}; | ||
GwenBase.prototype.borderTop = function (arg) { | ||
} | ||
borderTop(arg) { | ||
return this.css({ borderTop: arg }); | ||
}; | ||
GwenBase.prototype.borderTopColor = function (arg) { | ||
} | ||
borderTopColor(arg) { | ||
return this.css({ borderTopColor: arg }); | ||
}; | ||
GwenBase.prototype.borderTopLeftRadius = function (arg) { | ||
} | ||
borderTopLeftRadius(arg) { | ||
return this.css({ borderTopLeftRadius: arg }); | ||
}; | ||
GwenBase.prototype.borderTopRightRadius = function (arg) { | ||
} | ||
borderTopRightRadius(arg) { | ||
return this.css({ borderTopRightRadius: arg }); | ||
}; | ||
GwenBase.prototype.borderTopStyle = function (arg) { | ||
} | ||
borderTopStyle(arg) { | ||
return this.css({ borderTopStyle: arg }); | ||
}; | ||
GwenBase.prototype.borderTopWidth = function (arg) { | ||
} | ||
borderTopWidth(arg) { | ||
return this.css({ borderTopWidth: arg }); | ||
}; | ||
GwenBase.prototype.borderWidth = function (arg) { | ||
} | ||
borderWidth(arg) { | ||
return this.css({ borderWidth: arg }); | ||
}; | ||
GwenBase.prototype.bottom = function (arg) { | ||
} | ||
bottom(arg) { | ||
return this.css({ bottom: arg }); | ||
}; | ||
GwenBase.prototype.boxDecorationBreak = function (arg) { | ||
} | ||
boxDecorationBreak(arg) { | ||
return this.css({ boxDecorationBreak: arg }); | ||
}; | ||
GwenBase.prototype.boxShadow = function (arg) { | ||
} | ||
boxShadow(arg) { | ||
return this.css({ boxShadow: arg }); | ||
}; | ||
GwenBase.prototype.boxSizing = function (arg) { | ||
} | ||
boxSizing(arg) { | ||
return this.css({ boxSizing: arg }); | ||
}; | ||
GwenBase.prototype.breakAfter = function (arg) { | ||
} | ||
breakAfter(arg) { | ||
return this.css({ breakAfter: arg }); | ||
}; | ||
GwenBase.prototype.breakBefore = function (arg) { | ||
} | ||
breakBefore(arg) { | ||
return this.css({ breakBefore: arg }); | ||
}; | ||
GwenBase.prototype.breakInside = function (arg) { | ||
} | ||
breakInside(arg) { | ||
return this.css({ breakInside: arg }); | ||
}; | ||
GwenBase.prototype.captionSide = function (arg) { | ||
} | ||
captionSide(arg) { | ||
return this.css({ captionSide: arg }); | ||
}; | ||
GwenBase.prototype.caretColor = function (arg) { | ||
} | ||
caretColor(arg) { | ||
return this.css({ caretColor: arg }); | ||
}; | ||
GwenBase.prototype.cha = function (arg) { | ||
} | ||
cha(arg) { | ||
return this.css({ cha: arg }); | ||
}; | ||
GwenBase.prototype.clear = function (arg) { | ||
} | ||
clear(arg) { | ||
return this.css({ clear: arg }); | ||
}; | ||
GwenBase.prototype.clip = function (arg) { | ||
} | ||
clip(arg) { | ||
return this.css({ clip: arg }); | ||
}; | ||
GwenBase.prototype.clipPath = function (arg) { | ||
} | ||
clipPath(arg) { | ||
return this.css({ clipPath: arg }); | ||
}; | ||
GwenBase.prototype.color = function (arg) { | ||
} | ||
color(arg) { | ||
return this.css({ color: arg }); | ||
}; | ||
GwenBase.prototype.columnCount = function (arg) { | ||
} | ||
columnCount(arg) { | ||
return this.css({ columnCount: arg }); | ||
}; | ||
GwenBase.prototype.columnFill = function (arg) { | ||
} | ||
columnFill(arg) { | ||
return this.css({ columnFill: arg }); | ||
}; | ||
GwenBase.prototype.columnGap = function (arg) { | ||
} | ||
columnGap(arg) { | ||
return this.css({ columnGap: arg }); | ||
}; | ||
GwenBase.prototype.columnRule = function (arg) { | ||
} | ||
columnRule(arg) { | ||
return this.css({ columnRule: arg }); | ||
}; | ||
GwenBase.prototype.columnRuleColor = function (arg) { | ||
} | ||
columnRuleColor(arg) { | ||
return this.css({ columnRuleColor: arg }); | ||
}; | ||
GwenBase.prototype.columnRuleStyle = function (arg) { | ||
} | ||
columnRuleStyle(arg) { | ||
return this.css({ columnRuleStyle: arg }); | ||
}; | ||
GwenBase.prototype.columnRuleWidth = function (arg) { | ||
} | ||
columnRuleWidth(arg) { | ||
return this.css({ columnRuleWidth: arg }); | ||
}; | ||
GwenBase.prototype.columnSpan = function (arg) { | ||
} | ||
columnSpan(arg) { | ||
return this.css({ columnSpan: arg }); | ||
}; | ||
GwenBase.prototype.columnWidth = function (arg) { | ||
} | ||
columnWidth(arg) { | ||
return this.css({ columnWidth: arg }); | ||
}; | ||
GwenBase.prototype.columns = function (arg) { | ||
} | ||
columns(arg) { | ||
return this.css({ columns: arg }); | ||
}; | ||
GwenBase.prototype.content = function (arg) { | ||
} | ||
content(arg) { | ||
return this.css({ content: arg }); | ||
}; | ||
GwenBase.prototype.counterIncrement = function (arg) { | ||
} | ||
counterIncrement(arg) { | ||
return this.css({ counterIncrement: arg }); | ||
}; | ||
GwenBase.prototype.counterReset = function (arg) { | ||
} | ||
counterReset(arg) { | ||
return this.css({ counterReset: arg }); | ||
}; | ||
GwenBase.prototype.cursor = function (arg) { | ||
} | ||
cursor(arg) { | ||
return this.css({ cursor: arg }); | ||
}; | ||
GwenBase.prototype.direction = function (arg) { | ||
} | ||
direction(arg) { | ||
return this.css({ direction: arg }); | ||
}; | ||
GwenBase.prototype.display = function (arg) { | ||
} | ||
display(arg) { | ||
return this.css({ display: arg }); | ||
}; | ||
GwenBase.prototype.emptyCells = function (arg) { | ||
} | ||
emptyCells(arg) { | ||
return this.css({ emptyCells: arg }); | ||
}; | ||
GwenBase.prototype.filter = function (arg) { | ||
} | ||
filter(arg) { | ||
return this.css({ filter: arg }); | ||
}; | ||
GwenBase.prototype.flex = function (arg) { | ||
} | ||
flex(arg) { | ||
return this.css({ flex: arg }); | ||
}; | ||
GwenBase.prototype.flexBasis = function (arg) { | ||
} | ||
flexBasis(arg) { | ||
return this.css({ flexBasis: arg }); | ||
}; | ||
GwenBase.prototype.flexDirection = function (arg) { | ||
} | ||
flexDirection(arg) { | ||
return this.css({ flexDirection: arg }); | ||
}; | ||
GwenBase.prototype.flexFlow = function (arg) { | ||
} | ||
flexFlow(arg) { | ||
return this.css({ flexFlow: arg }); | ||
}; | ||
GwenBase.prototype.flexGrow = function (arg) { | ||
} | ||
flexGrow(arg) { | ||
return this.css({ flexGrow: arg }); | ||
}; | ||
GwenBase.prototype.flexShrink = function (arg) { | ||
} | ||
flexShrink(arg) { | ||
return this.css({ flexShrink: arg }); | ||
}; | ||
GwenBase.prototype.flexWrap = function (arg) { | ||
} | ||
flexWrap(arg) { | ||
return this.css({ flexWrap: arg }); | ||
}; | ||
GwenBase.prototype.float = function (arg) { | ||
} | ||
float(arg) { | ||
return this.css({ float: arg }); | ||
}; | ||
GwenBase.prototype.font = function (arg) { | ||
} | ||
font(arg) { | ||
return this.css({ font: arg }); | ||
}; | ||
GwenBase.prototype.fontFace = function (arg) { | ||
} | ||
fontFace(arg) { | ||
return this.css({ fontFace: arg }); | ||
}; | ||
GwenBase.prototype.fontFamily = function (arg) { | ||
} | ||
fontFamily(arg) { | ||
return this.css({ fontFamily: arg }); | ||
}; | ||
GwenBase.prototype.fontFeatureSettings = function (arg) { | ||
} | ||
fontFeatureSettings(arg) { | ||
return this.css({ fontFeatureSettings: arg }); | ||
}; | ||
GwenBase.prototype.fontKerning = function (arg) { | ||
} | ||
fontKerning(arg) { | ||
return this.css({ fontKerning: arg }); | ||
}; | ||
GwenBase.prototype.fontSize = function (arg) { | ||
} | ||
fontSize(arg) { | ||
return this.css({ fontSize: arg }); | ||
}; | ||
GwenBase.prototype.fontSizeAdjust = function (arg) { | ||
} | ||
fontSizeAdjust(arg) { | ||
return this.css({ fontSizeAdjust: arg }); | ||
}; | ||
GwenBase.prototype.fontStretch = function (arg) { | ||
} | ||
fontStretch(arg) { | ||
return this.css({ fontStretch: arg }); | ||
}; | ||
GwenBase.prototype.fontStyle = function (arg) { | ||
} | ||
fontStyle(arg) { | ||
return this.css({ fontStyle: arg }); | ||
}; | ||
GwenBase.prototype.fontVariant = function (arg) { | ||
} | ||
fontVariant(arg) { | ||
return this.css({ fontVariant: arg }); | ||
}; | ||
GwenBase.prototype.fontVariantCaps = function (arg) { | ||
} | ||
fontVariantCaps(arg) { | ||
return this.css({ fontVariantCaps: arg }); | ||
}; | ||
GwenBase.prototype.fontWeight = function (arg) { | ||
} | ||
fontWeight(arg) { | ||
return this.css({ fontWeight: arg }); | ||
}; | ||
GwenBase.prototype.grid = function (arg) { | ||
} | ||
grid(arg) { | ||
return this.css({ grid: arg }); | ||
}; | ||
GwenBase.prototype.gridArea = function (arg) { | ||
} | ||
gridArea(arg) { | ||
return this.css({ gridArea: arg }); | ||
}; | ||
GwenBase.prototype.gridAutoColumns = function (arg) { | ||
} | ||
gridAutoColumns(arg) { | ||
return this.css({ gridAutoColumns: arg }); | ||
}; | ||
GwenBase.prototype.gridAutoFlow = function (arg) { | ||
} | ||
gridAutoFlow(arg) { | ||
return this.css({ gridAutoFlow: arg }); | ||
}; | ||
GwenBase.prototype.gridAutoRows = function (arg) { | ||
} | ||
gridAutoRows(arg) { | ||
return this.css({ gridAutoRows: arg }); | ||
}; | ||
GwenBase.prototype.gridColumn = function (arg) { | ||
} | ||
gridColumn(arg) { | ||
return this.css({ gridColumn: arg }); | ||
}; | ||
GwenBase.prototype.gridColumnEnd = function (arg) { | ||
} | ||
gridColumnEnd(arg) { | ||
return this.css({ gridColumnEnd: arg }); | ||
}; | ||
GwenBase.prototype.gridColumnGap = function (arg) { | ||
} | ||
gridColumnGap(arg) { | ||
return this.css({ gridColumnGap: arg }); | ||
}; | ||
GwenBase.prototype.gridColumnStart = function (arg) { | ||
} | ||
gridColumnStart(arg) { | ||
return this.css({ gridColumnStart: arg }); | ||
}; | ||
GwenBase.prototype.gridGap = function (arg) { | ||
} | ||
gridGap(arg) { | ||
return this.css({ gridGap: arg }); | ||
}; | ||
GwenBase.prototype.gridRow = function (arg) { | ||
} | ||
gridRow(arg) { | ||
return this.css({ gridRow: arg }); | ||
}; | ||
GwenBase.prototype.gridRowEnd = function (arg) { | ||
} | ||
gridRowEnd(arg) { | ||
return this.css({ gridRowEnd: arg }); | ||
}; | ||
GwenBase.prototype.gridRowGap = function (arg) { | ||
} | ||
gridRowGap(arg) { | ||
return this.css({ gridRowGap: arg }); | ||
}; | ||
GwenBase.prototype.gridRowStart = function (arg) { | ||
} | ||
gridRowStart(arg) { | ||
return this.css({ gridRowStart: arg }); | ||
}; | ||
GwenBase.prototype.gridTemplate = function (arg) { | ||
} | ||
gridTemplate(arg) { | ||
return this.css({ gridTemplate: arg }); | ||
}; | ||
GwenBase.prototype.gridTemplateAreas = function (arg) { | ||
} | ||
gridTemplateAreas(arg) { | ||
return this.css({ gridTemplateAreas: arg }); | ||
}; | ||
GwenBase.prototype.gridTemplateColumns = function (arg) { | ||
} | ||
gridTemplateColumns(arg) { | ||
return this.css({ gridTemplateColumns: arg }); | ||
}; | ||
GwenBase.prototype.gridTemplateRows = function (arg) { | ||
} | ||
gridTemplateRows(arg) { | ||
return this.css({ gridTemplateRows: arg }); | ||
}; | ||
GwenBase.prototype.hangingPunctuation = function (arg) { | ||
} | ||
hangingPunctuation(arg) { | ||
return this.css({ hangingPunctuation: arg }); | ||
}; | ||
GwenBase.prototype.height = function (arg) { | ||
} | ||
height(arg) { | ||
return this.css({ height: arg }); | ||
}; | ||
GwenBase.prototype.hyphens = function (arg) { | ||
} | ||
hyphens(arg) { | ||
return this.css({ hyphens: arg }); | ||
}; | ||
GwenBase.prototype.isolation = function (arg) { | ||
} | ||
isolation(arg) { | ||
return this.css({ isolation: arg }); | ||
}; | ||
GwenBase.prototype.justifyContent = function (arg) { | ||
} | ||
justifyContent(arg) { | ||
return this.css({ justifyContent: arg }); | ||
}; | ||
GwenBase.prototype.left = function (arg) { | ||
} | ||
left(arg) { | ||
return this.css({ left: arg }); | ||
}; | ||
GwenBase.prototype.letterSpacing = function (arg) { | ||
} | ||
letterSpacing(arg) { | ||
return this.css({ letterSpacing: arg }); | ||
}; | ||
GwenBase.prototype.lineHeight = function (arg) { | ||
} | ||
lineHeight(arg) { | ||
return this.css({ lineHeight: arg }); | ||
}; | ||
GwenBase.prototype.listStyle = function (arg) { | ||
} | ||
listStyle(arg) { | ||
return this.css({ listStyle: arg }); | ||
}; | ||
GwenBase.prototype.listStyleImage = function (arg) { | ||
} | ||
listStyleImage(arg) { | ||
return this.css({ listStyleImage: arg }); | ||
}; | ||
GwenBase.prototype.listStylePosition = function (arg) { | ||
} | ||
listStylePosition(arg) { | ||
return this.css({ listStylePosition: arg }); | ||
}; | ||
GwenBase.prototype.listStyleType = function (arg) { | ||
} | ||
listStyleType(arg) { | ||
return this.css({ listStyleType: arg }); | ||
}; | ||
GwenBase.prototype.margin = function (arg) { | ||
} | ||
margin(arg) { | ||
return this.css({ margin: arg }); | ||
}; | ||
GwenBase.prototype.marginBottom = function (arg) { | ||
} | ||
marginBottom(arg) { | ||
return this.css({ marginBottom: arg }); | ||
}; | ||
GwenBase.prototype.marginLeft = function (arg) { | ||
} | ||
marginLeft(arg) { | ||
return this.css({ marginLeft: arg }); | ||
}; | ||
GwenBase.prototype.marginRight = function (arg) { | ||
} | ||
marginRight(arg) { | ||
return this.css({ marginRight: arg }); | ||
}; | ||
GwenBase.prototype.marginTop = function (arg) { | ||
} | ||
marginTop(arg) { | ||
return this.css({ marginTop: arg }); | ||
}; | ||
GwenBase.prototype.maxHeight = function (arg) { | ||
} | ||
maxHeight(arg) { | ||
return this.css({ maxHeight: arg }); | ||
}; | ||
GwenBase.prototype.maxWidth = function (arg) { | ||
} | ||
maxWidth(arg) { | ||
return this.css({ maxWidth: arg }); | ||
}; | ||
GwenBase.prototype.minHeight = function (arg) { | ||
} | ||
minHeight(arg) { | ||
return this.css({ minHeight: arg }); | ||
}; | ||
GwenBase.prototype.minWidth = function (arg) { | ||
} | ||
minWidth(arg) { | ||
return this.css({ minWidth: arg }); | ||
}; | ||
GwenBase.prototype.mixBlendMode = function (arg) { | ||
} | ||
mixBlendMode(arg) { | ||
return this.css({ mixBlendMode: arg }); | ||
}; | ||
GwenBase.prototype.objectFit = function (arg) { | ||
} | ||
objectFit(arg) { | ||
return this.css({ objectFit: arg }); | ||
}; | ||
GwenBase.prototype.objectPosition = function (arg) { | ||
} | ||
objectPosition(arg) { | ||
return this.css({ objectPosition: arg }); | ||
}; | ||
GwenBase.prototype.opacity = function (arg) { | ||
} | ||
opacity(arg) { | ||
return this.css({ opacity: arg }); | ||
}; | ||
GwenBase.prototype.order = function (arg) { | ||
} | ||
order(arg) { | ||
return this.css({ order: arg }); | ||
}; | ||
GwenBase.prototype.outline = function (arg) { | ||
} | ||
outline(arg) { | ||
return this.css({ outline: arg }); | ||
}; | ||
GwenBase.prototype.outlineColor = function (arg) { | ||
} | ||
outlineColor(arg) { | ||
return this.css({ outlineColor: arg }); | ||
}; | ||
GwenBase.prototype.outlineOffset = function (arg) { | ||
} | ||
outlineOffset(arg) { | ||
return this.css({ outlineOffset: arg }); | ||
}; | ||
GwenBase.prototype.outlineStyle = function (arg) { | ||
} | ||
outlineStyle(arg) { | ||
return this.css({ outlineStyle: arg }); | ||
}; | ||
GwenBase.prototype.outlineWidth = function (arg) { | ||
} | ||
outlineWidth(arg) { | ||
return this.css({ outlineWidth: arg }); | ||
}; | ||
GwenBase.prototype.overflow = function (arg) { | ||
} | ||
overflow(arg) { | ||
return this.css({ overflow: arg }); | ||
}; | ||
GwenBase.prototype.overflowX = function (arg) { | ||
} | ||
overflowX(arg) { | ||
return this.css({ overflowX: arg }); | ||
}; | ||
GwenBase.prototype.overflowY = function (arg) { | ||
} | ||
overflowY(arg) { | ||
return this.css({ overflowY: arg }); | ||
}; | ||
GwenBase.prototype.padding = function (arg) { | ||
} | ||
padding(arg) { | ||
return this.css({ padding: arg }); | ||
}; | ||
GwenBase.prototype.paddingBottom = function (arg) { | ||
} | ||
paddingBottom(arg) { | ||
return this.css({ paddingBottom: arg }); | ||
}; | ||
GwenBase.prototype.paddingLeft = function (arg) { | ||
} | ||
paddingLeft(arg) { | ||
return this.css({ paddingLeft: arg }); | ||
}; | ||
GwenBase.prototype.paddingRight = function (arg) { | ||
} | ||
paddingRight(arg) { | ||
return this.css({ paddingRight: arg }); | ||
}; | ||
GwenBase.prototype.paddingTop = function (arg) { | ||
} | ||
paddingTop(arg) { | ||
return this.css({ paddingTop: arg }); | ||
}; | ||
GwenBase.prototype.pageBreakAfter = function (arg) { | ||
} | ||
pageBreakAfter(arg) { | ||
return this.css({ pageBreakAfter: arg }); | ||
}; | ||
GwenBase.prototype.pageBreakBefore = function (arg) { | ||
} | ||
pageBreakBefore(arg) { | ||
return this.css({ pageBreakBefore: arg }); | ||
}; | ||
GwenBase.prototype.pageBreakInside = function (arg) { | ||
} | ||
pageBreakInside(arg) { | ||
return this.css({ pageBreakInside: arg }); | ||
}; | ||
GwenBase.prototype.perspective = function (arg) { | ||
} | ||
perspective(arg) { | ||
return this.css({ perspective: arg }); | ||
}; | ||
GwenBase.prototype.perspectiveOrigin = function (arg) { | ||
} | ||
perspectiveOrigin(arg) { | ||
return this.css({ perspectiveOrigin: arg }); | ||
}; | ||
GwenBase.prototype.pointerEvents = function (arg) { | ||
} | ||
pointerEvents(arg) { | ||
return this.css({ pointerEvents: arg }); | ||
}; | ||
GwenBase.prototype.position = function (arg) { | ||
} | ||
position(arg) { | ||
return this.css({ position: arg }); | ||
}; | ||
GwenBase.prototype.quotes = function (arg) { | ||
} | ||
quotes(arg) { | ||
return this.css({ quotes: arg }); | ||
}; | ||
GwenBase.prototype.resize = function (arg) { | ||
} | ||
resize(arg) { | ||
return this.css({ resize: arg }); | ||
}; | ||
GwenBase.prototype.right = function (arg) { | ||
} | ||
right(arg) { | ||
return this.css({ right: arg }); | ||
}; | ||
GwenBase.prototype.scrollBehavior = function (arg) { | ||
} | ||
scrollBehavior(arg) { | ||
return this.css({ scrollBehavior: arg }); | ||
}; | ||
GwenBase.prototype.tabSize = function (arg) { | ||
} | ||
tabSize(arg) { | ||
return this.css({ tabSize: arg }); | ||
}; | ||
GwenBase.prototype.tableLayout = function (arg) { | ||
} | ||
tableLayout(arg) { | ||
return this.css({ tableLayout: arg }); | ||
}; | ||
GwenBase.prototype.textAlign = function (arg) { | ||
} | ||
textAlign(arg) { | ||
return this.css({ textAlign: arg }); | ||
}; | ||
GwenBase.prototype.textAlignLast = function (arg) { | ||
} | ||
textAlignLast(arg) { | ||
return this.css({ textAlignLast: arg }); | ||
}; | ||
GwenBase.prototype.textDecoration = function (arg) { | ||
} | ||
textDecoration(arg) { | ||
return this.css({ textDecoration: arg }); | ||
}; | ||
GwenBase.prototype.textDecorationColor = function (arg) { | ||
} | ||
textDecorationColor(arg) { | ||
return this.css({ textDecorationColor: arg }); | ||
}; | ||
GwenBase.prototype.textDecorationLine = function (arg) { | ||
} | ||
textDecorationLine(arg) { | ||
return this.css({ textDecorationLine: arg }); | ||
}; | ||
GwenBase.prototype.textDecorationStyle = function (arg) { | ||
} | ||
textDecorationStyle(arg) { | ||
return this.css({ textDecorationStyle: arg }); | ||
}; | ||
GwenBase.prototype.textIndent = function (arg) { | ||
} | ||
textIndent(arg) { | ||
return this.css({ textIndent: arg }); | ||
}; | ||
GwenBase.prototype.textJustify = function (arg) { | ||
} | ||
textJustify(arg) { | ||
return this.css({ textJustify: arg }); | ||
}; | ||
GwenBase.prototype.textOverflow = function (arg) { | ||
} | ||
textOverflow(arg) { | ||
return this.css({ textOverflow: arg }); | ||
}; | ||
GwenBase.prototype.textShadow = function (arg) { | ||
} | ||
textShadow(arg) { | ||
return this.css({ textShadow: arg }); | ||
}; | ||
GwenBase.prototype.textTransform = function (arg) { | ||
} | ||
textTransform(arg) { | ||
return this.css({ textTransform: arg }); | ||
}; | ||
GwenBase.prototype.top = function (arg) { | ||
} | ||
top(arg) { | ||
return this.css({ top: arg }); | ||
}; | ||
GwenBase.prototype.transform = function (arg) { | ||
} | ||
transform(arg) { | ||
return this.css({ transform: arg }); | ||
}; | ||
GwenBase.prototype.transformOrigin = function (arg) { | ||
} | ||
transformOrigin(arg) { | ||
return this.css({ transformOrigin: arg }); | ||
}; | ||
GwenBase.prototype.transformStyle = function (arg) { | ||
} | ||
transformStyle(arg) { | ||
return this.css({ transformStyle: arg }); | ||
}; | ||
GwenBase.prototype.transition = function (arg) { | ||
} | ||
transition(arg) { | ||
return this.css({ transition: arg }); | ||
}; | ||
GwenBase.prototype.transitionDelay = function (arg) { | ||
} | ||
transitionDelay(arg) { | ||
return this.css({ transitionDelay: arg }); | ||
}; | ||
GwenBase.prototype.transitionDuration = function (arg) { | ||
} | ||
transitionDuration(arg) { | ||
return this.css({ transitionDuration: arg }); | ||
}; | ||
GwenBase.prototype.transitionProperty = function (arg) { | ||
} | ||
transitionProperty(arg) { | ||
return this.css({ transitionProperty: arg }); | ||
}; | ||
GwenBase.prototype.transitionTimingFunction = function (arg) { | ||
} | ||
transitionTimingFunction(arg) { | ||
return this.css({ transitionTimingFunction: arg }); | ||
}; | ||
GwenBase.prototype.unicodeBidi = function (arg) { | ||
} | ||
unicodeBidi(arg) { | ||
return this.css({ unicodeBidi: arg }); | ||
}; | ||
GwenBase.prototype.userSelect = function (arg) { | ||
} | ||
userSelect(arg) { | ||
return this.css({ userSelect: arg }); | ||
}; | ||
GwenBase.prototype.verticalAlign = function (arg) { | ||
} | ||
verticalAlign(arg) { | ||
return this.css({ verticalAlign: arg }); | ||
}; | ||
GwenBase.prototype.visibility = function (arg) { | ||
} | ||
visibility(arg) { | ||
return this.css({ visibility: arg }); | ||
}; | ||
GwenBase.prototype.whiteSpace = function (arg) { | ||
} | ||
whiteSpace(arg) { | ||
return this.css({ whiteSpace: arg }); | ||
}; | ||
GwenBase.prototype.width = function (arg) { | ||
} | ||
width(arg) { | ||
return this.css({ width: arg }); | ||
}; | ||
GwenBase.prototype.wordBreak = function (arg) { | ||
} | ||
wordBreak(arg) { | ||
return this.css({ wordBreak: arg }); | ||
}; | ||
GwenBase.prototype.wordSpacing = function (arg) { | ||
} | ||
wordSpacing(arg) { | ||
return this.css({ wordSpacing: arg }); | ||
}; | ||
GwenBase.prototype.wordWrap = function (arg) { | ||
} | ||
wordWrap(arg) { | ||
return this.css({ wordWrap: arg }); | ||
}; | ||
GwenBase.prototype.writingMode = function (arg) { | ||
} | ||
writingMode(arg) { | ||
return this.css({ writingMode: arg }); | ||
}; | ||
GwenBase.prototype.zIndex = function (arg) { | ||
} | ||
zIndex(arg) { | ||
return this.css({ zIndex: arg }); | ||
}; | ||
GwenBase.css = css_1.css; | ||
return GwenBase; | ||
}()); | ||
} | ||
} | ||
exports.GwenBase = GwenBase; | ||
GwenBase.css = css_1.css; | ||
//# sourceMappingURL=GwenBase.js.map |
"use strict"; | ||
function __export(m) { | ||
for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p]; | ||
} | ||
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) { | ||
if (k2 === undefined) k2 = k; | ||
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } }); | ||
}) : (function(o, m, k, k2) { | ||
if (k2 === undefined) k2 = k; | ||
o[k2] = m[k]; | ||
})); | ||
var __exportStar = (this && this.__exportStar) || function(m, exports) { | ||
for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p); | ||
}; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
// import * as gwen from './external'; | ||
__export(require("./external")); | ||
// export { gwen }; | ||
__exportStar(require("./external"), exports); | ||
//# sourceMappingURL=index.js.map |
{ | ||
"name": "gwen", | ||
"version": "0.13.0", | ||
"version": "0.14.0", | ||
"description": "A utility-first CSS library designed for brevity", | ||
@@ -45,3 +45,4 @@ "main": "./lib/src/index.js", | ||
"play": "nodemon -e ts -w . -x ts-node playground.ts", | ||
"generate": "ts-node generate.ts" | ||
"generate": "ts-node generate.ts", | ||
"generate:abbrs": "ts-node --project tsconfig.json generateAbbrs.ts" | ||
}, | ||
@@ -52,2 +53,4 @@ "devDependencies": { | ||
"@types/node": "^14.0.13", | ||
"@types/react": "^18.0.3", | ||
"cssdata": "git+https://github.com/mdn/data.git#ff55c39c1da3f1519e3a8f890a7cf6e6339a4b87", | ||
"jest": "^25.1.0", | ||
@@ -57,6 +60,9 @@ "make-coverage-badge": "^1.2.0", | ||
"prettier": "^1.19.1", | ||
"react": "^18.0.0", | ||
"react-dom": "^18.0.0", | ||
"ts-jest": "^25.2.1", | ||
"ts-node": "^10.4.0", | ||
"tslint": "^6.1.0", | ||
"tslint-config-prettier": "^1.18.0", | ||
"typescript": "3.7" | ||
"typescript": "4.4" | ||
}, | ||
@@ -66,2 +72,2 @@ "peerDependencies": { | ||
} | ||
} | ||
} |
@@ -11,3 +11,3 @@ <h1 align="center">Gwen</h1> | ||
<br/> | ||
created by <a href="https://twitter.com/vriad" target="_blank">@vriad</a> 👋 | ||
a <a href="https://twitter.com/colinhacks" target="_blank">@colinhacks</a> production | ||
</p> | ||
@@ -41,2 +41,12 @@ | ||
```ts | ||
import { Gwen } from 'gwen'; | ||
const gwen = new Gwen(); | ||
function Component() { | ||
return <p className={gwen.fontSize(14).color('blue').class}>Hello there</p>; | ||
} | ||
``` | ||
# Changelog | ||
@@ -43,0 +53,0 @@ |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Filesystem access
Supply chain riskAccesses the file system, and could potentially read sensitive data.
Found 1 instance in 1 package
36
2210
55
119572
16
1
1