cosmic-components
Advanced tools
Comparing version 0.0.1-alpha.5 to 0.0.1-alpha.6
@@ -16,3 +16,3 @@ /** | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.CAROUSEL_DEACHED = exports.CAROUSEL_ATTACHED = exports.CLICK_LINK = exports.CLICK_IMAGE = exports.CLICK_PARAGRAPH = exports.CLICK_BUTTON = void 0; | ||
exports.CLICK_AVATAR = exports.CAROUSEL_DEACHED = exports.CAROUSEL_ATTACHED = exports.CLICK_LINK = exports.CLICK_IMAGE = exports.CLICK_PARAGRAPH = exports.CLICK_BUTTON = void 0; | ||
exports.CLICK_BUTTON = 'click:button'; | ||
@@ -25,2 +25,3 @@ exports.CLICK_PARAGRAPH = 'click:paragraph'; | ||
exports.CAROUSEL_DEACHED = 'UI:carouselItemDetached'; | ||
exports.CLICK_AVATAR = 'click:avatar'; | ||
; | ||
@@ -31,3 +32,4 @@ ; | ||
; | ||
; | ||
}); | ||
//# sourceMappingURL=action.js.map |
@@ -36,18 +36,21 @@ /** | ||
var Base_1 = __importDefault(require("../Base")); | ||
var Button = /** @class */ (function (_super) { | ||
__extends(Button, _super); | ||
function Button() { | ||
var Divider = /** @class */ (function (_super) { | ||
__extends(Divider, _super); | ||
function Divider() { | ||
return _super !== null && _super.apply(this, arguments) || this; | ||
} | ||
Button.prototype.initData = function () { | ||
Divider.prototype.initData = function () { | ||
var _a, _b; | ||
var slotLength = !!((_b = (_a = this.sourceSlots) === null || _a === void 0 ? void 0 : _a.noname) === null || _b === void 0 ? void 0 : _b.length) || 0; | ||
return Object.assign({}, _super.prototype.initData.call(this), { | ||
styles: cosmic_ui_1.divider, | ||
direction: 'horizontal' | ||
direction: 'horizontal', | ||
hasSlot: slotLength > 0 | ||
}); | ||
}; | ||
Button.template = "\n <div class=\"{{styles[direction]}}\">\n <div class=\"{{styles.text}}\">\n <slot></slot>\n </div>\n </div>\n "; | ||
return Button; | ||
Divider.template = "\n <div class=\"{{styles[direction]}}\">\n <div s-if=\"hasSlot\" class=\"{{styles.slotContainer}}\">\n <slot></slot>\n </div>\n </div>\n "; | ||
return Divider; | ||
}(Base_1.default)); | ||
exports.default = Button; | ||
exports.default = Divider; | ||
}); | ||
//# sourceMappingURL=index.js.map |
/** | ||
* @file Image | ||
* @author Sheeta(wuhayao@gmail.com) | ||
* @author corcordium | ||
*/ | ||
@@ -5,0 +5,0 @@ var __extends = (this && this.__extends) || (function () { |
@@ -10,3 +10,3 @@ var __importDefault = (this && this.__importDefault) || function (mod) { | ||
else if (typeof define === "function" && define.amd) { | ||
define(["require", "exports", "./Button", "./Paragraph", "./Grid", "./Carousel", "./Image", "./Input", "./Tabs", "./Tag", "./Rate", "./Divider", "./Link/web"], factory); | ||
define(["require", "exports", "./Button", "./Paragraph", "./Grid", "./Carousel", "./Image", "./Input", "./Tabs", "./Tag", "./Rate", "./Divider", "./List", "./Link/web", "./Avatar"], factory); | ||
} | ||
@@ -16,3 +16,3 @@ })(function (require, exports) { | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.Link = exports.Divider = exports.Rate = exports.Tag = exports.TabPane = exports.Tabs = exports.Input = exports.Image = exports.CarouselItem = exports.Carousel = exports.Grid = exports.Paragraph = exports.Button = void 0; | ||
exports.Avatar = exports.Link = exports.List = exports.Divider = exports.Rate = exports.Tag = exports.TabPane = exports.Tabs = exports.Input = exports.Image = exports.CarouselItem = exports.Carousel = exports.Grid = exports.Paragraph = exports.Button = void 0; | ||
var Button_1 = require("./Button"); | ||
@@ -40,5 +40,9 @@ Object.defineProperty(exports, "Button", { enumerable: true, get: function () { return __importDefault(Button_1).default; } }); | ||
Object.defineProperty(exports, "Divider", { enumerable: true, get: function () { return __importDefault(Divider_1).default; } }); | ||
var List_1 = require("./List"); | ||
Object.defineProperty(exports, "List", { enumerable: true, get: function () { return __importDefault(List_1).default; } }); | ||
var web_1 = require("./Link/web"); | ||
Object.defineProperty(exports, "Link", { enumerable: true, get: function () { return __importDefault(web_1).default; } }); | ||
var Avatar_1 = require("./Avatar"); | ||
Object.defineProperty(exports, "Avatar", { enumerable: true, get: function () { return __importDefault(Avatar_1).default; } }); | ||
}); | ||
//# sourceMappingURL=index.js.map |
{ | ||
"name": "cosmic-components", | ||
"version": "0.0.1-alpha.5", | ||
"version": "0.0.1-alpha.6", | ||
"main": "./dist/index.js", | ||
@@ -13,3 +13,3 @@ "module": "./src/index.ts", | ||
"dependencies": { | ||
"cosmic-ui-alpha": "0.0.33", | ||
"cosmic-ui-alpha": "0.0.34", | ||
"prismjs": "~1.27.0", | ||
@@ -16,0 +16,0 @@ "san": "~3.11.1" |
@@ -14,2 +14,4 @@ /** | ||
export const CLICK_AVATAR = 'click:avatar'; | ||
export interface CLICK_BUTTON_PAYLOAD { | ||
@@ -34,1 +36,6 @@ event: Event; | ||
}; | ||
export interface CLICK_AVATAR_PAYLOAD { | ||
event: Event; | ||
}; | ||
@@ -50,2 +50,3 @@ /** | ||
initData() { | ||
@@ -52,0 +53,0 @@ return { |
``` san export=preview caption=基本使用 | ||
import {Component} from 'san'; | ||
import {Divider} from '@cosmic/components'; | ||
import styles from '@components/Divider/docs/styles.module.less'; | ||
export default class DividerNormal extends Component { | ||
@@ -12,2 +14,3 @@ | ||
放眼处皆自负才高八斗 | ||
<cc-Divider class="{{styles.customHorizontal}}"/> | ||
</div> | ||
@@ -21,5 +24,7 @@ `; | ||
initData() { | ||
return {}; | ||
return { | ||
styles | ||
}; | ||
} | ||
} | ||
``` |
``` san export=preview caption=设置文案,目前只支持文字居中 | ||
import {Component} from 'san'; | ||
import {Divider} from '@cosmic/components'; | ||
import styles from '@components/Divider/docs/styles.module.less'; | ||
export default class DividerSolt extends Component { | ||
@@ -10,4 +12,26 @@ | ||
据说, | ||
<cc-Divider> 用月光取暖的女子</cc-Divider> | ||
<cc-Divider > | ||
<span class="{{styles.slotText}}">用月光取暖的女子</span> | ||
</cc-Divider> | ||
从不受伤 | ||
<cc-Divider> | ||
<img | ||
src="http://pic.616pic.com/ys_img/00/44/76/yYdFMozXJd.jpg" | ||
class="{{styles.slotImg}}" | ||
/> | ||
</cc-Divider> | ||
<cc-Divider class="{{styles.slotCon}}"> | ||
<span>人生海海, 潮落之后是潮起</span> | ||
<img | ||
src="http://pic.616pic.com/ys_img/00/44/76/yYdFMozXJd.jpg" | ||
/> | ||
</cc-Divider> | ||
<cc-Divider class="{{styles.slotCon}}"> | ||
<span># 你说那是消磨, 笑柄, 罪过</span> | ||
</cc-Divider> | ||
<h4>但那就是我的英雄主义</h4> | ||
</div> | ||
@@ -21,5 +45,7 @@ `; | ||
initData() { | ||
return {}; | ||
return { | ||
styles | ||
}; | ||
} | ||
} | ||
``` |
``` san export=preview caption=垂直分割 | ||
import {Component} from 'san'; | ||
import {Divider} from '@cosmic/components'; | ||
import styles from '@components/Divider/docs/styles.module.less'; | ||
export default class DividerVertical extends Component { | ||
@@ -12,2 +14,3 @@ | ||
倒也坦诚无忧 | ||
<cc-divider direction='vertical' class="{{styles.customVertical}}" /> | ||
</div> | ||
@@ -22,2 +25,3 @@ `; | ||
return { | ||
styles | ||
} | ||
@@ -24,0 +28,0 @@ } |
@@ -10,18 +10,20 @@ /** | ||
export default class Button extends Base { | ||
export default class Divider extends Base { | ||
static template = ` | ||
<div class="{{styles[direction]}}"> | ||
<div class="{{styles.text}}"> | ||
<div s-if="hasSlot" class="{{styles.slotContainer}}"> | ||
<slot></slot> | ||
</div> | ||
</div> | ||
`; | ||
`; | ||
initData() { | ||
const slotLength = !!(this as any).sourceSlots?.noname?.length || 0; | ||
return Object.assign({}, super.initData(), { | ||
styles, | ||
direction: 'horizontal' | ||
direction: 'horizontal', | ||
hasSlot: slotLength > 0 | ||
}) as DividerData; | ||
} | ||
} |
@@ -7,4 +7,6 @@ import {BaseProps} from '../Base'; | ||
interface State {} | ||
interface State { | ||
hasSlot: boolean; | ||
} | ||
export interface DividerData extends Props, State {} |
@@ -1,2 +0,2 @@ | ||
``` san export=preview caption=通过预制实现不同颜色的按钮 | ||
``` san export=preview caption=通过预制设置图片的裁剪模式 | ||
import {Component} from 'san'; | ||
@@ -3,0 +3,0 @@ import {Image} from '@cosmic/components'; |
/** | ||
* @file Image | ||
* @author Sheeta(wuhayao@gmail.com) | ||
* @author corcordium | ||
*/ | ||
import Base, {BaseProps} from '../Base'; | ||
import Base from '../Base'; | ||
import { | ||
@@ -12,17 +12,4 @@ CLICK_IMAGE, | ||
import {image as styles} from 'cosmic-ui'; | ||
import {Props, State} from './interface'; | ||
interface Props extends BaseProps { | ||
src?: string; | ||
alt?: string; | ||
width?: number; | ||
height?: number; | ||
objectFit?: 'fill' | 'contain' | 'cover' | 'none' | 'scale-down'; | ||
} | ||
interface State { | ||
hasPlaceholder?: boolean; | ||
hasFallback?: boolean; | ||
hasContent?: boolean; | ||
} | ||
interface Data extends Props, State {} | ||
@@ -75,3 +62,2 @@ | ||
hasContent: !!(this as any).sourceSlots.named.content, | ||
loading: true, | ||
@@ -78,0 +64,0 @@ error: false |
@@ -12,2 +12,4 @@ export {default as Button} from './Button'; | ||
export {default as Divider} from './Divider'; | ||
export {default as List} from './List'; | ||
export {default as Link} from './Link/web'; | ||
export {default as Avatar} from './Avatar'; |
@@ -11,2 +11,3 @@ /** | ||
export declare const CAROUSEL_DEACHED = "UI:carouselItemDetached"; | ||
export declare const CLICK_AVATAR = "click:avatar"; | ||
export interface CLICK_BUTTON_PAYLOAD { | ||
@@ -30,1 +31,4 @@ event: Event; | ||
} | ||
export interface CLICK_AVATAR_PAYLOAD { | ||
event: Event; | ||
} |
@@ -7,5 +7,5 @@ /** | ||
import { DividerData } from './interface'; | ||
export default class Button extends Base { | ||
export default class Divider extends Base { | ||
static template: string; | ||
initData(): DividerData; | ||
} |
@@ -6,2 +6,3 @@ import { BaseProps } from '../Base'; | ||
interface State { | ||
hasSlot: boolean; | ||
} | ||
@@ -8,0 +9,0 @@ export interface DividerData extends Props, State { |
/** | ||
* @file Image | ||
* @author Sheeta(wuhayao@gmail.com) | ||
* @author corcordium | ||
*/ | ||
import Base, { BaseProps } from '../Base'; | ||
interface Props extends BaseProps { | ||
src?: string; | ||
alt?: string; | ||
width?: number; | ||
height?: number; | ||
objectFit?: 'fill' | 'contain' | 'cover' | 'none' | 'scale-down'; | ||
} | ||
interface State { | ||
hasPlaceholder?: boolean; | ||
hasFallback?: boolean; | ||
hasContent?: boolean; | ||
} | ||
import Base from '../Base'; | ||
import { Props, State } from './interface'; | ||
interface Data extends Props, State { | ||
@@ -19,0 +8,0 @@ } |
@@ -11,2 +11,4 @@ export { default as Button } from './Button'; | ||
export { default as Divider } from './Divider'; | ||
export { default as List } from './List'; | ||
export { default as Link } from './Link/web'; | ||
export { default as Avatar } from './Avatar'; |
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
Sorry, the diff of this file is not supported yet
278946
239
4730
+ Addedcosmic-ui-alpha@0.0.34(transitive)
- Removedcosmic-ui-alpha@0.0.33(transitive)
Updatedcosmic-ui-alpha@0.0.34