Add Spright work item square list cog icon

change/@ni-spright-angular-acdc1b80-e7d4-4bf0-af8b-35b4926429e7.json

@@ -0,0 +1,7 @@
+{
+  "type": "minor",
+  "comment": "Add Angular standalone wrapper for spright work item square list cog icon",
+  "packageName": "@ni/spright-angular",
+  "email": "123377523+vivinkrishna-ni@users.noreply.github.com",
+  "dependentChangeType": "patch"
+}

change/@ni-spright-components-0626309b-5848-495b-bb0f-fc3bd50e54da.json

@@ -0,0 +1,7 @@
+{
+  "type": "minor",
+  "comment": "Add spright work item square list cog icon using work-order border theme token",
+  "packageName": "@ni/spright-components",
+  "email": "123377523+vivinkrishna-ni@users.noreply.github.com",
+  "dependentChangeType": "patch"
+}

packages/angular-workspace/spright-angular/icons/work-item-square-list-cog/ng-package.json

@@ -0,0 +1,6 @@
+{
+    "$schema": "../../../../../node_modules/ng-packagr/ng-package.schema.json",
+    "lib": {
+        "entryFile": "spright-icon-work-item-square-list-cog.directive.ts"
+    }
+}

packages/angular-workspace/spright-angular/icons/work-item-square-list-cog/spright-icon-work-item-square-list-cog.directive.ts

@@ -0,0 +1,16 @@
+import { Directive } from '@angular/core';
+import { type IconWorkItemSquareListCog, iconWorkItemSquareListCogTag } from '@ni/spright-components/dist/esm/icons/work-item-square-list-cog';
+import '@ni/spright-components/dist/esm/icons/work-item-square-list-cog';
+import { SprightIconBaseDirective } from '@ni/spright-angular/icon-base';
+
+export { type IconWorkItemSquareListCog, iconWorkItemSquareListCogTag };
+
+/**
+ * Spright square list cog icon directive for work order items
+ */
+@Directive({
+    selector: 'spright-icon-work-item-square-list-cog',
+    standalone: true
+})
+export class SprightIconWorkItemSquareListCogDirective extends SprightIconBaseDirective {
+}

packages/spright-components/src/icon-base/tests/icon-metadata.ts

@@ -46,6 +46,9 @@ export const iconMetadata: {
     IconWorkItemRectangleCheckLines: {
         tags: ['testing', 'verification', 'quality assurance', 'checklist']
     },
+    IconWorkItemSquareListCog: {
+        tags: ['work order', 'tasks', 'list', 'planning', 'operations']
+    },
     IconWorkItemUserHelmetSafety: {
         tags: ['job', 'work', 'worker', 'operator', 'technician', 'safety']
     },

packages/spright-components/src/icons/all-icons.ts

@@ -10,5 +10,6 @@ export { IconWorkItemCalendarWeek } from './work-item-calendar-week';
 export { IconWorkItemCalipers } from './work-item-calipers';
 export { IconWorkItemForklift } from './work-item-forklift';
 export { IconWorkItemRectangleCheckLines } from './work-item-rectangle-check-lines';
+export { IconWorkItemSquareListCog } from './work-item-square-list-cog';
 export { IconWorkItemUserHelmetSafety } from './work-item-user-helmet-safety';
 export { IconWorkItemWrenchHammer } from './work-item-wrench-hammer';

packages/spright-components/src/icons/work-item-square-list-cog/index.ts

@@ -0,0 +1,32 @@
+import { squareListCog16X16 } from '@ni/nimble-tokens/dist/icons/js';
+import { IconSvg } from '@ni/nimble-components/dist/esm/icon-svg';
+import { template } from '@ni/nimble-components/dist/esm/icon-svg/template';
+import { DesignSystem } from '@ni/fast-foundation';
+import { styles } from './styles';
+
+declare global {
+    interface HTMLElementTagNameMap {
+        'spright-icon-work-item-square-list-cog': IconWorkItemSquareListCog;
+    }
+}
+
+/**
+ * Spright square list cog icon for work order items
+ */
+export class IconWorkItemSquareListCog extends IconSvg {
+    public constructor() {
+        super(squareListCog16X16);
+    }
+}
+
+const sprightIconWorkItemSquareListCog = IconWorkItemSquareListCog.compose({
+    baseName: 'icon-work-item-square-list-cog',
+    template,
+    styles
+});
+
+DesignSystem.getOrCreate()
+    .withPrefix('spright')
+    .register(sprightIconWorkItemSquareListCog());
+
+export const iconWorkItemSquareListCogTag = 'spright-icon-work-item-square-list-cog';

packages/spright-components/src/icons/work-item-square-list-cog/styles.ts

@@ -0,0 +1,11 @@
+import { css } from '@ni/fast-element';
+import { calendarEventBorderWorkOrderColor } from '@ni/nimble-components/dist/esm/theme-provider/design-tokens';
+import { styles as iconSvgStyles } from '@ni/nimble-components/dist/esm/icon-svg/styles';
+
+export const styles = css`
+    ${iconSvgStyles}
+
+    .icon svg {
+        fill: ${calendarEventBorderWorkOrderColor};
+    }
+`;