[Major] Default theme and advanced theme updated

projects/dxc-ngx-cdk-site/src/app/components/theme-builder/dynamic-component/theme-builder-dynamic.module.ts

@@ -35,8 +35,6 @@ import { UploadPreviewComponent } from '../../../pages/theme-builder/previews/up
 import { TablePreviewComponent } from '../../../pages/theme-builder/previews/table-preview/table-preview.component';
 import { NewInputTextPreviewComponent } from '../../../pages/theme-builder/previews/new-input-text-preview/new-input-text-preview.component';
 import { NewDatePreviewComponent } from "src/app/pages/theme-builder/previews/new-date-preview/new-date-preview.component";
-import { PasswordPreviewComponent } from '../../../pages/theme-builder/previews/password-preview/password-preview.component';
-import { NumberPreviewComponent } from '../../../pages/theme-builder/previews/number-preview/number-preview.component';
 import { NewTextareaPreviewComponent } from "src/app/pages/theme-builder/previews/new-textarea-preview/new-textarea-preview.component";
 
 @NgModule({
@@ -76,8 +74,6 @@ import { NewTextareaPreviewComponent } from "src/app/pages/theme-builder/preview
     UploadPreviewComponent,
     TablePreviewComponent,
     NewDatePreviewComponent,
-    PasswordPreviewComponent,
-    NumberPreviewComponent,
     NewTextareaPreviewComponent
   ]
 })

projects/dxc-ngx-cdk-site/src/app/pages/components-page/components-page.component.scss

@@ -3,7 +3,6 @@
 }
 
 .body-container {
-  font-family: var(--fontFamily);
   display: flex;
   min-height: 100vh;
 }

projects/dxc-ngx-cdk-site/src/app/pages/components-sidenav/components-sidenav-menu/components-sidenav-menu.component.scss

@@ -8,7 +8,6 @@
   margin-block-end: 0.67em;
   margin-inline-start: 0px;
   margin-inline-end: 0px;
-  font-family: var(--fontFamily);
   font-size: 24px;
   display: flex;
   -webkit-box-align: center;
