Skip to content

Commit 7f52109

Browse files
saurabh-sali-hulkappssaurabh-sali-hulkapps
authored
Merge pull request #91 from HulkApps/development
Development
2 parents 67bcb72 + 407a9b0 commit 7f52109

File tree

14 files changed

+91
-54
lines changed

14 files changed

+91
-54
lines changed

‎package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,7 @@
4141
"core-js": "^3.3.2",
4242
"dayjs": "^1.10.4",
4343
"mitt": "^3.0.0",
44+
"portal-vue": "^2.1.7",
4445
"v-click-outside": "^3.0.1",
4546
"vue": "^2.6.14",
4647
"vue-apexcharts": "^1.6.1",

‎src/components/PBanner/PBanner.stories.js

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -78,6 +78,8 @@ const Template = (args, { argTypes }) => ({
7878
@dismiss="handleDismissAction"
7979
>
8080
Add weights to show accurate rates at checkout and when buying shipping
81+
labels in Shopify.Add weights to show accurate rates at checkout and when buying shipping
82+
labels in Shopify.Add weights to show accurate rates at checkout and when buying shipping
8183
labels in Shopify.
8284
</PBanner>`,
8385
methods: {
@@ -90,12 +92,4 @@ const Template = (args, { argTypes }) => ({
9092
export const Banner = Template.bind({});
9193

9294
Banner.args = {
93-
title: 'Some of your product variants are missing weights',
94-
action: {
95-
content: 'Edit variant weights',
96-
onAction: () => {
97-
alert('Edit variant weights');
98-
},
99-
disabled: false,
100-
},
10195
}

‎src/components/PButton/components/PUnstyledButton/PUnstyledButton.vue

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010
@blur="$emit('blur', $event)"
1111

1212
:url="href"
13+
:to="to"
1314
:external="external"
1415
:download="download"
1516

@@ -21,7 +22,7 @@
2122
:aria-describedby="ariaDescribedBy"
2223
:aria-pressed="pressed"
2324
@keydown="$emit('keyDown', $event)"
24-
@keyup="$emit('keyUp', $event)"
25+
@keyup="$emit('keyup', $event)"
2526
@keypress="$emit('keyPress', $event)"
2627
>
2728
<span class="Polaris-Button__Content">

‎src/components/PCard/components/PCardSection/PCardSection.vue

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
<template>
22
<div :class="className">
33
<div v-if="title || $slots.hasOwnProperty('title')" class="Polaris-Card__SectionHeader">
4-
<PSubheading v-bind="$attrs">
5-
<slot name="title">
4+
<slot name="title">
5+
<PSubheading v-bind="$attrs">
66
{{ title }}
7-
</slot>
8-
</PSubheading>
7+
</PSubheading>
8+
</slot>
99
</div>
1010
<!-- @slot Body of Card section -->
1111
<slot/>

‎src/components/PDatePicker/PDatePicker.vue

Lines changed: 15 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -72,16 +72,21 @@
7272
{{ prefix }}
7373
</template>
7474
</PTextField>
75-
<PButton icon="CalendarMajor" v-else>
76-
<PStack>
77-
<PStackItem style="padding: 2px 0;">
78-
{{ computedTextValue(picker) }}
79-
</PStackItem>
80-
<PStackItem v-if="clearable">
81-
<PIcon source="CircleCancelMinor" @click.stop="handleCancelClick"/>
82-
</PStackItem>
83-
</PStack>
84-
</PButton>
75+
<button class="Polaris-Button" v-else>
76+
<span class="Polaris-Button__Icon">
77+
<PIcon source="CalendarMajor"/>
78+
</span>
79+
<span class="Polaris-Button__Text">
80+
<PStack>
81+
<PStackItem style="padding: 2px 0;">
82+
{{ computedTextValue(picker) }}
83+
</PStackItem>
84+
<PStackItem v-if="clearable">
85+
<PIcon source="CircleCancelMinor" @click.stop="handleCancelClick"/>
86+
</PStackItem>
87+
</PStack>
88+
</span>
89+
</button>
8590
</template>
8691
<template v-if="!autoApply" slot="footer" slot-scope="data" class="slot">
8792
<PStack distribution="equalSpacing" alignment="center">

‎src/components/PModal/PModal.stories.js

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,16 @@ export default {
8181
type: null,
8282
},
8383
},
84+
title: {
85+
description: `**Props**: The content for the title of modal.
86+
\n**Slots**: Customize title.`,
87+
table: {
88+
category: 'Props | Slots',
89+
type: {
90+
summary: null,
91+
},
92+
},
93+
}
8494
},
8595
}
8696

‎src/components/PModal/PModal.vue

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,10 @@
22
<div>
33
<div v-if="open">
44
<PModalDialog :large="large" :small="small" :limitHeight="limitHeight">
5-
<PModalHeader v-if="title" @close="handleOnClick">
6-
{{ title }}
5+
<PModalHeader v-if="title || $slots.title" @close="handleOnClick">
6+
<slot name="title">
7+
{{ title }}
8+
</slot>
79
</PModalHeader>
810
<PModalCloseButton v-else :title="false" @click="$emit('close', $event)"/>
911
<div class="Polaris-Modal__BodyWrapper">

‎src/components/PPopover/PPopover.vue

Lines changed: 29 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template>
2-
<div ref="container">
2+
<div ref="container" :id="activatorId">
33
<!-- @slot Filter Activator content -->
44
<slot name="activator" :activate="onActivate"></slot>
55

@@ -184,6 +184,8 @@
184184
* Close filter menu when EscapeKey is pressed
185185
*/
186186
this.$emit('close', 'EscapeKeypress');
187+
/** @ignore */
188+
this.$emit('update:active', false);
187189
},
188190
handlePageClick(e) {
189191
const target = e.target;
@@ -196,6 +198,8 @@
196198
* Close filter menu when page is clicked
197199
*/
198200
this.$emit('close', 'Click');
201+
/** @ignore */
202+
this.$emit('update:active', false);
199203
},
200204
nodeContainsDescendant(haystack, needle) {
201205
if (haystack === needle) {
@@ -218,14 +222,33 @@
218222
},
219223
handleFocusFirstItem() {
220224
this.$emit('close', 'FocusOut');
225+
/** @ignore */
226+
this.$emit('update:active', false);
221227
},
222228
handleFocusLastItem() {
223229
this.$emit('close', 'FocusOut');
224-
},
225-
onClose() {
226230
/** @ignore */
227231
this.$emit('update:active', false);
232+
},
233+
onClose(event) {
228234
this.$emit('close', 'Click');
235+
/** @ignore */
236+
this.$emit('update:active', false);
237+
if (event && event.target) {
238+
const target = event.target;
239+
const contentNode = this.$refs['content-' + this.id];
240+
if (!this.findActivator()) {
241+
const popoverOverlay = document.getElementById(this.realId + 'Overlay');
242+
if (popoverOverlay) {
243+
popoverOverlay.remove();
244+
}
245+
} else {
246+
if ((contentNode != null && this.nodeContainsDescendant(contentNode, target)) ||
247+
this.nodeContainsDescendant(this.findActivator(), target) || !this.active) {
248+
return;
249+
}
250+
}
251+
}
229252
}
230253
},
231254
watch: {
@@ -247,10 +270,9 @@
247270
}
248271
},
249272
mounted() {
250-
if (this.$refs.container['firstElementChild'] !== null) {
251-
this.$refs.container['firstElementChild'].id = this.activatorId;
252-
}
253-
273+
// if (this.$refs.container['firstElementChild'] !== null) {
274+
// document.getElementById('popover-container').setAttribute('id', this.activatorId);
275+
// }
254276
window.addEventListener('click', this.handlePageClick);
255277
window.addEventListener('touchstart', this.handlePageClick);
256278
document.addEventListener('keyup', this.handleKeyPress);

‎src/components/PPopover/components/PPositionedOverlay/PPositionedOverlay.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
:id="id"
44
class="Polaris-PositionedOverlay"
55
:style="containerStyle"
6-
v-if="active"
6+
v-show="active"
77
ref="overlay">
88
<slot
99
name="overlay"

‎src/components/PTabs/PTabs.stories.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -108,13 +108,14 @@ const Template = (args, { argTypes }) => ({
108108
};
109109
},
110110
template: `
111-
<PCard>
111+
<!-- <PCard>-->
112112
<PTabs v-bind="$props" :tabs="items" @select="selectMenu" :selected="selectedTab">
113113
<PCardSection :title="(selectedTab !== null) ? items[selectedTab].content : ''">
114114
<p>Tab {{ selectedTab }} selected</p>
115115
</PCardSection>
116116
</PTabs>
117-
</PCard>`,
117+
<!-- </PCard>-->
118+
`,
118119
methods: {
119120
selectMenu(menuIndex) {
120121
this.selectedTab = menuIndex;

‎src/components/PTabs/components/PTab/PTab.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -121,6 +121,7 @@
121121
tabTitleClassNames() {
122122
return classNames(
123123
'Polaris-Tabs__Title',
124+
this.selected && 'Polaris-Tab__Tab--selected-title',
124125
);
125126
},
126127
tabIndex() {

‎src/components/PUnstyledLink/PUnstyledLink.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@
2929
* Set to for router link
3030
*/
3131
to: {
32-
type: String | Object,
32+
type: [String, Object],
3333
default: null,
3434
},
3535
/**

‎src/css/tabs.scss

Lines changed: 13 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
}
88

99
.Polaris-Tabs__Wrapper {
10-
border-bottom: 0.1rem solid $p-divider;
10+
border-bottom: 0.1rem solid rgba(202, 204, 207, 1);
1111
padding: 0 0.8rem;
1212
}
1313

@@ -35,24 +35,18 @@
3535
}
3636

3737
.Polaris-Tabs__Tab {
38-
color: inherit;
3938
text-decoration: none;
4039
-webkit-appearance: none;
4140
appearance: none;
4241
margin: 0;
43-
padding: 0;
4442
background: none;
4543
border: none;
46-
font-size: inherit;
47-
line-height: inherit;
48-
color: inherit;
4944
cursor: pointer;
5045
font-size: 1.5rem;
5146
font-weight: 400;
5247
line-height: 2rem;
5348
text-transform: initial;
5449
letter-spacing: initial;
55-
color: $p-text-subdued;
5650
color: $p-text;
5751
position: relative;
5852
justify-content: center;
@@ -64,12 +58,13 @@
6458
outline: none;
6559
text-align: center;
6660
white-space: nowrap;
67-
text-decoration: none;
68-
cursor: pointer;
6961
}
7062

7163
.Polaris-Tabs__Tab:visited {
7264
color: inherit;
65+
> .Polaris-Tabs__Title {
66+
color: inherit;
67+
}
7368
}
7469

7570
.Polaris-Tabs__Tab:focus {
@@ -86,14 +81,15 @@
8681
text-decoration: none;
8782
}
8883

89-
.Polaris-Tabs__Tab:hover .Polaris-Tabs__Title {
84+
.Polaris-Tabs__Tab:hover .Polaris-Tabs__Title,
85+
.Polaris-Tabs__Tab.Polaris-Tabs__Tab--selected:hover .Polaris-Tabs__Title {
9086
font-weight: 400;
9187
color: $p-text;
9288
background-color: transparent;
9389
}
9490

9591
.Polaris-Tabs__Tab:hover .Polaris-Tabs__Title::before {
96-
background-color: $p-border-hovered;
92+
background-color: $p-action-primary;
9793
}
9894

9995
.Polaris-Tabs__Tab:active .Polaris-Tabs__Title {
@@ -104,9 +100,10 @@
104100
background: $p-surface-primary-selected-pressed;
105101
}
106102

107-
.Polaris-Tabs__Tab:focus .Polaris-Tabs__Title {
103+
.Polaris-Tabs__Tab:focus .Polaris-Tabs__Title,
104+
.Polaris-Tabs__Tab.Polaris-Tabs__Tab--selected .Polaris-Tabs__Title {
108105
font-weight: 400;
109-
color: $p-text;
106+
color: $p-success;
110107
}
111108

112109
.Polaris-Tabs__Tab:focus:not(:active) .Polaris-Tabs__Title::after {
@@ -129,7 +126,7 @@
129126

130127
.Polaris-Tabs__Tab--selected .Polaris-Tabs__Title {
131128
outline: 0.3rem solid transparent;
132-
color: $p-text;
129+
color: $p-success;
133130
}
134131

135132
.Polaris-Tabs__Tab--selected .Polaris-Tabs__Title::before {
@@ -164,11 +161,9 @@
164161
content: '';
165162
position: absolute;
166163
bottom: -0.8rem;
167-
left: 0;
168-
right: 0;
164+
left: 1.6rem;
165+
right: 1.6rem;
169166
height: 0.3rem;
170-
border-top-left-radius: $p-border-radius-base;
171-
border-top-right-radius: $p-border-radius-base;
172167
}
173168

174169
.Polaris-Tabs--titleWithIcon {

‎yarn.lock

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10252,6 +10252,11 @@ polished@^4.0.5:
1025210252
dependencies:
1025310253
"@babel/runtime" "^7.16.7"
1025410254

10255+
portal-vue@^2.1.7:
10256+
version "2.1.7"
10257+
resolved "https://registry.yarnpkg.com/portal-vue/-/portal-vue-2.1.7.tgz#ea08069b25b640ca08a5b86f67c612f15f4e4ad4"
10258+
integrity sha512-+yCno2oB3xA7irTt0EU5Ezw22L2J51uKAacE/6hMPMoO/mx3h4rXFkkBkT4GFsMDv/vEe8TNKC3ujJJ0PTwb6g==
10259+
1025510260
posix-character-classes@^0.1.0:
1025610261
version "0.1.1"
1025710262
resolved "https://registry.yarnpkg.com/posix-character-classes/-/posix-character-classes-0.1.1.tgz#01eac0fe3b5af71a2a6c02feabb8c1fef7e00eab"

0 commit comments

Comments
 (0)