diff --git a/lerna.json b/lerna.json
index 4b0f3f910..6cad6f28f 100644
--- a/lerna.json
+++ b/lerna.json
@@ -1,7 +1,7 @@
 {
   "$schema": "node_modules/lerna/schemas/lerna-schema.json",
   "useNx": true,
-  "version": "0.10.4",
+  "version": "0.11.0",
   "packages": [
     "packages/web",
     "packages/react",
diff --git a/packages/angular/package-lock.json b/packages/angular/package-lock.json
index 67a82dc65..b718692bc 100644
--- a/packages/angular/package-lock.json
+++ b/packages/angular/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@cdssnc/gcds-components-angular",
-  "version": "0.10.4",
+  "version": "0.11.0",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@cdssnc/gcds-components-angular",
-      "version": "0.10.4",
+      "version": "0.11.0",
       "dependencies": {
         "tslib": "^2.3.0"
       },
diff --git a/packages/angular/package.json b/packages/angular/package.json
index d531b43cd..3f6a6b954 100644
--- a/packages/angular/package.json
+++ b/packages/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@cdssnc/gcds-components-angular",
-  "version": "0.10.4",
+  "version": "0.11.0",
   "author": "Government of Canada / Gouvernement du Canada",
   "description": "Angular wrapper for gcds-components",
   "homepage": "https://design-system.alpha.canada.ca/",
@@ -20,7 +20,7 @@
   "peerDependencies": {
     "@angular/common": "^15.2.0",
     "@angular/core": "^15.2.0",
-    "@cdssnc/gcds-components": "^0.10.4"
+    "@cdssnc/gcds-components": "^0.11.0"
   },
   "dependencies": {
     "tslib": "^2.3.0"
diff --git a/packages/angular/src/lib/stencil-generated/components.ts b/packages/angular/src/lib/stencil-generated/components.ts
index 0fa86ca35..0cfe1f85e 100644
--- a/packages/angular/src/lib/stencil-generated/components.ts
+++ b/packages/angular/src/lib/stencil-generated/components.ts
@@ -180,14 +180,14 @@ export declare interface GcdsCheckbox extends Components.GcdsCheckbox {
 
 
 @ProxyCmp({
-  inputs: ['centered', 'margin', 'padding', 'size', 'tag']
+  inputs: ['border', 'centered', 'margin', 'padding', 'size', 'tag']
 })
 @Component({
   selector: 'gcds-container',
   changeDetection: ChangeDetectionStrategy.OnPush,
   template: '<ng-content></ng-content>',
   // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-  inputs: ['centered', 'margin', 'padding', 'size', 'tag'],
+  inputs: ['border', 'centered', 'margin', 'padding', 'size', 'tag'],
 })
 export class GcdsContainer {
   protected el: HTMLElement;
diff --git a/packages/react/package-lock.json b/packages/react/package-lock.json
index f2462fab2..b419339c6 100644
--- a/packages/react/package-lock.json
+++ b/packages/react/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@cdssnc/gcds-components-react",
-  "version": "0.10.4",
+  "version": "0.11.0",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@cdssnc/gcds-components-react",
-      "version": "0.10.4",
+      "version": "0.11.0",
       "license": "MIT",
       "devDependencies": {
         "@types/react": "^18.0.28",
diff --git a/packages/react/package.json b/packages/react/package.json
index 860e4d67c..cdddfb151 100644
--- a/packages/react/package.json
+++ b/packages/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@cdssnc/gcds-components-react",
-  "version": "0.10.4",
+  "version": "0.11.0",
   "author": "Government of Canada / Gouvernement du Canada",
   "description": "React wrapper for gcds-components",
   "homepage": "https://design-system.alpha.canada.ca/",
@@ -29,7 +29,7 @@
     "gcds.css"
   ],
   "dependencies": {
-    "@cdssnc/gcds-components": "^0.10.4"
+    "@cdssnc/gcds-components": "^0.11.0"
   },
   "devDependencies": {
     "@types/react": "^18.0.28",
diff --git a/packages/react/src/components/stencil-generated/react-component-lib/utils/attachProps.ts b/packages/react/src/components/stencil-generated/react-component-lib/utils/attachProps.ts
index de2cc499b..9a1825f54 100644
--- a/packages/react/src/components/stencil-generated/react-component-lib/utils/attachProps.ts
+++ b/packages/react/src/components/stencil-generated/react-component-lib/utils/attachProps.ts
@@ -62,6 +62,17 @@ export const getClassName = (classList: DOMTokenList, newProps: any, oldProps: a
   return finalClassNames.join(' ');
 };
 
+/**
+ * Transforms a React event name to a browser event name.
+ */
+export const transformReactEventName = (eventNameSuffix: string) => {
+  switch (eventNameSuffix) {
+    case 'doubleclick':
+      return 'dblclick';
+  }
+  return eventNameSuffix;
+};
+
 /**
  * Checks if an event is supported in the current execution environment.
  * @license Modernizr 3.0.0pre (Custom Build) | MIT
@@ -70,7 +81,7 @@ export const isCoveredByReact = (eventNameSuffix: string) => {
   if (typeof document === 'undefined') {
     return true;
   } else {
-    const eventName = 'on' + eventNameSuffix;
+    const eventName = 'on' + transformReactEventName(eventNameSuffix);
     let isSupported = eventName in document;
 
     if (!isSupported) {
diff --git a/packages/web/package-lock.json b/packages/web/package-lock.json
index 02bc2615d..3882f8f38 100644
--- a/packages/web/package-lock.json
+++ b/packages/web/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@cdssnc/gcds-components",
-  "version": "0.10.4",
+  "version": "0.11.0",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@cdssnc/gcds-components",
-      "version": "0.10.4",
+      "version": "0.11.0",
       "license": "MIT",
       "dependencies": {
         "@stencil/core": "^3.0.0",
@@ -18,7 +18,7 @@
       "devDependencies": {
         "@axe-core/puppeteer": "^4.3.2",
         "@babel/core": "^7.20.12",
-        "@cdssnc/gcds-tokens": "^1.4.0",
+        "@cdssnc/gcds-tokens": "^1.4.1",
         "@fortawesome/fontawesome-free": "^6.3.0",
         "@node-minify/core": "^6.2.0",
         "@node-minify/uglify-es": "^6.2.0",
@@ -1923,9 +1923,9 @@
       "dev": true
     },
     "node_modules/@cdssnc/gcds-tokens": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/@cdssnc/gcds-tokens/-/gcds-tokens-1.4.0.tgz",
-      "integrity": "sha512-n865oG5ImYmwWyaXpxVE699aRJnpJcdEzyH9A8adch8dCiIw41X3qSiOx3ATEtNgTl32InWGdeBVq5/HVLgFJA==",
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/@cdssnc/gcds-tokens/-/gcds-tokens-1.4.1.tgz",
+      "integrity": "sha512-sd/ifqrOBoOjEkNHc9mnuJ/9TTITiXxZvh+nWvePhjWS1UM4KW2MjwfYFKXvmp60bu3Xmo80u9eolIYxA7w4OQ==",
       "dev": true
     },
     "node_modules/@cnakazawa/watch": {
@@ -28130,9 +28130,9 @@
       "dev": true
     },
     "@cdssnc/gcds-tokens": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/@cdssnc/gcds-tokens/-/gcds-tokens-1.4.0.tgz",
-      "integrity": "sha512-n865oG5ImYmwWyaXpxVE699aRJnpJcdEzyH9A8adch8dCiIw41X3qSiOx3ATEtNgTl32InWGdeBVq5/HVLgFJA==",
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/@cdssnc/gcds-tokens/-/gcds-tokens-1.4.1.tgz",
+      "integrity": "sha512-sd/ifqrOBoOjEkNHc9mnuJ/9TTITiXxZvh+nWvePhjWS1UM4KW2MjwfYFKXvmp60bu3Xmo80u9eolIYxA7w4OQ==",
       "dev": true
     },
     "@cnakazawa/watch": {
diff --git a/packages/web/package.json b/packages/web/package.json
index 183f76899..fa457b4b6 100644
--- a/packages/web/package.json
+++ b/packages/web/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@cdssnc/gcds-components",
-  "version": "0.10.4",
+  "version": "0.11.0",
   "author": "Government of Canada / Gouvernement du Canada",
   "description": "Web components for the GCDS",
   "homepage": "https://design-system.alpha.canada.ca/",
@@ -40,7 +40,7 @@
   "devDependencies": {
     "@axe-core/puppeteer": "^4.3.2",
     "@babel/core": "^7.20.12",
-    "@cdssnc/gcds-tokens": "^1.4.0",
+    "@cdssnc/gcds-tokens": "^1.4.1",
     "@fortawesome/fontawesome-free": "^6.3.0",
     "@node-minify/core": "^6.2.0",
     "@node-minify/uglify-es": "^6.2.0",
diff --git a/packages/web/src/components.d.ts b/packages/web/src/components.d.ts
index 9ac65896c..505dc4421 100644
--- a/packages/web/src/components.d.ts
+++ b/packages/web/src/components.d.ts
@@ -6,7 +6,6 @@
  */
 import { HTMLStencilElement, JSXBase } from "@stencil/core/internal";
 import { Validator, ValidatorEntry } from "./validators";
-export { Validator, ValidatorEntry } from "./validators";
 export namespace Components {
     interface GcdsAlert {
         /**
@@ -209,6 +208,10 @@ export namespace Components {
         "value": string;
     }
     interface GcdsContainer {
+        /**
+          * Defines if container has a border or not.
+         */
+        "border"?: boolean;
         /**
           * Defines if container is centered or not.
          */
@@ -1359,6 +1362,10 @@ declare namespace LocalJSX {
         "value"?: string;
     }
     interface GcdsContainer {
+        /**
+          * Defines if container has a border or not.
+         */
+        "border"?: boolean;
         /**
           * Defines if container is centered or not.
          */
diff --git a/packages/web/src/components/gcds-container/gcds-container.css b/packages/web/src/components/gcds-container/gcds-container.css
index 2d4b32d23..916bde19c 100644
--- a/packages/web/src/components/gcds-container/gcds-container.css
+++ b/packages/web/src/components/gcds-container/gcds-container.css
@@ -4,6 +4,11 @@
   padding: 0;
   box-sizing: border-box;
 
+  /* Container border */
+  &.container-border {
+    border: var(--gcds-container-border);
+  }
+
   /* Container centered */
   &.container-centered {
     margin-inline: auto !important;
diff --git a/packages/web/src/components/gcds-container/gcds-container.tsx b/packages/web/src/components/gcds-container/gcds-container.tsx
index e2e4ebe20..7b2d9b1eb 100644
--- a/packages/web/src/components/gcds-container/gcds-container.tsx
+++ b/packages/web/src/components/gcds-container/gcds-container.tsx
@@ -13,6 +13,11 @@ export class GcdsContainer {
    * Props
    */
 
+  /**
+   * Defines if container has a border or not.
+   */
+  @Prop() border?: boolean = false;
+
   /**
    * Defines if container is centered or not.
    */
@@ -39,7 +44,7 @@ export class GcdsContainer {
   @Prop() tag?: string = 'div';
 
   render() {
-    const { centered, margin, padding, size, tag } = this;
+    const { border, centered, margin, padding, size, tag } = this;
 
     const Tag = tag;
 
@@ -48,6 +53,7 @@ export class GcdsContainer {
         <Tag
           class={`
             gcds-container
+            ${border ? `container-border` : ''}
             ${centered ? `container-centered` : ''}
             ${margin ? `m-${margin}` : ''}
             ${padding ? `p-${padding}` : ''}
diff --git a/packages/web/src/components/gcds-container/readme.md b/packages/web/src/components/gcds-container/readme.md
index bee92880b..889acfd25 100644
--- a/packages/web/src/components/gcds-container/readme.md
+++ b/packages/web/src/components/gcds-container/readme.md
@@ -9,6 +9,7 @@
 
 | Property   | Attribute  | Description                                                                                                       | Type                                                                                                                                         | Default     |
 | ---------- | ---------- | ----------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
+| `border`   | `border`   | Defines if container has a border or not.                                                                         | `boolean`                                                                                                                                    | `false`     |
 | `centered` | `centered` | Defines if container is centered or not.                                                                          | `boolean`                                                                                                                                    | `false`     |
 | `margin`   | `margin`   | Defines the container's margin. Note that left and right margin will not be applied if the container is centered. | `"0" \| "100" \| "1000" \| "150" \| "200" \| "250" \| "300" \| "400" \| "450" \| "50" \| "500" \| "550" \| "600" \| "700" \| "800" \| "900"` | `undefined` |
 | `padding`  | `padding`  | Defines the container's padding.                                                                                  | `"0" \| "100" \| "1000" \| "150" \| "200" \| "250" \| "300" \| "400" \| "450" \| "50" \| "500" \| "550" \| "600" \| "700" \| "800" \| "900"` | `undefined` |
diff --git a/packages/web/src/components/gcds-container/test/gcds-container.spec.ts b/packages/web/src/components/gcds-container/test/gcds-container.spec.ts
index e08f5d227..67a277ec8 100644
--- a/packages/web/src/components/gcds-container/test/gcds-container.spec.ts
+++ b/packages/web/src/components/gcds-container/test/gcds-container.spec.ts
@@ -127,4 +127,64 @@ describe('gcds-grid', () => {
       </gcds-container>
     `);
   });
+
+  /**
+   * Spacing tests
+   */
+  it('renders container with margin', async () => {
+    const { root } = await newSpecPage({
+      components: [GcdsContainer],
+      html: `
+        <gcds-container margin="400" />
+      `,
+    });
+    expect(root).toEqualHtml(`
+      <gcds-container margin="400">
+        <mock:shadow-root>
+          <div class="gcds-container size-full m-400">
+            <slot></slot>
+          </div>
+        </mock:shadow-root>
+      </gcds-container>
+    `);
+  });
+
+  it('renders container with padding', async () => {
+    const { root } = await newSpecPage({
+      components: [GcdsContainer],
+      html: `
+        <gcds-container padding="400" />
+      `,
+    });
+    expect(root).toEqualHtml(`
+      <gcds-container padding="400">
+        <mock:shadow-root>
+          <div class="gcds-container size-full p-400">
+            <slot></slot>
+          </div>
+        </mock:shadow-root>
+      </gcds-container>
+    `);
+  });
+
+  /**
+   * Border test
+   */
+  it('renders container with border', async () => {
+    const { root } = await newSpecPage({
+      components: [GcdsContainer],
+      html: `
+        <gcds-container border />
+      `,
+    });
+    expect(root).toEqualHtml(`
+      <gcds-container border>
+        <mock:shadow-root>
+          <div class="gcds-container size-full container-border">
+            <slot></slot>
+          </div>
+        </mock:shadow-root>
+      </gcds-container>
+    `);
+  });
 });
diff --git a/packages/web/src/index.html b/packages/web/src/index.html
index 2c3b02911..93d8fefdb 100644
--- a/packages/web/src/index.html
+++ b/packages/web/src/index.html
@@ -211,16 +211,16 @@ <h3 class="mt-700 mb-400 bb-sm">Cards</h3>
       <!-- ------------- Containers ------------- -->
 
       <h3 class="mt-700 mb-400 bb-sm">Containers</h3>
-      <gcds-container container="full">
-        <div class="p-200 b-sm">I'm a responsive container. My size is only limited by the size of my parent container.</div>
+      <gcds-container size="full" border padding="400">
+        <p>I'm a responsive container. My size is only limited by the size of my parent container.</p>
       </gcds-container>
       <br/>
-      <gcds-container container="lg" centered>
-        <div class="p-200 b-sm">I'm a large, centred container. My max size is 64rem (1024px).</div>
+      <gcds-container size="lg" centered border padding="400">
+        <p>I'm a large, centred container. My max size is 64rem (1024px).</p>
       </gcds-container>
       <br/>
-      <gcds-container container="xs">
-        <div class="p-200 b-sm">I'm an extra-small container. My max size is 20rem (320px).</div>
+      <gcds-container size="xs" border padding="400">
+        <p>I'm an extra-small container. My max size is 20rem (320px).</p>
       </gcds-container>
 
       <!-- ------------- Details ------------- -->