@@ -55,7 +54,6 @@
   }
   .sidenav-links {
     padding: 0px 20px;
-    font-family: var(--fontFamily);
     .nav-item {
       margin-bottom: 5px;
       padding-left: 0px;

projects/dxc-ngx-cdk-site/src/app/pages/components-sidenav/components-sidenav.component.scss

@@ -1,5 +1,4 @@
 .body-container {
-  font-family: var(--fontFamily);
   display: flex;
   min-height: 100vh;
 }

projects/dxc-ngx-cdk-site/src/app/pages/overview-page/overview-page.component.scss

@@ -21,14 +21,12 @@ div.overview-header-titles {
 h1.overview-header-title {
   margin: 0px;
   font-size: 35px;
-  font-family: var(--fontFamily);
   line-height: 40px;
 }
 
 h2.overview-header-subtitle {
   margin: 0px;
   font-size: 25px;
-  font-family: var(--fontFamily);
   line-height: 20px;
   color: #474747;
   font-weight: normal;

projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/accordion-preview/accordion-preview.component.html

@@ -8,8 +8,10 @@
     >
       <div>
         <dxc-button label="hola" mode="text"> </dxc-button>
-        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
-        malesuada lacus ex, sit amet blandit leo lobortis eget.</p>
+        <p>
+          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
+          malesuada lacus ex, sit amet blandit leo lobortis eget.
+        </p>
       </div>
     </dxc-accordion>
   </tbuilder-component-mode>
@@ -22,6 +24,18 @@
       padding="medium"
       disabled
     >
+      <dxc-accordion-icon>
+        <svg fill="currentColor" viewBox="0 0 24 24">
+          <g id="Bounding_Box">
+            <rect fill="none" width="24" height="24" />
+          </g>
+          <g id="Master">
+            <path
+              d="M19,9.3V4h-3v2.6L12,3L2,12h3v8h5v-6h4v6h5v-8h3L19,9.3z M10,10c0-1.1,0.9-2,2-2s2,0.9,2,2H10z"
+            />
+          </g>
+        </svg>
+      </dxc-accordion-icon>
       <div>
         Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
         malesuada lacus ex, sit amet blandit leo lobortis eget.

projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/button-preview/button-preview.component.html

@@ -19,6 +19,38 @@
           </svg>
         </dxc-button-icon>
       </dxc-button>
+      <dxc-button margin="xxsmall">
+        <dxc-button-icon
+          ><svg
+            xmlns="http://www.w3.org/2000/svg"
+            width="24"
+            height="24"
+            viewBox="0 0 24 24"
+            fill="currentColor"
+          >
+            <path d="M0 0h24v24H0z" fill="none" />
+            <path
+              d="M19.35 10.04C18.67 6.59 15.64 4 12 4 9.11 4 6.6 5.64 5.35 8.04 2.34 8.36 0 10.91 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96zM14 13v4h-4v-4H7l5-5 5 5h-3z"
+            />
+          </svg>
+        </dxc-button-icon>
+      </dxc-button>
+      <dxc-button label="Button" margin="xxsmall" iconPosition="after">
+        <dxc-button-icon
+          ><svg
+            xmlns="http://www.w3.org/2000/svg"
+            width="24"
+            height="24"
+            viewBox="0 0 24 24"
+            fill="currentColor"
+          >
+            <path d="M0 0h24v24H0z" fill="none" />
+            <path
+              d="M19.35 10.04C18.67 6.59 15.64 4 12 4 9.11 4 6.6 5.64 5.35 8.04 2.34 8.36 0 10.91 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96zM14 13v4h-4v-4H7l5-5 5 5h-3z"
+            />
+          </svg>
+        </dxc-button-icon>
+      </dxc-button>
       <dxc-button label="Button" margin="xxsmall" disabled></dxc-button>
     </tbuilder-component-mode>
 

projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/progress-bar-preview/progress-bar-preview.component.html

@@ -1,6 +1,6 @@
 <div>
   <tbuilder-component-mode text="Undeterminate Default">
-    <dxc-progressbar margin="xsmall" showValue="true" label="Loading...">
+    <dxc-progressbar margin="xsmall" showValue="true" label="Loading..." helperText="helperText">
     </dxc-progressbar>
   </tbuilder-component-mode>
 

projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/select-preview/select-preview.component.html

@@ -26,6 +26,20 @@
           [value]="option.value"
         ></dxc-select-option>
       </dxc-select>
+
+      <dxc-select
+        label="Icon Select"
+        margin="xsmall"
+        assistiveText="Assistive text"
+      >
+        <dxc-select-option
+          *ngFor="let option of optionsWithIconAndLabels"
+          [label]="option.label"
+          [value]="option.value"
+        >
+          <dxc-option-icon><img [src]="option.iconSrc" /></dxc-option-icon>
+        </dxc-select-option>
+      </dxc-select>
     </tbuilder-component-mode>
 
     <tbuilder-component-mode text="Multiple">
@@ -108,6 +122,20 @@
           [value]="option.value"
         ></dxc-select-option>
       </dxc-select>
+
+      <dxc-select
+        label="Icon Select"
+        margin="xsmall"
+        assistiveText="Assistive text"
+      >
+        <dxc-select-option
+          *ngFor="let option of optionsWithIconAndLabels"
+          [label]="option.label"
+          [value]="option.value"
+        >
+          <dxc-option-icon><img [src]="option.iconSrc" /></dxc-option-icon>
+        </dxc-select-option>
+      </dxc-select>
     </tbuilder-component-mode>
 
     <tbuilder-component-mode text="Multiple" mode="dark">

projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/previews/select-preview/select-preview.component.ts

@@ -20,6 +20,24 @@ export class SelectPreviewComponent implements OnInit {
     },
   ];
 
+  optionsWithIconAndLabels = [
+    {
+      value: 1,
+      iconSrc: "assets/img/home.svg",
+      label: "Home"
+    },
+    {
+      value: 2,
+      iconSrc: "assets/img/home.svg",
+      label: "House"
+    },
+    {
+      value: 3,
+      iconSrc: "assets/img/home.svg",
+      label: "Home"
+    }
+  ];
+
   multipleSelected = [""];
 
   constructor() {}

projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/theme-builder-sidenav/model/preview-components-map.ts

@@ -30,8 +30,6 @@ import { UploadPreviewComponent } from '../../previews/upload-preview/upload-pre
 import { TablePreviewComponent } from '../../previews/table-preview/table-preview.component';
 import { NewInputTextPreviewComponent } from '../../previews/new-input-text-preview/new-input-text-preview.component';
 import { NewDatePreviewComponent } from '../../previews/new-date-preview/new-date-preview.component';
-import { NumberPreviewComponent } from '../../previews/number-preview/number-preview.component';
-import { PasswordPreviewComponent } from '../../previews/password-preview/password-preview.component';
 import { NewTextareaPreviewComponent } from '../../previews/new-textarea-preview/new-textarea-preview.component';
 export interface PreviewThemeBuilderComponent{
   name: string;
@@ -55,11 +53,9 @@ const tBuilderComponentsPreviewList:Array<PreviewThemeBuilderComponent> = [
   {name: 'header', component: HeaderPreviewComponent},
   {name: 'heading', component: HeadingPreviewComponent},
   {name: 'inputText', component: InputTextPreviewComponent},
-  {name: 'input', component: NewInputTextPreviewComponent},
+  {name: 'newInputText', component: NewInputTextPreviewComponent},
   {name: 'link', component: LinkPreviewComponent},
   {name: 'newTextarea', component: NewTextareaPreviewComponent},
-  {name: 'number', component: NumberPreviewComponent},
-  {name: 'password', component: PasswordPreviewComponent},
   {name: 'paginator', component: PaginatorPreviewComponent},
   {name: 'progressBar', component: ProgressBarPreviewComponent},
   {name: 'radio', component: RadioPreviewComponent},

projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/theme-builder-sidenav/theme-builder-sidenav.component.scss

@@ -8,7 +8,6 @@
   margin-block-end: 0.67em;
   margin-inline-start: 0px;
   margin-inline-end: 0px;
-  font-family: var(--fontFamily);
   font-size: 24px;
   display: flex;
   -webkit-box-align: center;
@@ -55,7 +54,6 @@
   }
   .sidenav-links {
     padding: 0px 20px;
-    font-family: var(--fontFamily);
     .nav-item {
       margin-bottom: 5px;
       padding-left: 0px;

projects/dxc-ngx-cdk-site/src/app/pages/theme-builder/theme-builder.module.ts

@@ -76,8 +76,6 @@ import { UploadPreviewComponent } from './previews/upload-preview/upload-preview
 import { TablePreviewComponent } from './previews/table-preview/table-preview.component';
 import { NewInputTextPreviewComponent } from './previews/new-input-text-preview/new-input-text-preview.component';
 import { NewDatePreviewComponent } from './previews/new-date-preview/new-date-preview.component';
-import { PasswordPreviewComponent } from './previews/password-preview/password-preview.component';
-import { NumberPreviewComponent } from './previews/number-preview/number-preview.component';
 import { NewTextareaPreviewComponent } from './previews/new-textarea-preview/new-textarea-preview.component';
 
 @NgModule({
@@ -115,8 +113,6 @@ import { NewTextareaPreviewComponent } from './previews/new-textarea-preview/new
     TablePreviewComponent,
     NewInputTextPreviewComponent,
     NewDatePreviewComponent,
-    PasswordPreviewComponent,
-    NumberPreviewComponent,
     NewTextareaPreviewComponent,
   ],
   imports: [