Merging master branch, Release 2.0.0-beta.2 (#826)

* AppSettings and config files docs. * appSettings and config files docs. * Doc tweaks. * Code sample cleanup * Max height transition (#804) * update builder version for skyux documentation * pass string to expandmode * Update container for component search * Use class instead of inline styles * work on text expand firefox bug * continue work on firefox transitions * Adjust text expand animation for firefox * Update tests for new text expand animation * Fix tslint errors * Update master plunker to point to beta release (#812) * List paging first page (#814) * Only set page number on search when paging exists * Add tests for search paging bug * Updates for beta.32 (#815) * Adding Autonumeric Pipe/Module (#792) * Adding Autonumeric * Fixed Test * Changed name from SkyAutonumeric to SkyNumeric * Changing formatting * Changes per comments, OptionsObject used * Updated wording * Email validation (#810) * created email validation ts * email validation scss * email validation code and test start * email validator testing files * last lint error fixed * component page summary * error message/red halo doesn't show until lost focus * Changes from Patrick * Changes from Patrick (took care of errors) * added form control for demo input box consistency * Fixed lint errors * Added sky-form-control to demo/removed onInit from module code * Lint errors * Add note about serving in Windows 10 with IE11 or Edge. (#820) * Add note about serving in Windows 10 with IE11 or Edge. * Rework note based on feedback from Bobby. * Updates for beta.33 (#825) * Fixed linting errors * Update package.json * Dont run skyux build for now * Updated travis script * Readded build * Moved remove commands * Updated version of builder * Updated changelog and version
blackbaud · Jun 23, 2017 · 25d137f · 25d137f
1 parent 963c999
commit 25d137f
Show file tree

Hide file tree

Showing 28 changed files with 875 additions and 26 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,13 @@
+# 2.0.0-rc.2 (2017-06-23)
+
+- Merged `master` branch.
+- Added support for SKY UX Builder 1.0.0-rc.3.
+
+# 2.0.0-beta.33 (2017-06-23)
+
+  - Added the SkyNumeric Pipe. (#764) (Thanks @Blackbaud-AdamSc)
+  - Added the email validation directive. (#379) (Thanks @Blackbaud-SandhyaRajasabeson)
+
 # 2.0.0-rc.1 (2017-06-20)
 
   - All the updates for 2.0.0-beta.32.
@@ -6,8 +16,6 @@
 
   - Fixed typo to change SkyTimepickerTimeOutput `ios8601` property to be `iso8601`.
 
-
-
 # 2.0.0-beta.32 (2017-06-20)
 
   - Tweaked animation for text-expand in firefox. (#695)

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@blackbaud/skyux",
-  "version": "2.0.0-rc.1",
+  "version": "2.0.0-rc.2",
   "description": "SKY UX built on Angular 2",
   "author": "Blackbaud, Inc.",
   "homepage": "https://github.com/blackbaud/skyux2",
@@ -48,20 +48,20 @@
     "@angular/platform-browser": "4.1.3",
     "@angular/platform-browser-dynamic": "4.1.3",
     "@angular/router": "4.1.3",
-    "core-js": "~2.4.1",
+    "core-js": "2.4.1",
     "dragula": "3.7.2",
     "font-awesome": "4.7.0",
     "intl": "1.2.5",
     "microedge-rxstate": "1.0.3",
     "moment": "2.18.1",
     "ng2-dragula": "1.3.1",
     "ng2-toastr": "4.0.1",
-    "rxjs": "~5.4.0",
-    "zone.js": "~0.8.10"
+    "rxjs": "5.4.0",
+    "zone.js": "0.8.10"
   },
   "devDependencies": {
     "@angular/compiler-cli": "4.1.3",
-    "@blackbaud/skyux-builder": "1.0.0-rc.2",
+    "@blackbaud/skyux-builder": "1.0.0-rc.3",
     "@blackbaud/stache": "2.0.0-beta.7",
     "@types/core-js": "0.9.41",
     "@types/jasmine": "2.5.47",

diff --git a/scripts/travis-script.sh b/scripts/travis-script.sh
@@ -4,14 +4,16 @@ set -e
 # Necessary to stop pull requests from forks from running outside of Savage
 # Override default of `npm test`
 if [ "$TRAVIS_SECURE_ENV_VARS" == "true" ]; then
-  ./scripts/browserstack-cleanup.sh && npm run ci
-
-  # Remove this line after stache and builder update to ng4:
+  # Remove duplicate libraries due to circular dependency:
   rimraf ./node_modules/@blackbaud/skyux/node_modules/@angular
+  rimraf ./node_modules/@blackbaud/skyux/node_modules/@blackbaud
   rimraf ./node_modules/@blackbaud/skyux-builder/node_modules/@angular
   rimraf ./node_modules/@blackbaud/stache/node_modules/@angular
 
+  ./scripts/browserstack-cleanup.sh && npm run ci
+
   skyux build && ./scripts/visual-baseline.sh
+
 else
   echo -e "Pull requests from forks are run via Savage."
 fi
diff --git a/src/app/components/demo-components.service.ts b/src/app/components/demo-components.service.ts
@@ -184,6 +184,29 @@ export class SkyDemoComponentsService {
           ];
         }
       },
+      {
+        name: 'Email Validation',
+        icon: 'check',
+        // tslint:disable-next-line
+        summary: `The email validation module allows the user to validate email format.`,
+        url: '/components/email-validation',
+        getCodeFiles: function () {
+          return [
+            {
+              name: 'email-validation-demo.component.html',
+              fileContents: require
+              ('!!raw-loader!./email-validation/email-validation-demo.component.html')
+            },
+            {
+              name: 'email-validation.component.ts',
+              fileContents: require
+              ('!!raw-loader!./email-validation/email-validation-demo.component.ts'),
+              componentName: 'SkyEmailValidationDemoComponent',
+              bootstrapSelector: 'sky-email-validation-demo'
+            }
+          ];
+        }
+      },
       {
         name: 'Error',
         icon: 'exclamation',
@@ -591,6 +614,26 @@ export class SkyDemoComponentsService {
           ];
         }
       },
+      {
+        name: 'Numeric',
+        icon: 'calculator',
+        summary: 'The Skynumeric Pipe shortens long numbers and can format as currency.',
+        url: '/components/numeric',
+        getCodeFiles: function () {
+          return [
+            {
+              name: 'numeric-demo.component.html',
+              fileContents: require('!!raw-loader!./numeric/numeric-demo.component.html')
+            },
+            {
+              name: 'numeric-demo.component.ts',
+              fileContents: require('!!raw-loader!./numeric/numeric-demo.component.ts'),
+              componentName: 'SkyNumericDemoComponent',
+              bootstrapSelector: 'sky-numeric-demo'
+            }
+          ];
+        }
+      },
       {
         name: 'Page summary',
         icon: 'newspaper-o',

diff --git a/src/app/components/email-validation/email-validation-demo.component.html b/src/app/components/email-validation/email-validation-demo.component.html
@@ -0,0 +1,12 @@
+<div style="max-width: 50%">
+    <input 
+        [(ngModel)]="emailValidator"
+        class="sky-form-control"
+        skyEmailValidation
+        #email="ngModel"/>
+    <div class="sky-error-label" *ngIf="email.errors && email.errors.skyEmail && (email.dirty && email.touched)">
+        <div [hidden]="!email.errors.skyEmail.invalid">
+            Please enter valid email with format [email protected]
+        </div>
+    </div>
+</div>
diff --git a/src/app/components/email-validation/email-validation-demo.component.ts b/src/app/components/email-validation/email-validation-demo.component.ts
@@ -0,0 +1,9 @@
+import { Component } from '@angular/core';
+
+@Component({
+    selector: 'sky-email-validation-demo',
+    templateUrl: './email-validation-demo.component.html'
+})
+export class SkyEmailValidationDemoComponent {
+    public emailValidator: string;
+}
diff --git a/src/app/components/email-validation/index.html b/src/app/components/email-validation/index.html
@@ -0,0 +1,17 @@
+<sky-demo-page title="Email Validation">
+    <sky-demo-page-summary>
+    The email validation module allows the user to validate email format.
+    </sky-demo-page-summary>  
+
+    <sky-demo-page-properties sectionHeading="Email validation input directive properties">
+        <sky-demo-page-property propertyName="skyEmailValidation">
+        When this attribute is placed on an input element, the input with validation properties is created. The error message will display if the input is not in the correct format. This directive will use <code>NgModel</code> for binding data.
+        </sky-demo-page-property>
+    </sky-demo-page-properties>  
+
+    <sky-demo-page-example>
+        <sky-email-validation-demo></sky-email-validation-demo>
+        <sky-demo-page-code demoName="Email Validation"></sky-demo-page-code>
+    </sky-demo-page-example>
+
+</sky-demo-page>
diff --git a/src/app/components/numeric/index.html b/src/app/components/numeric/index.html
@@ -0,0 +1,56 @@
+<sky-demo-page title="Numeric">
+  <sky-demo-page-summary>
+    The numeric pipe formats numbers to a shortened value if it is 1000 or more to a rounded number plus an abbreviation character. K for thousands, M for millions, B for billions and T for trillion. It will also format the shortened number as a currency as an option, with proper localization including currency symbol placement.
+    <br/><br/>
+    Pipe Usage: number_expression | skyNumeric[:NumericOptions] ]]
+    <br/>
+    Note: When creating the NumericOptions object in the template, You MUST have the space between the end of the options object bracket and the closing brackets for the pipe or it won't work.  See HTML code file below for examples.
+    <br/><br/>
+    It can also be imported as SkyNumericService and the formatNumber method called.  It uses a new NumericOptions class, which contains the three properties.  Create a new instance of the class with its parameters set and pass it in as the NumericOptions parameter.
+    <br/>
+    Method Usage: this.skyNumeric.formatNumber(value, NumericOptions)
+  </sky-demo-page-summary>
+
+  <sky-demo-page-properties>
+    <sky-demo-page-property
+        propertyName="value"
+    >
+      Number. This is the number_expression to be shortened.
+    </sky-demo-page-property>
+    <sky-demo-page-property
+        propertyName="Numeric Options"
+        isOptional="true"
+    >
+      NumericOptions object. This object contains arguments for the following options:
+    </sky-demo-page-property>
+    <div style="margin-left: 40px">
+    <sky-demo-page-property
+        propertyName="digits"
+        defaultValue="1"
+        isOptional="true"
+    >
+      Number. Specifies the maximum number of digits after the decimal separator.
+    </sky-demo-page-property>
+    <sky-demo-page-property
+        propertyName="format"
+        defaultValue="number"
+        isOptional="true"
+    >
+      String. Specifies if it should be formatted as currency. Options are 'currency' or 'number'.
+    </sky-demo-page-property>
+    <sky-demo-page-property
+        propertyName="iso"
+        defaultValue="USD"
+        isOptional="true"
+    >
+      String. Specifies the ISO4217 currency code to be used for currency formatting.
+    </sky-demo-page-property>
+    </div>
+  </sky-demo-page-properties>
+
+  <sky-demo-page-example>
+    <sky-numeric-demo></sky-numeric-demo>
+    <sky-demo-page-code demoName="Numeric"></sky-demo-page-code>
+  </sky-demo-page-example>
+
+</sky-demo-page>
diff --git a/src/app/components/numeric/numeric-demo.component.html b/src/app/components/numeric/numeric-demo.component.html
@@ -0,0 +1,167 @@
+<sky-definition-list labelWidth="200px">
+  <sky-definition-list-heading>
+    This is a sample of numeric formatting.
+  </sky-definition-list-heading>
+  <sky-definition-list-content>
+    <p>
+      <sky-definition-list-label>
+        1 with zero digits:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1 | skyNumeric:{digits: 0} }}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        1000 with zero digits:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1000 | skyNumeric:{digits: 0} }}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        1000 with one digit:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1000 | skyNumeric}}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        1100 with zero digits:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1100 | skyNumeric:{digits: 0} }}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        1100 with one digit:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1100 | skyNumeric}}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        1500 with zero digits:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1500 | skyNumeric:{digits: 0} }}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        1500 with one digit:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1500 | skyNumeric}}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        1000000 with any digits:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1000000 | skyNumeric:{digits: 0} }}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        1000000000 with any digits:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1000000000 | skyNumeric:{digits: 0} }}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        1000000000000 with any digits:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1000000000000 | skyNumeric:{digits: 0} }}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        1234000 with 2 digits:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1234000 | skyNumeric:{digits: 2} }}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        1235000000 with 2 digits:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1235000000 | skyNumeric:{digits: 2} }}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        1.45 with 1 digit:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1.45 | skyNumeric}}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        1234567 with 1 digit:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1234567 | skyNumeric}}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        15.50 as US dollar currency with 2 digits:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{15.50 | skyNumeric:{digits: 2, format: 'currency', iso: 'USD'} }}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        -15.50 as US dollar currency with 2 digits:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{-15.50 | skyNumeric:{digits: 2, format: 'currency', iso: 'USD'} }}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        1234567 as Euro currency with 2 digits:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1234567 | skyNumeric:{digits: 2, format: 'currency', iso: 'EUR'} }}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        1450 as UK Pound currency with 2 digits:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1450 | skyNumeric:{digits: 2, format: 'currency', iso: 'GBP'} }}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        1750 as Hong Kong Dollar currency with 1 digit:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1750 | skyNumeric:{digits: 1, format: 'currency', iso: 'HKD'} }}
+      </sky-definition-list-value>
+    </p>
+    <p>
+      <sky-definition-list-label>
+        1234567 as Japanese Yen currency with 3 digit:
+      </sky-definition-list-label>
+      <sky-definition-list-value>
+        {{1234567 | skyNumeric:{digits: 3, format: 'currency', iso: 'JPY'} }}
+      </sky-definition-list-value>
+    </p>
+  </sky-definition-list-content>
+</sky-definition-list>