@duoduo-oba/ng-devui/alert/ng-devui-alert.metadata.json

DevUI components based on Angular

{"__symbolic":"module","version":4,"metadata":{"AlertType":{"__symbolic":"interface"},"AlertComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":8,"character":1},"arguments":[{"selector":"d-alert","template":"<div class=\"devui-alert devui-alert-{{ type }} {{ cssClass }}\" *ngIf=\"!hide\">\r\n  <button type=\"button\" class=\"devui-close\" (click)=\"close()\" *ngIf=\"closeable\">\r\n    <svg\r\n      width=\"16px\"\r\n      height=\"16px\"\r\n      viewBox=\"0 0 14 14\"\r\n      version=\"1.1\"\r\n      xmlns=\"http://www.w3.org/2000/svg\"\r\n      xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n    >\r\n      <defs>\r\n        <polygon\r\n          id=\"path-1\"\r\n          points=\"8.07106781 6.65685425 10.8994949 3.82842712 12.3137085 5.24264069 9.48528137 8.07106781 12.3137085 10.8994949 10.8994949 12.3137085 8.07106781 9.48528137 5.24264069 12.3137085 3.82842712 10.8994949 6.65685425 8.07106781 3.82842712 5.24264069 5.24264069 3.82842712\"\r\n        ></polygon>\r\n      </defs>\r\n      <g id=\"error\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n        <use *ngIf=\"type != 'warning' && type != 'info'\" id=\"Mask\" class=\"devui-alert-icon-close-no-warn\" xlink:href=\"#path-1\"></use>\r\n        <use *ngIf=\"type == 'warning' || type == 'info'\" id=\"Mask\" class=\"devui-alert-icon-close-warn\" xlink:href=\"#path-1\"></use>\r\n      </g>\r\n    </svg>\r\n  </button>\r\n  <span class=\"devui-alert-icon\" *ngIf=\"showIcon !== false\">\r\n    <svg\r\n      *ngIf=\"type === 'success'\"\r\n      class=\"devui-icon devui-icon-success\"\r\n      viewBox=\"0 0 16 16\"\r\n      version=\"1.1\"\r\n      xmlns=\"http://www.w3.org/2000/svg\"\r\n      xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n    >\r\n      <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n        <circle cx=\"8\" cy=\"8\" r=\"7\"></circle>\r\n        <path d=\"M8,0 C3.6,0 0,3.6 0,8 C0,12.4 3.6,16 8,16 C12.4,16 16,12.4 16,8 C16,3.6 12.4,0 8,0 Z\" fill-rule=\"nonzero\"></path>\r\n        <polygon\r\n          stroke-width=\"0.4\"\r\n          fill-rule=\"nonzero\"\r\n          points=\"8.16 10.48 7.32 11.32 6.48 10.48 6.48 10.48 3.6 7.68 4.44 6.84 7.28 9.68 11.52 5.44 12.36 6.28\"\r\n        ></polygon>\r\n      </g>\r\n    </svg>\r\n    <svg\r\n      *ngIf=\"type === 'warning'\"\r\n      class=\"devui-icon devui-icon-warning\"\r\n      viewBox=\"0 0 16 16\"\r\n      version=\"1.1\"\r\n      xmlns=\"http://www.w3.org/2000/svg\"\r\n      xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n    >\r\n      <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n        <polygon\r\n          points=\"7.5 1.74501946 1.39184847 13.5954649 7.08947368 14.2207621 13.9973698 13.5954649 10.9383683 5.61273879 8.40084114 1.27624313\"\r\n        ></polygon>\r\n        <path\r\n          d=\"M8.51325441,0.127397589 C8.70423071,0.228333932 8.8605922,0.383286648 8.96244623,0.57254229 L15.8714442,13.4101975 C16.1549662,13.9370117 15.9538562,14.5918482 15.4222523,14.8728158 C15.2642579,14.9563203 15.0879506,15 14.9088903,15 L1.09089441,15 C0.488410063,15 0,14.5159904 0,13.9189343 C0,13.7414873 0.0440768395,13.5667684 0.128340519,13.4101975 L7.03733844,0.57254229 C7.32086049,0.0457280838 7.98165058,-0.153569987 8.51325441,0.127397589 Z M8.87894737,11.2105263 L7.08947368,11.2105263 L7.08947368,13 L8.87894737,13 L8.87894737,11.2105263 Z M8.96842105,4.5 L7,4.5 L7.08947368,9.86842105 L8.87894737,9.86842105 L8.96842105,4.5 Z\"\r\n        ></path>\r\n      </g>\r\n    </svg>\r\n    <svg\r\n      *ngIf=\"type === 'info'\"\r\n      class=\"devui-icon devui-icon-info\"\r\n      viewBox=\"0 0 16 16\"\r\n      version=\"1.1\"\r\n      xmlns=\"http://www.w3.org/2000/svg\"\r\n      xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n    >\r\n      <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n        <circle cx=\"8\" cy=\"8\" r=\"7\"></circle>\r\n        <g stroke-width=\"1\">\r\n          <path\r\n            d=\"M8,0 C3.6,0 0,3.6 0,8 C0,12.4 3.6,16 8,16 C12.4,16 16,12.4 16,8 C16,3.6 12.4,0 8,0 Z M9,5 L7,5 L7,3 L9,3 L9,5 Z M9,12.6 L7,12.6 L7,6.6 L9,6.6 L9,12.6 Z\"\r\n          ></path>\r\n        </g>\r\n      </g>\r\n    </svg>\r\n    <svg\r\n      *ngIf=\"type === 'danger'\"\r\n      class=\"devui-icon devui-icon-error\"\r\n      viewBox=\"0 0 16 16\"\r\n      version=\"1.1\"\r\n      xmlns=\"http://www.w3.org/2000/svg\"\r\n      xmlns:xlink=\"http://www.w3.org/1999/xlink\"\r\n    >\r\n      <g stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\r\n        <circle cx=\"8\" cy=\"8\" r=\"7\"></circle>\r\n        <path\r\n          d=\"M8,0 C3.6,0 0,3.6 0,8 C0,12.4 3.6,16 8,16 C12.4,16 16,12.4 16,8 C16,3.6 12.4,0 8,0 Z M9,12.6 L7,12.6 L7,10.6 L9,10.6 L9,12.6 Z M9,9.1 L7,9.1 L6.9,3.1 L9.1,3.1 L9,9.1 Z\"\r\n          fill-rule=\"nonzero\"\r\n        ></path>\r\n      </g>\r\n    </svg>\r\n  </span>\r\n  <ng-content></ng-content>\r\n</div>\r\n","styles":[":host{display:block}.devui-alert{color:#252b3a;font-size:12px;border:1px solid transparent;padding:10px;line-height:20px}.devui-alert button.devui-close{color:#252b3a;opacity:1;box-shadow:none}.devui-alert button.devui-close>svg use{fill:#fff}.devui-alert button.devui-close span{color:#252b3a;font-size:12px;font-weight:700}.devui-alert.devui-alert-success{background-color:#edfff9;border-color:#50d4ab;color:#252b3a}.devui-alert.devui-alert-success button.devui-close{color:#50d4ab}.devui-alert.devui-alert-success button.devui-close>svg use{fill:#50d4ab}.devui-alert.devui-alert-info{background-color:#e9edfa;border-color:#96adfa;color:#252b3a}.devui-alert.devui-alert-info button.devui-close{color:#5e7ce0}.devui-alert.devui-alert-info button.devui-close>svg use{fill:#5e7ce0}.devui-alert.devui-alert-warning{background-color:#fff3e8;border-color:#ffbf85;color:#252b3a}.devui-alert.devui-alert-warning button.devui-close{color:#fac20a}.devui-alert.devui-alert-warning button.devui-close>svg use{fill:#fac20a}.devui-alert.devui-alert-danger{background-color:#ffeeed;border-color:#ffa4a1;color:#252b3a}.devui-alert.devui-alert-danger button.devui-close{color:#f66f6a}.devui-alert.devui-alert-danger button.devui-close>svg use{fill:#f66f6a}.devui-alert .devui-alert-icon{margin-right:10px}.devui-alert svg.devui-icon{width:16px;height:16px;vertical-align:middle;-webkit-transform:translateY(-1px);transform:translateY(-1px)}.devui-alert .devui-icon.icon-success>g>path{fill:#50d4ab}.devui-alert .devui-icon.icon-success>g>circle,.devui-alert .devui-icon.icon-success>g>polygon,.devui-alert .devui-icon.icon-warning>g>polygon{fill:#fff}.devui-alert .devui-icon.icon-warning>g>path{fill:#fac20a}.devui-alert .devui-icon.icon-info>g>g{fill:#5e7ce0}.devui-alert .devui-icon.icon-info>g>circle{fill:#fff}.devui-alert .devui-icon.icon-error>g>path{fill:#f66f6a}.devui-alert .devui-icon.icon-error>g>circle{fill:#fff}.devui-alert-icon{margin-right:10px}svg.devui-icon{width:16px;height:16px;vertical-align:middle;-webkit-transform:translateY(-1px);transform:translateY(-1px)}.devui-icon.devui-icon-success>g>path{fill:#50d4ab}.devui-icon.devui-icon-success>g>circle,.devui-icon.devui-icon-success>g>polygon,.devui-icon.devui-icon-warning>g>polygon{fill:#fff}.devui-icon.devui-icon-warning>g>path{fill:#fac20a}.devui-icon.devui-icon-info>g>g{fill:#5e7ce0}.devui-icon.devui-icon-info>g>circle{fill:#fff}.devui-icon.devui-icon-error>g>path{fill:#f66f6a}.devui-icon.devui-icon-error>g>circle{fill:#fff}"]}]}],"members":{"type":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"cssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"closeable":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"content":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"showIcon":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"closeEvent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":19,"character":3}}]}],"dismissTime":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"close":[{"__symbolic":"method"}]}},"AlertModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":5,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":6,"character":12}],"exports":[{"__symbolic":"reference","name":"AlertComponent"}],"declarations":[{"__symbolic":"reference","name":"AlertComponent"}],"providers":[]}]}],"members":{}}},"origins":{"AlertType":"./alert.types","AlertComponent":"./alert.component","AlertModule":"./alert.module"},"importAs":"ng-devui/alert"}